/*Navbar*/
.navbar.is-metra {
    background-color: #1082A0;
    color: #fff;
}

.has-background-metra {
    background-color: #ed1c24 !important;
}

@media screen and (min-width: 1024px) {
    .navbar.is-metra .navbar-start > .navbar-item,
    .navbar.is-metra .navbar-start .navbar-link,
    .navbar.is-metra .navbar-end > .navbar-item,
    .navbar.is-metra .navbar-end .navbar-link {
        color: #fff;
    }

    .navbar.is-metra .navbar-start > a.navbar-item:focus, .navbar.is-metra .navbar-start > a.navbar-item:hover, .navbar.is-metra .navbar-start > a.navbar-item.is-active,
    .navbar.is-metra .navbar-start .navbar-link:focus,
    .navbar.is-metra .navbar-start .navbar-link:hover,
    .navbar.is-metra .navbar-start .navbar-link.is-active,
    .navbar.is-metra .navbar-end > a.navbar-item:focus,
    .navbar.is-metra .navbar-end > a.navbar-item:hover,
    .navbar.is-metra .navbar-end > a.navbar-item.is-active,
    .navbar.is-metra .navbar-end .navbar-link:focus,
    .navbar.is-metra .navbar-end .navbar-link:hover,
    .navbar.is-metra .navbar-end .navbar-link.is-active {
        background-color: #34a7c5;
        color: #fff;
    }

    .navbar.is-metra .navbar-start .navbar-link::after,
    .navbar.is-metra .navbar-end .navbar-link::after {
        border-color: #fff;
    }

    .navbar.is-metra .navbar-item.has-dropdown:focus .navbar-link,
    .navbar.is-metra .navbar-item.has-dropdown:hover .navbar-link,
    .navbar.is-metra .navbar-item.has-dropdown.is-active .navbar-link {
        background-color: #ef2e55;
        color: #fff;
    }

    .navbar.is-metra .navbar-dropdown a.navbar-item.is-active {
        background-color: #ed1c24;
        color: #fff;
    }
}

/*Button*/
.button.is-metra {
    background-color: #34a7c5;
    border-color: transparent;
    color: #fff;
}

.button.is-metra:hover, .button.is-metra.is-hovered {
    background-color: #34a7c5;
    border-color: transparent;
    color: #fff;
}

.button.is-metra:focus, .button.is-metra.is-focused {
    border-color: transparent;
    color: #fff;
}

.button.is-metra:focus:not(:active), .button.is-metra.is-focused:not(:active) {
    box-shadow: 0 0 0 0.125em rgba(241, 70, 104, 0.25);
}

.button.is-metra:active, .button.is-metra.is-active {
    background-color: #ef2e55;
    border-color: transparent;
    color: #fff;
}

.button.is-metra[disabled],
fieldset[disabled] .button.is-metra {
    background-color: #ed1c24;
    border-color: transparent;
    box-shadow: none;
}

.button.is-metra.is-inverted {
    background-color: #fff;
    color: #ed1c24;
}

.button.is-metra.is-inverted:hover, .button.is-metra.is-inverted.is-hovered {
    background-color: #f2f2f2;
}

.button.is-metra.is-inverted[disabled],
fieldset[disabled] .button.is-metra.is-inverted {
    background-color: #fff;
    border-color: transparent;
    box-shadow: none;
    color: #ed1c24;
}

.button.is-metra.is-loading::after {
    border-color: transparent transparent #fff #fff !important;
}

.button.is-metra.is-outlined {
    background-color: transparent;
    border-color: #ed1c24;
    color: #ed1c24;
}

.button.is-metra.is-outlined:hover, .button.is-metra.is-outlined.is-hovered, .button.is-metra.is-outlined:focus, .button.is-metra.is-outlined.is-focused {
    background-color: #ed1c24;
    border-color: #ed1c24;
    color: #fff;
}

.button.is-metra.is-outlined.is-loading::after {
    border-color: transparent transparent #ed1c24 #ed1c24 !important;
}

.button.is-metra.is-outlined.is-loading:hover::after, .button.is-metra.is-outlined.is-loading.is-hovered::after, .button.is-metra.is-outlined.is-loading:focus::after, .button.is-metra.is-outlined.is-loading.is-focused::after {
    border-color: transparent transparent #fff #fff !important;
}

.button.is-metra.is-outlined[disabled],
fieldset[disabled] .button.is-metra.is-outlined {
    background-color: transparent;
    border-color: #ed1c24;
    box-shadow: none;
    color: #ed1c24;
}

.button.is-metra.is-inverted.is-outlined {
    background-color: transparent;
    border-color: #fff;
    color: #fff;
}

.button.is-metra.is-inverted.is-outlined:hover, .button.is-metra.is-inverted.is-outlined.is-hovered, .button.is-metra.is-inverted.is-outlined:focus, .button.is-metra.is-inverted.is-outlined.is-focused {
    background-color: #fff;
    color: #ed1c24;
}

