@charset "utf-8";
/*
	@Daishutijian Loading Animation
	@By Coin Ver.20150730
*/

#loading {
    width: 120px;
    height: 136px;
    background-color: #f7f7f7;
    margin: 10px auto 0;
    position: relative;
}

#loading h1 {
    width: 120px;
    font-size: 110%;
    color: #f29c2a;
    text-align: center;
    line-height: 30px;
    position: absolute;
    top: 106px;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-weight: normal;
}

.mum {
    width: 120px;
    height: 106px;
    background-position: left top;
    background-image: url(../images/mun2.png);
    background-repeat: no-repeat;
    background-size: 120px 106px;
}

.son {
    width: 36px;
    height: 36px;

    position: absolute;
    top: 40px;
    left: 62px;

    background-image: url(../images/son2.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 36px 42px;
    -webkit-animation: rotate 500ms ease-in infinite;
    -moz-animation: rotate 500ms ease-in infinite;
    -ms-animation: rotate 500ms ease-in infinite;
    animation: rotate 500ms ease-in infinite;

}

#loading em {
    width: 6px;
    height: 6px;
    border-radius: 3px;
    display: block;
    background-color: #f7f7f7;
    position: absolute;
    top: 26px;
    left: 68px;
    -webkit-animation: zhayan 1000ms linear infinite;
    -moz-animation: zhayan 1000ms linear infinite;
    -ms-animation: zhayan 1000ms linear infinite;
    animation: zhayan 1000ms linear infinite;
}

@keyframes rotate {
    0% {
        top: 40px;
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);

    }
    25% {
        top: 45px;
        -moz-transform: rotate(-10deg);
        -webkit-transform: rotate(-10deg);
        -ms-transform: rotate(-10deg);
        -o-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }
    50% {
        top: 40px;
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);

    }
    75% {
        top: 45px;
        -moz-transform: rotate(10deg);
        -webkit-transform: rotate(10deg);
        -ms-transform: rotate(10deg);
        -o-transform: rotate(10deg);
        transform: rotate(10deg);
    }
    100% {
        top: 40px;
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

@-moz-keyframes rotate {
    0% {
        top: 40px;
        -moz-transform: rotate(0deg);
        transform: rotate(0deg);

    }
    25% {
        top: 45px;
        -moz-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }
    50% {
        top: 40px;
        -moz-transform: rotate(0deg);
        transform: rotate(0deg);

    }
    75% {
        top: 45px;
        -moz-transform: rotate(10deg);
        transform: rotate(10deg);
    }
    100% {
        top: 40px;
        -moz-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

@-webkit-keyframes rotate {
    0% {
        top: 40px;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);

    }
    25% {
        top: 45px;
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }
    50% {
        top: 40px;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);

    }
    75% {
        top: 45px;
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg);
    }
    100% {
        top: 40px;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

@-ms-keyframes rotate {
    0% {
        top: 40px;
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);

    }
    25% {
        top: 45px;
        -ms-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }
    50% {
        top: 40px;
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);

    }
    75% {
        top: 45px;
        -ms-transform: rotate(10deg);
        transform: rotate(10deg);
    }
    100% {
        top: 40px;
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

@-o-keyframes rotate {
    0% {
        top: 40px;
        -o-transform: rotate(0deg);
        transform: rotate(0deg);

    }
    25% {
        top: 45px;
        -o-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }
    50% {
        top: 40px;
        -o-transform: rotate(0deg);
        transform: rotate(0deg);

    }
    75% {
        top: 45px;
        -o-transform: rotate(10deg);
        transform: rotate(10deg);
    }
    100% {
        top: 40px;
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

@-webkit-keyframes zhayan {
    0% {
        height: 6px;
        top: 26px;
    }
    10% {
        height: 2px;
        top: 28px;
    }
    20% {
        height: 6px;
        top: 26px;
    }
    30% {
        height: 2px;
        top: 28px;
    }
    40% {
        height: 6px;
        top: 26px;

    }
    100% {
        height: 6px;
        top: 26px;
    }
}

.ui-poptips {
    width: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 10;
}

.ui-poptips .ui-poptips-cnt {
    margin: 0px 10px;
    background-color: rgba(0, 0, 0, 0.6);
    line-height: 40px;
    height: 40px;
    color: #fff;
    font-size: 16px;
    text-align: center;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    overflow: hidden;
}

.ui-poptips i {
    display: inline-block;
    width: 20px;
    height: 1px;
    position: relative;
    overflow: visible;
    margin-right: 8px;
    margin-left: 0px;
    font-size: 20px;
    vertical-align: middle;
}

.ui-poptips i:before {
    background: url(../images/icon.png?_bid=306) no-repeat 0px 0px;
    -webkit-background-size: 150px auto;
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    left: 0px;
    top: -11px;
}

.ui-poptips-info i:before {
    background-position: 0 -50px;
}

.ui-poptips-success i:before {
    background-position: -25px -50px;
}

.ui-poptips-warn i:before {
    background-position: -50px -50px;
}