/* ---------------------------------------------------------------- */
/* header, navigation, footer */
/* ---------------------------------------------------------------- */
body{
    min-width: 1900px;
}

.system-title {
    font-size: 1.5rem;
}

#logout, #logout a:hover {
    color: #fff;
}

.bg-light {
    background-color: #f8f8f8 !important;
}

#header {
    border-bottom: solid 4px #ed1c24;
}

#footer {
    padding-right: 1em;
    border-top: solid 4px #C30018;
    background-color: #000;
    color: #fff;
}
.btn-color {
    color: #fff !important;
    background-color: #2776ab !important;
    border-color: #1e5982 !important;
}

.btn-color:hover {
    color: #fff !important;
    background-color: #07568b !important;
    border-color: #1e5982 !important;
}

.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active,
.dropdown-item:hover, .dropdown-item:focus,
.navbar-light .navbar-text a:hover, .navbar-light .navbar-text a:focus {
    color: #c30018;
}

.administorator-color {
    background-color: #ffefe1 !important;
}

.container-fluid {
    padding-top: 10px;
}

#footer .container-fluid {
    width: auto;
    padding-top: 0;
}

.container {
    max-width: 95%;
    min-height:770px; 
    padding-bottom: 55px;
}

.container>div {
    padding-top: 10px
}

.navbar-collapse-ex {
    display: flex !important;
    flex-basis: auto !important;
}

.navbar-nav-ex {
    flex-direction: row !important;
}

.navbar-nav-ex .dropdown-menu {
    position: absolute !important;
}

.navbar-nav-ex .nav-link {
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
}

.btn-page {
    width: 100%;
}

.btn-page div {
    padding: 0 10px;
}

.margin-right {
    margin-right: 1em;
}

.modal-xl {
    max-width: 1200px;
}

.modal-width-1000 {
    max-width: 1000px;
}

.modal-width-1850 {
    max-width: 1850px;
}
/* ---------------------------------------------------------------- */
/* main-menu */
/* ---------------------------------------------------------------- */
.btn-menu {
    width: 20%;
    min-width: 250px;
    height: 200px;
    margin: 20px;
    padding: 10px;

    }

.btn-menu img {
    padding: 20px;
    }

.error-message {
    color: red;
}

/* ---------------------------------------------------------------- */
/* select-name */
/* ---------------------------------------------------------------- */
.back-blue {
  background-color: #86bee3;
}

.back-white {
    background-color: #fff;
}

.font-blue, h3 {
  color: #1d577e;
}

.border-blue {
  border: solid 1px #62aadb;
}

.header-blue {
  background-color: #86bee3 !important;
  border-bottom: solid 2px #c30018 !important;
}
.footer-blue {
  background-color: #86bee3 !important;
  border-top: solid 2px #c30018 !important;
}
.modal-body input, .modal-body select {
  border: solid 1px #9fcbe6;
}
.back-blue2, .row-sh th, .row-sh td{
  background-color: #add3ed !important; 
}

/* ---------------------------------------------------------------- */
/* Graph, Data */
/* ---------------------------------------------------------------- */
.input-group {
    width: auto;
}

.ship-name {
    width: 20rem !important;
    max-width: 20rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.multi-shipname {
/*    width: 20rem !important;*/
    max-width: 25rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.start-date {
    width: 9rem !important;
}

.select-group {
    width: auto;
    max-width: 20rem;
}

.operation-button {
    width: 4rem;
}

.graph-message {
    margin-top: 5px;
    margin-left: 1rem;
    color: red;
    height: 20px;
}

/* ---------------------------------------------------------------- */
/* Auto Update */
/* ---------------------------------------------------------------- */
#span-timer.ja::before {
    content: "(次回更新まで";
}

#span-timer.ja::after {
    content: "分)";
}

#span-timer.en::before {
    content: "(";
}

#span-timer.en::after {
    content: " minutes until next update)";
}

/* ---------------------------------------------------------------- */
/* Bootstrap v4.1.3 bug */
/* ---------------------------------------------------------------- */
.custom-control-label:before {
    background-color: #fff;
    border: solid 1px #9fcbe6;
}

.offset-1.custom-radio {
    padding-left: 2.5rem;
}

/* ---------------------------------------------------------------- */
/* Parts Image Dialog */
/* ---------------------------------------------------------------- */
#parts-image-dialog-image {
    max-width: 100%;
    max-height: 65vh;
}

/* ---------------------------------------------------------------- */
/* other */
/* ---------------------------------------------------------------- */
.min-width-150{
    min-width: 150px;
}