/* common */
html,
body {
  height: 100%;
}

::placeholder {
  font-size: 90%;
}

select.readonly {
  background-color: #e9ecef !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

/* sweetalert */
.swal2-container {
  z-index: 999998 !important;
}
.swal2-container .swal2-modal {
  z-index: 999999 !important;
}

/* Bootstrap */
.modal-backdrop {
  background-color: #555555;
}
.datepicker-days th.dow:first-child,
.datepicker-days td:first-child {
  color: #ff0000;
}
.datepicker-days th.dow:last-child,
.datepicker-days td:last-child {
  color: #0000ff;
}

/* My Bootstrap */
.col-xs-1-5,
.col-xs-2-5,
.col-xs-3-5,
.col-xs-4-5,
.col-sm-1-5,
.col-sm-2-5,
.col-sm-3-5,
.col-sm-4-5,
.col-md-1-5,
.col-md-2-5,
.col-md-3-5,
.col-md-4-5,
.col-lg-1-5,
.col-lg-2-5,
.col-lg-3-5,
.col-lg-4-5 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}
.col-xs-1-5 { float: left; width: 20%; }
.col-xs-2-5 { float: left; width: 40%; }
.col-xs-3-5 { float: left; width: 60%; }
.col-xs-4-5 { float: left; width: 80%; }
@media (min-width: 1200px) {
  .col-lg-1-5 { float: left; width: 20%; }
  .col-lg-2-5 { float: left; width: 40%; }
  .col-lg-3-5 { float: left; width: 60%; }
  .col-lg-4-5 { float: left; width: 80%; }
}
@media (min-width: 992px) {
  .col-md-1-5 { float: left; width: 20%; }
  .col-md-2-5 { float: left; width: 40%; }
  .col-md-3-5 { float: left; width: 60%; }
  .col-md-4-5 { float: left; width: 80%; }
}
@media (min-width: 768px) {
  .col-sm-1-5 { float: left; width: 20%; }
  .col-sm-2-5 { float: left; width: 40%; }
  .col-sm-3-5 { float: left; width: 60%; }
  .col-sm-4-5 { float: left; width: 80%; }
}
@media (max-width: 767px) {
  .col-xs-1-5 { float: left; width: 20%; }
  .col-xs-2-5 { float: left; width: 40%; }
  .col-xs-3-5 { float: left; width: 60%; }
  .col-xs-4-5 { float: left; width: 80%; }
}

.modal.fade.fade_slide_bottom {
  top: 100%;
}
.modal.fade.fade_slide_bottom.show {
  top: 0%;
  -webkit-transition: top 0.2s ease-out;
  -moz-transition: top 0.2s ease-out;
  -o-transition: top 0.2s ease-out;
  transition: top 0.2s ease-out;
}
.modal.fade.fade_slide_bottom.hide {
  top: 100%;
  -webkit-transition: top 0.2s ease-out;
  -moz-transition: top 0.2s ease-out;
  -o-transition: top 0.2s ease-out;
  transition: top 0.2s ease-out;
}

/* pagination */
.pagination-type1 .page-to-cell.active,
.pagination-type1 .page-to-prev.disabled,
.pagination-type1 .page-to-next.disabled {
  pointer-events: none !important;
}
.pagination-type2 .page-count {
  margin: 8px 10px;
}
.pagination-type2 .page-to-prev,
.pagination-type2 .page-to-next {
  margin: 0px 5px;
}
.pagination-type2 .page-to-prev.disabled,
.pagination-type2 .page-to-next.disabled {
  pointer-events: none !important;
}
.pagination-type2 .page-to-prev a,
.pagination-type2 .page-to-next a {
  border-radius: 0.25rem;
}

/* badge 新規 */
.badge.badge-detail-add {
  padding: 10px 15px;
  border: 1px solid #007bff;
  font-size: 105%;
  font-weight: 400;
  color: #007bff;
  background-color: #ffffff;
  box-sizing: border-box;
}
/* badge 編集 */
.badge.badge-detail-edit {
  padding: 10px 15px;
  border: 1px solid #ffc107;
  font-size: 105%;
  font-weight: 400;
  color: #ffc107;
  background-color: #ffffff;
  box-sizing: border-box;
}
/* badge 参照 */
.badge.badge-detail-ref {
  padding: 10px 15px;
  border: 1px solid #28a745;
  font-size: 105%;
  font-weight: 400;
  color: #28a745;
  background-color: #ffffff;
  box-sizing: border-box;
}

/* header */
#header-menu-list {
  background-color: #555555;
}
#header-menu-list ul.list-group li.list-group-item-custom {
  list-style-type: none !important;
}
#header-menu-list ul.list-group li.list-group-item-custom > a,
#header-menu-list ul.list-group li.list-group-item-custom > a:visited,
#header-menu-list ul.list-group li.list-group-item-custom > a:hover,
#header-menu-list ul.list-group li.list-group-item-custom > a:active {
  display: block;
  position: relative;
  padding: 0.75rem 1.25rem;
  border: 1px solid rgba(0,0,0,0.125);
  border-radius: 0px;
  text-decoration: none;
  color: #ffffff;
  background-color: #555555 !important;
}
#header-menu-list ul.list-group li.list-group-item-custom.current > a,
#header-menu-list ul.list-group li.list-group-item-custom.current > a:visited,
#header-menu-list ul.list-group li.list-group-item-custom.current > a:hover,
#header-menu-list ul.list-group li.list-group-item-custom.current > a:active {
  background-color: #28a745 !important;
}
#header-menu-list ul.list-group li.list-group-item-custom > a:hover {
  opacity: 0.8;
}