body {
    background-color: white;
    font-size: 16px;
    /*font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;*/
    font-family:'メイリオ', 'Meiryo', sans-serif;
}

label {

}

.nopadding {
    padding: 0 !important;
}

.noleftpadding {
    padding-left: 0 !important;
}


.container-front {
    margin-top: 125px;
}
.btn {
    font-size: 18px !important;
}

.btn-main {
    background-color: white;
    border-radius: 0;
    border: 1px solid black;
    padding: 6px 48px;
}

.btn-sub {
    background-color: #AAAAAA;
    padding: 6px 18px;
    border-radius: 0;
}

.input-control {
    width: 100%;
}

.input-section-control {
    width: 90%;
}

.input-sub-control {
    width: 45%;
    margin-left: 12px;
    margin-right: 12px;
}

.input-select-control {
    width: 60%;
    margin-top: 4px;
}

.col-home-title {
    /*font-weight: bold;*/
    font-size: 24px !important;
    margin-top: 36px;
    margin-bottom: 12px;
}

.col-home-title2 {
    /*font-weight: bold;*/
    font-size: 24px !important;
    margin-top: 0px;
    margin-bottom: 0px;
}

.col-form-title {
    /*font-weight: bold;*/
    font-size: 36px !important;
}

.col-form-label {
    font-size: 18px !important;
}

.error-message {
    width: 100%;
    color: red;
}

.col-home-label {
    background-color: #EEEEEE;
    padding: 6px 12px;
}

.col-home-label-confirm {
    padding-top: 4px;
}
/*.col-home-input {*/
/*    padding: 6px 0 6px 0;*/
/*}*/

.col-home-label label {
    margin-bottom: 0;
    font-size: 18px !important;
}
.col-home-required {
    padding: 0 12px;
    /*background-color: #111111;*/
    background-color: red;
    color: white;
    margin-left: 12px;
    font-size: 16px !important;
}

.col-home-form-row input {
    height: 35px;
    padding-left: 8px;
    padding-right: 8px;
}

.col-home-form-row input[type=checkbox] {
    position: absolute;
    height: 15px;
    width: 15px;
    background-color: white;
    margin-left: 8px;
    margin-top: 4px;
}


.col-home-form-row select {
    height: 35px;
    padding-left: 8px;
    padding-right: 8px;
}

.col-home-form-row a {
    color: black;
}

.row-2buttons {
    float: right;
}

.row-2buttons a {
    margin-left: 18px;
    color: black;
    text-decoration: none;
}

.row-2buttons button {
    margin-left: 18px;
    color: black;
    text-decoration: none;
    margin-top: 8px;
    margin-bottom: 8px;
}

.invalid-feedback {
    display: block;
}

.list-table {
    width: 100%;
    margin-top: 24px;
    font-size: 16px !important;
}

.list-table tr {
    border-bottom: 1px solid;
}

.list-table th {
    text-align: left;
    padding: 5px 8px;
    font-weight: normal !important;
}

.list-table td {
    text-align: left;
    padding: 5px 8px;
}


.list-table1 {
    width: 100%;
    margin: 0px 15px 30px 15px;
}

.list-table1 tr {
    border-bottom: 1px solid;
}

.list-table1 th {
    text-align: left;
    padding: 5px 8px;
    font-weight: normal;
    font-size: 16px;
}

.list-table1 td {
    text-align: left;
    padding: 5px 8px;
    font-size: 16px;
}

/*pagination customize*/
.pagination-div {
    text-align: center;
    float: right;
    left: -50%;
    position: relative;
}

.pagination {
    left: 50%;
    margin: auto;
    position: relative;
}

.page-item {
    margin: 0 10px;
}

.page-item .page-link {
    color: black;
    background-color: white;
}

.page-item.active .page-link {
    color: #fff;
    background-color: black;
    border-color: black;
}

.page-item:first-child .page-link {
    border-radius: 0;
}

.page-item:last-child .page-link {
    border-radius: 0;
}

.col-label-scenario {
    padding-top: 5px;
    font-weight: 14px;
}

.sub-label {
    font-size: 14px;
}

#scenario_create input[type="text"] {
    /*font-size: 12px;*/
}

