.overlay {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 99999999;
}
.overlay .message {
    text-align: center;
    display: inline-block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 200px;
    height: 40px;
    background: rgba(220, 220, 230, 0.8);
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    padding-top: 10px;
}
.overlay .message .rotate {
    position: absolute;
    left: 40px;
    display: inline-block;
    width: 20px;
    height: 20px;
    background: #1aa;
    -webkit-animation: spin 1.5s linear infinite;
    -moz-animation: spin 1.5s linear infinite;
    -ms-animation: spin 1.5s linear infinite;
    -o-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
}
.overlay2 {
    position: fixed;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(0, 0, 0, 0.1);
    z-index: 99999999;
}
.overlay2 .message2 {
    text-align: center;
    display: inline-block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 200px;
    height: 40px;
    padding-top: 10px;
    user-select: none;
}

@-webkit-keyframes spin {
    0% {-webkit-transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg);}
}
@-moz-keyframes spin {
    0% {-moz-transform: rotate(0deg);}
    100% {-moz-transform: rotate(360deg);}
}
@-ms-keyframes spin {
    0% {-ms-transform: rotate(0deg);}
    100% {-ms-transform: rotate(360deg);}
}
@-o-keyframes spin {
    0% {-o-transform: rotate(0deg);}
    100% {-o-transform: rotate(360deg);}
}
@keyframes spin {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}

/* 画面全体のローディング表示用(5番目) */
.loader {
    margin: auto;
    font-size: 25px;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    position: relative;
    text-indent: -9999em;
    -webkit-animation: load5 0.7s infinite ease;
    animation: load5 0.7s infinite ease;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

@-webkit-keyframes load5 {
    0%,100% {box-shadow: 0em -2.6em 0em 0em #3e3e3e, 1.8em -1.8em 0 0em rgba(62,62,62, 0.2), 2.5em 0em 0 0em rgba(62,62,62, 0.2), 1.75em 1.75em 0 0em rgba(62,62,62, 0.2), 0em 2.5em 0 0em rgba(62,62,62, 0.2), -1.8em 1.8em 0 0em rgba(62,62,62, 0.2), -2.6em 0em 0 0em rgba(62,62,62, 0.5), -1.8em -1.8em 0 0em rgba(62,62,62, 0.7);}
    12.5% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.7), 1.8em -1.8em 0 0em #3e3e3e, 2.5em 0em 0 0em rgba(62,62,62, 0.2), 1.75em 1.75em 0 0em rgba(62,62,62, 0.2), 0em 2.5em 0 0em rgba(62,62,62, 0.2), -1.8em 1.8em 0 0em rgba(62,62,62, 0.2), -2.6em 0em 0 0em rgba(62,62,62, 0.2), -1.8em -1.8em 0 0em rgba(62,62,62, 0.5);}
    25% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.5), 1.8em -1.8em 0 0em rgba(62,62,62, 0.7), 2.5em 0em 0 0em #3e3e3e, 1.75em 1.75em 0 0em rgba(62,62,62, 0.2), 0em 2.5em 0 0em rgba(62,62,62, 0.2), -1.8em 1.8em 0 0em rgba(62,62,62, 0.2), -2.6em 0em 0 0em rgba(62,62,62, 0.2), -1.8em -1.8em 0 0em rgba(62,62,62, 0.2);}
    37.5% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.2), 1.8em -1.8em 0 0em rgba(62,62,62, 0.5), 2.5em 0em 0 0em rgba(62,62,62, 0.7), 1.75em 1.75em 0 0em #3e3e3e, 0em 2.5em 0 0em rgba(62,62,62, 0.2), -1.8em 1.8em 0 0em rgba(62,62,62, 0.2), -2.6em 0em 0 0em rgba(62,62,62, 0.2), -1.8em -1.8em 0 0em rgba(62,62,62, 0.2);}
    50% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.2), 1.8em -1.8em 0 0em rgba(62,62,62, 0.2), 2.5em 0em 0 0em rgba(62,62,62, 0.5), 1.75em 1.75em 0 0em rgba(62,62,62, 0.7), 0em 2.5em 0 0em #3e3e3e, -1.8em 1.8em 0 0em rgba(62,62,62, 0.2), -2.6em 0em 0 0em rgba(62,62,62, 0.2), -1.8em -1.8em 0 0em rgba(62,62,62, 0.2);}
    62.5% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.2), 1.8em -1.8em 0 0em rgba(62,62,62, 0.2), 2.5em 0em 0 0em rgba(62,62,62, 0.2), 1.75em 1.75em 0 0em rgba(62,62,62, 0.5), 0em 2.5em 0 0em rgba(62,62,62, 0.7), -1.8em 1.8em 0 0em #3e3e3e, -2.6em 0em 0 0em rgba(62,62,62, 0.2), -1.8em -1.8em 0 0em rgba(62,62,62, 0.2);}
    75% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.2), 1.8em -1.8em 0 0em rgba(62,62,62, 0.2), 2.5em 0em 0 0em rgba(62,62,62, 0.2), 1.75em 1.75em 0 0em rgba(62,62,62, 0.2), 0em 2.5em 0 0em rgba(62,62,62, 0.5), -1.8em 1.8em 0 0em rgba(62,62,62, 0.7), -2.6em 0em 0 0em #3e3e3e, -1.8em -1.8em 0 0em rgba(62,62,62, 0.2);}
    87.5% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.2), 1.8em -1.8em 0 0em rgba(62,62,62, 0.2), 2.5em 0em 0 0em rgba(62,62,62, 0.2), 1.75em 1.75em 0 0em rgba(62,62,62, 0.2), 0em 2.5em 0 0em rgba(62,62,62, 0.2), -1.8em 1.8em 0 0em rgba(62,62,62, 0.5), -2.6em 0em 0 0em rgba(62,62,62, 0.7), -1.8em -1.8em 0 0em #3e3e3e;}
}

