textarea{
  font-size: 1.2em;
}
.link{
  cursor: pointer;
}

.mt10{
  margin-top: 10px;
}

.mb10{
  margin-bottom: 10px;
}

.textbutton:hover,
a:hover,
.link:hover,
.report_daily td.hover:hover{
  text-decoration: underline;
  color: #ef2222;
  cursor: pointer;
}
.report_daily td.no_hover:hover{
  text-decoration: none;
  color: #000;
}
.flex-right{
  margin-left: auto;
}
.right{
  text-align: right !important;
}
.lefttop{
  text-align: left;
  vertical-align: top;
}
.main_row main .datatable tbody .buttons div.a {
  font-size: 1.2rem;
  cursor: pointer;
}
.dayreport_tbl div.a {
  display: block;
  padding: 12px 5px;
  cursor: pointer;
}

.dayreport_tbl tbody td span.status_change {
  font-weight: bold;

  text-decoration: underline;
  padding: 0;
  font-size: 85%;
  display: inline;
  cursor: pointer;
}

.dayreport_tbl tbody td span.blue {
  color: #223bf5;
}
.dayreport_tbl tbody td span.yellow {
  color: #ffc30d;
}
.dayreport_tbl tbody tr.checked_area td span{
  color: black;
  font-weight: normal;
  text-decoration: none;
}
.dayreport_tbl tbody tr.checked_area td span.status_change:before {
  content: "";
  background-image: url(/images/check_icon.png);
  width: 1.3em;
  height: 1.3em;
  vertical-align: middle;
  margin-top: -2px;
  background-size: cover;
  display: inline-block;
  margin-right: 0.5em;
}

.day-report-sp button[type="button"].red {
  width: 100%;
  padding: 15px 0;
  margin: 20px 0 30px 0;
  font-size: 120%;
  font-weight: bold;
  color: #ffffff;
  background-color: #2f78a3;
  border: 0;
  border-radius: 10px;
}
.main_row main.partner{
  padding-left: 80px;
}
.main_row main .datatable tbody tr:hover {
  background: #eee;
}

.column-list{
  display: flex;
  flex-direction: column;
}
button{
  cursor: pointer;
}
.modal-window{
  display: block;
  z-index: 200;

    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    height: 85%;
    background-color: #ffffff;
    border-radius: 5px;

}
.modal-window.sml{

    width: 400px;
    height: auto;


}
.message{
  font-size: .9em;
  color:#f00;
}
.overlay{
  display: block;
}

.button-close {
  padding: 0!important;
  background-color: #51869f !important;
  border: 3px solid #ffffff !important;;
  color: #ffffff !important;;
  border-radius: 100px !important;;
  cursor: pointer;
}.dayreport_tbl tbody tr.checked_area td a {
    color: black;
    font-weight: normal;
    text-decoration: none;
}

.main_row main .container .column .input_wrap label:not(:first-child), .main_row main .container .column .input_wrap .label:not(:first-child) {
  margin-left: 1.0rem;
}
.driver-list{
  display: flex;
  flex-direction: row;
  margin-bottom: 10px;
}
.driver-list-sub{
  margin-bottom: 10px;
}
.day-report-sp table th {
  background-color: #3a476d;
  max-width: 130px;
  font-size: .9em;
  margin-right: 10px;
}
.day-report-sp table td {
  display: flex;
  flex-direction:row;
  align-items: center;
}
.day-report-sp table td span.unit,
.main_row main table.input_table td span.unit{
  margin-left: 5px;
}
.main_row main table.input_table td {
  word-break: break-all;
}
.day-report-sp table tr {
  display: flex;
  flex-direction:row;
  align-items: center;
}
.day-report-sp table tr.colmn td {
  flex-direction:column;
}

div.receipts{
  display: flex;
  flex-direction: row;
}
div.receipts div.label{
  width: 200px;
  font-weight: bold;
}
div.receipts div.receipt-item{
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
  padding-bottom: 5px;
   border-bottom:  1px solid #000;
}
div.receipts div.receipt-item div{
  margin-bottom: 10px;
}
div.receipts div.receipt-item div.image{
 max-width: 500px;
 margin-left: auto;
}
div.receipts div.receipt-item div.image img{
  width: 100%;
}


div.error{
  width: 100%;
  text-align: center;
  color:#ff0000;
  font-size: .8em;
  margin-bottom: 10px;
}