.add-button {
    float: right; width: 20px; height: 20px; cursor:pointer
}

.remove-button {
    position: absolute;
    bottom: 0;
    right: 15px;
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.gray-row {
    background-color: #EEEEEE; padding-top: 10px; padding-bottom: 10px
}

.modal-content {
    border-radius: 0;
}

.modal-header {
    border: none;
}

.modal-body {
    border: none;
    padding-left: 45px;
    padding-right: 45px;
}

.modal-footer {
    border: none;
}

.progress {
    background: #707070;
    display: block;
    height: 40px;
    text-align: center;
    transition: width .3s;
    width: 0;
    border-radius: 0;
}

.progress.hide {
    opacity: 0;
    transition: opacity 1.3s;
}
@media screen and (min-width: 800px) {
    .label-vertical-align {
        top: 45%;
        position: absolute;
    }
}

@media screen and (max-width: 800px) {
    .col-home-label {
        margin-bottom: 8px;
    }
}

.text-label {
    font-size: 20px !important;
}

.nav-item {
    font-size: 18px;
}

.small-input {
    width: 60px;
    height: auto !important;
    font-size: 12px;
    padding: 8px;
}

.div-first {
    width: 40%;
    flex: none;
    max-width: none;
}

button:disabled {
    background: gray;
}

/*!* The Modal (background) *!*/
/*.modal {*/
/*    display: none; !* Hidden by default *!*/
/*    position: fixed; !* Stay in place *!*/
/*    z-index: 1; !* Sit on top *!*/
/*    padding-top: 200px; !* Location of the box *!*/
/*    left: 0;*/
/*    top: 0;*/
/*    width: 100%; !* Full width *!*/
/*    height: 100%; !* Full height *!*/
/*    overflow: auto; !* Enable scroll if needed *!*/
/*    background-color: rgb(0,0,0); !* Fallback color *!*/
/*    background-color: rgba(0,0,0,0.9); !* Black w/ opacity *!*/
/*}*/

/*!* Modal Content (Image) *!*/
/*.modal-content {*/
/*    margin: auto;*/
/*    display: block;*/
/*    width: 80%;*/
/*    max-width: 700px;*/
/*}*/

/*!* Caption of Modal Image (Image Text) - Same Width as the Image *!*/
/*#caption {*/
/*    margin: auto;*/
/*    display: block;*/
/*    width: 80%;*/
/*    max-width: 700px;*/
/*    text-align: center;*/
/*    color: #ccc;*/
/*    padding: 10px 0;*/
/*    height: 150px;*/
/*}*/

/*!* Add Animation - Zoom in the Modal *!*/
/*.modal-content, #caption {*/
/*    animation-name: zoom;*/
/*    animation-duration: 0.6s;*/
/*}*/

/*@keyframes zoom {*/
/*    from {transform:scale(0)}*/
/*    to {transform:scale(1)}*/
/*}*/

/*!* The Close Button *!*/
/*.close {*/
/*    position: absolute;*/
/*    top: 15px;*/
/*    right: 35px;*/
/*    color: #f1f1f1;*/
/*    font-size: 40px;*/
/*    font-weight: bold;*/
/*    transition: 0.3s;*/
/*}*/

/*.close:hover,*/
/*.close:focus {*/
/*    color: #bbb;*/
/*    text-decoration: none;*/
/*    cursor: pointer;*/
/*}*/

/*!* 100% Image Width on Smaller Screens *!*/
/*@media only screen and (max-width: 700px){*/
/*    .modal-content {*/
/*        width: 100%;*/
/*    }*/
/*}*/

/*.image-box {*/
/*    width: 300px;*/
/*    !*height: 300px;*!*/
/*    !*height: 320px;*!*/
/*    !*padding: 10px;*!*/
/*    float: left;*/
/*    !*margin-left: 3px;*!*/
/*    margin-right: 5px;*/
/*}*/

.image-container {
    float: left;
    margin-right: 5px;
}

.image-box {
    width: 300px;
    height: 300px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
}

.image-box img {
    width: 100%;
}

@media only screen and (max-width: 700px){
    .image-container {
        width: 100%;
        text-align: center;
    }

    .image-box {
        width: 100%;
        height: auto;
    }

}