@charset "UTF-8";
@import 'https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css';

body{
    color:#333;
}
.alignC {
  text-align: center;
}

.alignR {
  text-align: right;
}

.alignL {
  text-align: left;
}

.container {
  margin-top: 10px;
}

#loading {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  background: #ccc;
  opacity: 0.5;
  width: 100%;
  height: 100%;
  text-align: center;
  padding: 10% 0;
}

.logo {
  width: 100px;
  height: 100px;
}

.form-control.picker__input:disabled,
.form-control.picker__input[readonly] {
  background-color: #fff;
}

h1 {
  margin: 10px 0;
}
h1 {
  text-align: center;
}

h1 img {
    max-width: 90%;
  width: 100px;
  height: 100px;
}

h2 {
  position: relative;
  /*相対位置*/
  padding: 0.5em 0.5em 0.5em 1.5em;
  /*アイコン分のスペース*/
  line-height: 1.4;
  /*行高*/
  color: #333;
  /*文字色*/
  border-top: dotted 1px gray;
  border-bottom: dotted 1px gray;
  background: #ffffff;
  font-size: 1.4em;
  margin: 20px 0;
}

h2:before {
  font-family: "Font Awesome 5 Free";
  /*忘れずに*/
  content: "\f073";
  /*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;
  /*絶対位置*/
  font-size: 1em;
  /*サイズ*/
  left: 0.25em;
  /*アイコンの位置*/
  top: 0.5em;
  /*アイコンの位置*/
  color: #333;
  /*アイコン色*/
}
h4 {
  color: #333;
  border-bottom: solid 2px #333;
  padding: 0.5em;
  //border-radius: 0.5em;
}
h4 span{
    margin-top:-3px;
    float:right;
    padding:3px 10px;
    border-radius: 10px;
    color:#fff;
    font-weight:bold;
    background:#d9534f;
}
.tbl_date_container{
    display:table;
    border-collapse:  collapse;
    width:100%;
}
.tbl_date_container .tbl_tr{
    display: table-row;
    /*display:flex;*/
}
.tbl_date_container .tbl_th,
.tbl_date_container .tbl_td{
    display:table-cell;
    border: solid 1px #666;
    text-align: center;
}

.tbl_date_container .tbl_th{
}
.tbl_date_container .tbl_td{
}

.btn-default {
  padding: 5px 30px 5px 10px !important;
  /*    width: 100px !important;*/
}

.btn-default .form-control {
  height: 1em;
  /*    width: 1.5em;*/
}

.btn-default .radio01 {
  display: inline-block;
}

.btn-default span {
  display: inline-block;
  padding-left: 2px;
}

.flatpickr-input[readonly] {
  background-color: #fff;
}

select option:disabled {
  background-color: #ddd;
  opacity: 1;
}


#page-top {
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #3f98ef;
  opacity: 0.6;
}

#page-top a {
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}

#page-top a::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f102";
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
.tbl_date{
    margin-top:20px;
}
.tbl_date_container{
    /*display:flex;*/
}
@media (min-width: 356px) {
    .tbl_date_container{
       /*display:flex;*/
    }
    .tbl_date_container .tbl_th,
    .tbl_date_container .tbl_td{
        padding:3px;
    }
    .tbl_date_container .tbl_th{
    }
    .tbl_date_container .tbl_td{
    }
    .tbl_am,
    .tbl_pm{
        padding:5px;
        width:49%;
    }
    .tbl_am{
        margin-right:1%;
    }
    .tbl_pm{
        margin-left:1%;
    }
}
@media (max-width: 355px) {
    .tbl_am,
    .tbl_pm{
        margin-top:5px;
    }
}
.tbl_am,
.tbl_pm{
    /*padding:5px;
    width:49%;*/
}
.tbl_am{
    /*margin-right:1%;*/
}
.tbl_pm{
    /*margin-left:1%;*/
}
.tbl_date_container span.am,
.tbl_date_container span.pm{
    padding:4px;
    font-size:12px;
    border-radius: 10px;
    color:#fff;
}
.tbl_date_container span.am{
    background:#1c9401;
}
.tbl_date_container span.pm{
    background:#d28101;
}
.tbl_sat{
    background:#e6effd;
}
.tbl_sun{
    background:#fde6f1;
}
.tbl_facility_disp{
    margin-top:5px;
    /*font-size:0.8em;*/
}
.no_stock{
    color:#f33;
}
.little_stock{
    color:#d28101;
}
.full_stock{
    color:#006ba3;
}

@media (max-width: 767px) {
  div#sidebar {
    width: 100%;
  }
}
@media (min-width: 768px) {
  div#sidebar {
    width: 240px;
  }
}