﻿body {
    padding: 0px;
    margin: 0px;
}

* {
    /*font-family: '돋움',dotum,sans-serif;*/
    font-size: 12px;
    box-sizing: border-box;
}

INPUT, LABEL {
    vertical-align: middle;
    cursor: pointer;
}

/* Header Bar */

/* Menu Side */
#MenuSide {
    font-size: 36px;
    position: fixed;
    bottom: 15px;
    right: 15px;
    background-color: #AAAAAA;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    opacity: 0.5;
}

    #MenuSide:hover {
        cursor: pointer;
        color: #FFFFFF;
        background-color: #555555;
        opacity: 1;
    }

    #MenuSide > I {
        margin: 9px;
    }


/* Loading Bar */
.LoadingBar {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    z-index: 1000000;
}

    .LoadingBar > DIV {
        transition: all .5s linear;
        height: 2px;
        background: #FF0000;
        box-shadow: 0px 0px 5px #FF0000, 0px 0px 2px #FF0000;
    }

/* Rolling */
@keyframes Rolling50 {
    0% {
        left: 0;
    }

    3% {
        left: 0;
    }

    4% {
        left: calc(100% / 50 * -1);
    }

    7% {
        left: calc(100% / 50 * -1);
    }

    8% {
        left: calc(100% / 50 * -2);
    }

    11% {
        left: calc(100% / 50 * -2);
    }

    12% {
        left: calc(100% / 50 * -3);
    }

    15% {
        left: calc(100% / 50 * -3);
    }

    16% {
        left: calc(100% / 50 * -4);
    }

    19% {
        left: calc(100% / 50 * -4);
    }

    20% {
        left: calc(100% / 50 * -5);
    }

    23% {
        left: calc(100% / 50 * -5);
    }

    24% {
        left: calc(100% / 50 * -6);
    }

    27% {
        left: calc(100% / 50 * -6);
    }

    28% {
        left: calc(100% / 50 * -7);
    }

    31% {
        left: calc(100% / 50 * -7);
    }

    32% {
        left: calc(100% / 50 * -8);
    }

    35% {
        left: calc(100% / 50 * -8);
    }

    36% {
        left: calc(100% / 50 * -9);
    }

    39% {
        left: calc(100% / 50 * -9);
    }

    40% {
        left: calc(100% / 50 * -10);
    }

    43% {
        left: calc(100% / 50 * -10);
    }

    44% {
        left: calc(100% / 50 * -11);
    }

    47% {
        left: calc(100% / 50 * -11);
    }

    48% {
        left: calc(100% / 50 * -12);
    }

    51% {
        left: calc(100% / 50 * -12);
    }

    52% {
        left: calc(100% / 50 * -13);
    }

    55% {
        left: calc(100% / 50 * -13);
    }

    56% {
        left: calc(100% / 50 * -14);
    }

    59% {
        left: calc(100% / 50 * -14);
    }

    60% {
        left: calc(100% / 50 * -15);
    }

    63% {
        left: calc(100% / 50 * -15);
    }

    64% {
        left: calc(100% / 50 * -16);
    }

    67% {
        left: calc(100% / 50 * -16);
    }

    68% {
        left: calc(100% / 50 * -17);
    }

    71% {
        left: calc(100% / 50 * -17);
    }

    72% {
        left: calc(100% / 50 * -18);
    }

    75% {
        left: calc(100% / 50 * -18);
    }

    76% {
        left: calc(100% / 50 * -19);
    }

    79% {
        left: calc(100% / 50 * -19);
    }

    80% {
        left: calc(100% / 50 * -20);
    }

    83% {
        left: calc(100% / 50 * -20);
    }

    84% {
        left: calc(100% / 50 * -21);
    }

    87% {
        left: calc(100% / 50 * -21);
    }

    88% {
        left: calc(100% / 50 * -22);
    }

    91% {
        left: calc(100% / 50 * -22);
    }

    92% {
        left: calc(100% / 50 * -23);
    }

    95% {
        left: calc(100% / 50 * -23);
    }

    96% {
        left: calc(100% / 50 * -24);
    }

    99% {
        left: calc(100% / 50 * -24);
    }

    100% {
        left: calc(100% / 50 * -25);
    }
}