@keyframes load5 {
    0%,100% {box-shadow: 0em -2.6em 0em 0em #3e3e3e, 1.8em -1.8em 0 0em rgba(62,62,62, 0.2), 2.5em 0em 0 0em rgba(62,62,62, 0.2), 1.75em 1.75em 0 0em rgba(62,62,62, 0.2), 0em 2.5em 0 0em rgba(62,62,62, 0.2), -1.8em 1.8em 0 0em rgba(62,62,62, 0.2), -2.6em 0em 0 0em rgba(62,62,62, 0.5), -1.8em -1.8em 0 0em rgba(62,62,62, 0.7);}
    12.5% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.7), 1.8em -1.8em 0 0em #3e3e3e, 2.5em 0em 0 0em rgba(62,62,62, 0.2), 1.75em 1.75em 0 0em rgba(62,62,62, 0.2), 0em 2.5em 0 0em rgba(62,62,62, 0.2), -1.8em 1.8em 0 0em rgba(62,62,62, 0.2), -2.6em 0em 0 0em rgba(62,62,62, 0.2), -1.8em -1.8em 0 0em rgba(62,62,62, 0.5);}
    25% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.5), 1.8em -1.8em 0 0em rgba(62,62,62, 0.7), 2.5em 0em 0 0em #3e3e3e, 1.75em 1.75em 0 0em rgba(62,62,62, 0.2), 0em 2.5em 0 0em rgba(62,62,62, 0.2), -1.8em 1.8em 0 0em rgba(62,62,62, 0.2), -2.6em 0em 0 0em rgba(62,62,62, 0.2), -1.8em -1.8em 0 0em rgba(62,62,62, 0.2);}
    37.5% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.2), 1.8em -1.8em 0 0em rgba(62,62,62, 0.5), 2.5em 0em 0 0em rgba(62,62,62, 0.7), 1.75em 1.75em 0 0em #3e3e3e, 0em 2.5em 0 0em rgba(62,62,62, 0.2), -1.8em 1.8em 0 0em rgba(62,62,62, 0.2), -2.6em 0em 0 0em rgba(62,62,62, 0.2), -1.8em -1.8em 0 0em rgba(62,62,62, 0.2);}
    50% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.2), 1.8em -1.8em 0 0em rgba(62,62,62, 0.2), 2.5em 0em 0 0em rgba(62,62,62, 0.5), 1.75em 1.75em 0 0em rgba(62,62,62, 0.7), 0em 2.5em 0 0em #3e3e3e, -1.8em 1.8em 0 0em rgba(62,62,62, 0.2), -2.6em 0em 0 0em rgba(62,62,62, 0.2), -1.8em -1.8em 0 0em rgba(62,62,62, 0.2);}
    62.5% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.2), 1.8em -1.8em 0 0em rgba(62,62,62, 0.2), 2.5em 0em 0 0em rgba(62,62,62, 0.2), 1.75em 1.75em 0 0em rgba(62,62,62, 0.5), 0em 2.5em 0 0em rgba(62,62,62, 0.7), -1.8em 1.8em 0 0em #3e3e3e, -2.6em 0em 0 0em rgba(62,62,62, 0.2), -1.8em -1.8em 0 0em rgba(62,62,62, 0.2);}
    75% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.2), 1.8em -1.8em 0 0em rgba(62,62,62, 0.2), 2.5em 0em 0 0em rgba(62,62,62, 0.2), 1.75em 1.75em 0 0em rgba(62,62,62, 0.2), 0em 2.5em 0 0em rgba(62,62,62, 0.5), -1.8em 1.8em 0 0em rgba(62,62,62, 0.7), -2.6em 0em 0 0em #3e3e3e, -1.8em -1.8em 0 0em rgba(62,62,62, 0.2);}
    87.5% {box-shadow: 0em -2.6em 0em 0em rgba(62,62,62, 0.2), 1.8em -1.8em 0 0em rgba(62,62,62, 0.2), 2.5em 0em 0 0em rgba(62,62,62, 0.2), 1.75em 1.75em 0 0em rgba(62,62,62, 0.2), 0em 2.5em 0 0em rgba(62,62,62, 0.2), -1.8em 1.8em 0 0em rgba(62,62,62, 0.5), -2.6em 0em 0 0em rgba(62,62,62, 0.7), -1.8em -1.8em 0 0em #3e3e3e;}
}

/* 価格横のローディング */
.loader2 {
    margin: 2.6em auto auto 3em;
    font-size: 3px;
    width: 1.8em;
    height: 1.8em;
    border-radius: 50%;
    position: relative;
    float: right;
    text-indent: -9999em;
    -webkit-animation: load5 0.7s infinite ease;
    animation: load5 0.7s infinite ease;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}