.button.is-metra.is-inverted.is-outlined.is-loading:hover::after, .button.is-metra.is-inverted.is-outlined.is-loading.is-hovered::after, .button.is-metra.is-inverted.is-outlined.is-loading:focus::after, .button.is-metra.is-inverted.is-outlined.is-loading.is-focused::after {
    border-color: transparent transparent #ed1c24 #ed1c24 !important;
}

.button.is-metra.is-inverted.is-outlined[disabled],
fieldset[disabled] .button.is-metra.is-inverted.is-outlined {
    background-color: transparent;
    border-color: #fff;
    box-shadow: none;
    color: #fff;
}

.button.is-metra.is-light {
    background-color: #feecf0;
    color: #cc0f35;
}

.button.is-metra.is-light:hover, .button.is-metra.is-light.is-hovered {
    background-color: #fde0e6;
    border-color: transparent;
    color: #cc0f35;
}

.button.is-metra.is-light:active, .button.is-metra.is-light.is-active {
    background-color: #fcd4dc;
    border-color: transparent;
    color: #cc0f35;
}

/*Panel*/
.panel.is-metra .panel-heading {
    background-color: #34a7c5;
    color: #fff;
}

.panel.is-metra .panel-tabs a.is-active {
    border-bottom-color: #ed1c24;
}

.panel.is-metra .panel-block.is-active .panel-icon {
    color: #ed1c24;
}

.card + .card {
    margin-top: 20px
}

/*Historical*/
.historical {
    max-width: 100%;
    position: relative;
}

.historical-header {
    align-items: stretch;
    display: flex;
}

.historical-title {
    display: flex;
    flex-grow: 1;
}

.historical-icon {
    display: flex;
    align-items: center;
    cursor: pointer;
    justify-content: center;
    padding: .75rem 1rem;
}

.historical-icon:hover {
    color: #4f78c9;
    background-color: rgba(128, 132, 140, .1);
    border-radius: 20rem;
}

.historical-body {
    padding-left: 3rem;
}

.historical-item {
    align-items: stretch;
    display: flex;
    margin-top: 20px;
}

.historical-item-content {
    flex-grow: 2;
}

.historical-item-icon {
    align-items: center;
    cursor: pointer;
    justify-content: center;
    padding: .75rem 1rem;
}

.historical-item-icon > .icon:hover {
    color: #4f78c9;
    background-color: rgba(128, 132, 140, .1);
    border-radius: 20rem;
}

.historical-item-content-title {
    font-weight: bold;
    font-size: 1rem;
}

.historical-item-content-location,.historical-item-content-time,.historical-item-content-masa,historical-item-content-customer {
    color: #9f9f9f;
}
/*Partnership*/
.partnership {
    max-width: 100%;
    position: relative;
}

.partnership-header {
    align-items: stretch;
    display: flex;
}

.partnership-title {
    display: flex;
    flex-grow: 1;
}

.partnership-icon {
    display: flex;
    align-items: center;
    cursor: pointer;
    justify-content: center;
    padding: .75rem 1rem;
}

.partnership-icon:hover {
    color: #4f78c9;
    background-color: rgba(128, 132, 140, .1);
    border-radius: 20rem;
}

.partnership-body {
    padding-left: 3rem;
}

.partnership-item {
    margin-top: 20px;
}
/*Modal*/
@media screen and (min-width: 769px){
    .modal-card.modal-large,modal-content.modal-large{
        width: 1000px;
    }
    .modal-card.modal-tall{
        max-height: calc(100vh - 0px);
    }
}
/*Helper*/
.is-link{
    color: #3273dc;
    cursor: pointer;
}
.field .field {
    margin-bottom: 0;
}
.flex-wrap { flex-wrap: wrap; }
.w-100 { width: 100%; }
p.help.is-warning{
    color: #de9f00;
}
.is-static{
    cursor: default;
}
.is-static.is-warning{
    border-color: #ffdd57;
    padding-left: 10px;
}

.tree-menu:hover{
    color: #f14668;
}

.half-field{
    width: 45%;
    margin-right: 5%;
    float: left;
}

.footer-sticky{
    position:sticky;
    bottom: 0;
}

.btn-color-2{
    color: #ffffff;
    background-color: #34a7c5;
    border: 2px solid #34a7c5;
}

.btn-color-2:hover{
    color: #34a7c5;
    background-color: #ffffff;
    border: 2px solid #34a7c5;
}

.btn-color-2:active{
    color: #34a7c5;
    background-color: #ffffff;
    border: 2px solid #34a7c5;
}

.btn-color-2:visited{
    color: #34a7c5;
    background-color: #ffffff;
    border: 2px solid #34a7c5;
}

.hide-password {
    display: none
}