.extraImageDiv {
    width: 100%;
    height: 100%;
    background-color: white;
}

.extraImageDiv img {
    max-width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: top;
}

.exImg-rowDiv {
    display: flex;
}

.exImg-div-style-front {
    background-color: #afeeee;
    margin: 2px;
    padding: 2px 15px;
}
.exImg-div-style-rear {
    background-color: #98fb98;
    margin: 2px;
    padding: 2px 15px;
}

.exImg-cellDiv {
    margin: 3px;
    width: 256px;
}

.exImg-cellDiv-small {
    margin: 3px;
    width: 200px;
}

.exImg-cellDiv-small img {
    max-width: 100%;
    height: auto;
}

.exImg-noimage {
    background-color: #cccccc;
}

/* jquery-ui.css の .ui-button:active から流用 */
button.button-toggled-on, button.button-toggled-on:hover,
button.button-toggled-on:focus {
    border: 1px solid #003eff;
    background: /*#aaaaff;*/ #007fff;
    font-weight: normal;
    color: /*#000000*/ #ffffff;
}

.show-extraimage-container-up-down-button-div {
    display: inline-block;
    vertical-align: middle;
}

.show-extraimage-container-up-button {
    margin-top: 2px !important;
    margin-bottom: 2px !important;
}
.show-extraimage-container-down-button {
    margin-top: 2px !important;
    margin-bottom: 2px !important;
}