/*=================================
    汎用ローダー・ダイアログ SP 
  =================================*/

.loader-container {
    width: 70px;
    height: 70px;
    margin: 0 auto;
}

.loader-container {
    width: 70px;
    height: 70px;
    margin: 0 auto;
}

.loader {
    position: absolute;
    width: 50px;
    height: 50px;
    border-radius: 50px;
    border: 10px solid #B7FF00;
    border-right-color: transparent;
    text-indent: -9999px;

    animation: loading-spin 1s linear infinite;
}

@keyframes loading-spin {
    0% { transform: rotate(0deg); opacity: 0.5; }
    50% { transform: rotate(180deg); opacity: 1.0; }
    100% { transform: rotate(360deg); opacity: 0.5; }
}


/*
.loader:before,
.loader:after,
.loader {
    border-radius: 50%;
    width: 1em;
    height: 1em;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: load7 1.8s infinite ease-in-out;
    animation: load7 1.8s infinite ease-in-out;
}

.loader {
    color: #FFF;
    font-size: 0.1px;
    margin: 0 auto;
    position: relative;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

.loader:before {
    left: -2em;
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

.loader:after {
    left: 2em;
}

.loader:before,
.loader:after {
    content: '';
    position: absolute;
    top: 0;
 }

@-webkit-keyframes load7 {
    0%,
    80%,
    100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }
    40% {
        box-shadow: 0 2.5em 0 0;
    }
}
@keyframes load7 {
    0%,
    80%,
    100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }
    40% {
        box-shadow: 0 2.5em 0 0;
    }
}
*/

.dialog-wrapper {
    width: 70vw;
    margin: 0 auto;
}

.dialog-wrapper .dialog {
    font-size: 14px;
    text-align: center;
    background: #FFF;
    width: 100%;
    padding: 10px 5px;
    border: 1px solid;
    border-radius: 7px;
    letter-spacing: 1px;
    box-shadow: 0 2px 5px #999;
    box-sizing: border-box;
}

.dialog-wrapper .ok {
    color: #8dc500;
}

.dialog-wrapper .error {
    color: #EA5514;
}

.dialog-wrapper span.ic {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 8px; 
    background-size: 20px 20px;
    text-indent: -9999px;
}

.dialog-wrapper .ok span.ic {
    background-image: url(../../images/common/ic_done.png);
}

.dialog-wrapper .error span.ic {
    background-image: url(../../images/common/ic_caution.png);
}