div.payment-report-box{
  margin-top: 20px;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items:start;
}
div.payment-report-box p.name{
  font-size: 1.2em;
}
div.report_casename_box{
  width: 100mm;
}
div.hnj-box{
  margin-left: auto;
  padding-top: 5mm;
}
div.report_period-box{
  width: 100%;
  display: flex;
  flex-direction: row;
  margin: 5mm 0 0 0;
}

div.report_period-box div.report_period{
  width: 300px;
  display: flex;
  flex-direction: row;
  margin: 0;
  align-items: center;
  justify-content: flex-start;
}
div.report_period-box div.report_period div.total{
  margin-left: 20px;
}


div.report_period-box div.report_payment_exe{
  margin: 0;
  display: flex;
  flex-direction: row;
  margin: 0;
  align-items: center;
  justify-content: flex-start;
}


.report_body table input.free_width {
  width: auto
}

.main_row main .datatable tbody .buttons{
  align-items: center;
}


.loading-window{
  position: fixed;
  top:0;
  left:0;
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 200;
}
.loading-window div{

}
.loading-window i{
  color: #f00;
  font-size: 40px;
}


header{
  height: 60px;
  box-sizing: border-box;
  position:fixed;
  top: 0;
  left: 0;
  width: 100vw;
  z-index: 100;
}
div.main_row{
  margin-top: 60px;
  position: relative;
}
div.side{
  position:fixed;
  top: 60px;
  left: 0;
  z-index: 101;
}



div.report_check-container{
  width: 1080px;
  height: calc(100vh - 300px);
  overflow-x: auto;
}
table.report_check{
  white-space: nowrap;
}
table.report_check td, table.report_check th{
  padding: 5px !important;
  font-size: .7em !important;
}

.sticky {
  position: sticky;
  top: 0;
  left: 0;
  background: none;
  color:#fff;
}
.sticky.white {
  background-color: #fff !important;
  color:#333;
}
.sticky::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background:#424242;
  color:#fff;
  z-index: -1;
}
.sticky.white::before {
  background: #fff !important;
}

div.column-detail{
  width: 100%;
  display: flex;
  flex-direction: row;
}
div.column-detail div.column-left{
  width: 50%;
  height: 100%;
}
div.column-detail div.column-right{
  width: 50%;
  background-color: #d0ddf1;
  padding: 20px;
  height: 100%;
  overflow-y: scroll;
  margin-bottom: 20px;

}
div.column-detail div.column-right h4{
  width: 100%;
  border-bottom: 1px solid #333;
  margin-bottom: 5px;
  margin-top: 10px;
  font-size: 1em;
}
div.column-detail div.column-right  div.item-list{
  font-size: .8em;
  margin-bottom: 20px;
}

div.column-detail div.column-right  div.item-list a:hover{
  text-decoration: underline;
}

.delete-window {
  display: flex;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 450px;
  height:200px;
  background-color: #ffffff;
  border-radius: 5px;
  z-index: 11;
  padding: 20px;
  flex-direction: column;
  border: 2px solid #000;
}
.delete-window div.message {
  font-size: .9em;
  margin-bottom: 30px;
  margin-top: 30px;
}
.delete-window div.button_wrap{
 
}

.buttons div.textbutton,
.right-buttons div.textbutton{
  cursor: pointer;
}

.buttons div.textbutton:hover,
.right-buttons div.textbutton:hover{
  text-decoration: underline;
}

.right-buttons{
  font-size: .8em;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  background-color: #ccc;
  padding: 5px;
  margin-bottom: 10px;
  border-radius: 5px;

}
.right-buttons div.link-item{
  margin:  0 10px;
}


.day-report-sp{
  margin-top: 80px;
  position: relative;
}
.sub-title{
  margin-top: 20px;
}
.sub-list{
  margin-left: 12px;
}


.tab-box{
  display: flex;
  flex-direction: row;
  width: 100%;
}
.tab-box div.tab-item{
  width: 50%;
  padding: 10px 0;
  text-align: center;
  box-sizing: border-box;
  border-top:1px solid #ccc;
  border-left:1px solid #ccc;
  border-right:1px solid #ccc;
  cursor: pointer;
}
.tab-box div.tab-item.selected{
   color:#fff;
   cursor: unset;
}

div.project-driver-list{
  position: fixed;
  top:120px;
  left:60px;
  font-size: .9em;
  background-color: #fff;
  padding: 20px;
  z-index: 2000;
  border: 1px solid #dcc;
  opacity: .88;
}

div.project-driver-list h3{
border-bottom: 1px solid #000;;
margin-bottom: 5px;
}
.report_body table th, .report_body table td.right{
  text-align: right;
  padding-right: 5px;
}

table.monthly-payment input{
  background-color: #f0f1e0;
}
table.monthly-payment input[type=number]{
  background-color: #e4f1e0;
  text-align: right;
}
.main_row main .sub_narrow.report{
  max-width: none;
}
.report_body{
  height: auto;
  min-height: 297mm;
  font-size: .6em;
  /** font-size: .6em; **/
}

.report_body.spot{
  height: auto;
    min-height: 210mm;
    font-size: .6em;
    height: 210mm;
    width: 297mm;
}
.report_body table input {
  width: 85%;
}
.report_body table th {
  min-width:2em;
  text-align: center;
}
.report_body table tr.new_row{
    background-color: rgb(206, 246, 233);
    cursor: pointer;
}

.report_body table td.lefttop {
  text-align: left;
  vertical-align: top;
}


.inner.full{
      width: 100%;
      min-width: 1120px;
      padding-left: 50px;
}
.report_body table.spot{
  font-size: .8em;
}
.report_body table input.sml-input{
  width: 60%;
}
.report_body table input.half-input{
  width: 50%;
}
.report_body table th.min10 {
  min-width: 15em;
}
.reload{
  cursor: pointer;
  text-align: right;
  
}
.report_ttl{
  width: 100%;
  padding-left:0;
}
.report_ttl.spot{
  width: 100%;
  padding-left:0;
}
.report_ttl.center{
  width: 100%;
  padding-left:0;
  padding-right: 0;
  text-align: center;
}


.history-item{
  width: 100%;
}


.day-report-sp table input.w50{
  width: 50% !important;
}

.day-report-sp table input.time,
input.time{
  border: 1px solid #cccccc !important;
    border-radius: 10px!important;
    font-size: 1em!important;
    padding: 1.2rem 1.5rem!important;
    box-sizing: border-box!important;
    background: #f5f5f5!important;
    
}

input.w75{
  width: 75%;
}
div.common_links a{
  display: block;
}

table.monthly-payment td{
  position: relative;
}
td span.delete-item{
  position: absolute;
  left:-15px;
  top:-2px;
  cursor: pointer;
  font-size: 1.4em;
}

.copyied{
  background-color: #000;
  color: #fff;
  padding: 3px;
  font-size:.7em;
  margin-left: 5px;
}
.report_manth.spot{
  width: 100%;
  text-align: left;
}

.report_manth.center{
  width: 100%;
  text-align: center;
}

.check_wrap{
  display: flex;
  flex-direction: row;
  align-items: center;
}

.check_wrap input{
  margin-right: 5px;
  flex-shrink: 0;
}
.check_wrap label{
  margin-right: 20px;
  flex-shrink: 0;
}

label.radio input[type=radio] + span + b, label.radio input[type=checkbox] + span + b, label.check input[type=radio] + span + b, label.check input[type=checkbox] + span + b {
  margin-left: 0.2rem;
}


div.mreport_list{
  position: fixed;
  top:70px;
  left:70px;
  border: 1px solid #000;
  padding: 10px;
  font-size: .6em;
  background-color: #fff;
  z-index: 20;
}

div.mreport_list div.title{
  width: 100%;
  border-bottom: 1px solid #777;
  padding: 2px 0 ;
  margin-bottom: 5px;
  font-weight: bold;
}
div.mreport_list div.mlist-item{
  background-color: #ddd;
  margin-bottom: 2px;
  padding: 5px;
}

.day-report-sp table {
  padding: 20px 0;
}
select.description{
  margin-bottom: 10px;
}

select.small{
  border: 1px solid #cccccc;
  border-radius: 0;
  font-size: .8em;
  padding:.2em;
  box-sizing: border-box;
  background: #f5f5f5;
}
div.bank_info{
  margin-top: 20px;
}
td.w40{
  width: 40px;
}
td.w60{
  width: 60px;
}

td.w70{
  width: 70px;
}

td.w80{
  width: 90px;
}

td.w100{
  width: 100px;
}

.link-list-item ul{
  list-style-type:disc;
  margin-bottom: 5px;
}
.link-list-item ul li{
  margin-left: 25px;
  padding-left: 0;  
}


div.project-name{
  background-color: #3a476d ;
  width: 100%;
  color:#fff;
  padding: 2px;
}
div.driver-name{
  margin-top: 5px;
  font-weight: bold;
  border-left: 6px solid #3a476d;
  padding: 2px 6px
}


div.copy{
  margin: 10px 0 0 20px ;
}