body {
    padding: 0;
    margin: 0;
    font-family: Microsoft YaHei;
}

.main {
    width: 100%;
    margin: 0 auto;
    max-width: 1060px;
}

.main p {
    line-height: 2em;
    margin: 30px 0;
}

img {
    display: block;
    margin: 0 auto;
}

#container {
    width: 756px;
    margin: 0 auto;
    height: 677px;
    position: relative;
}

#container img {
    margin: 0 auto;
}

#container .before {
    position: absolute;
    width: 50px;
    background:url(images/left.png);
    font-size: 30px;
    height: 50px;
    z-index: 99;
    top: 246px;
    left: 294px;
    -webkit-animation: moveLeft 1.5s infinite;
    animation: moveLeft 1.5s infinite;
}

#container .after {
    position: absolute;
    width: 50px;
    font-size: 30px;
    background:url(images/right.png);
    height: 50px;
    z-index: 99;
    top: 246px;
    left: 412px;
    -webkit-animation: moveRight 1.5s infinite;
    animation: moveRight 1.5s infinite;
}

@-webkit-keyframes moveLeft {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    40% {
        -webkit-transform: translateX(-30px);
        transform: translateX(-30px);
    }
}

@keyframes moveLeft {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    40% {
        -webkit-transform: translateX(-30px);
        transform: translateX(-30px);
    }
}

@-webkit-keyframes moveRight {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    40% {
        -webkit-transform: translateX(30px);
        transform: translateX(30px);
    }
}

@keyframes moveRight {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    40% {
        -webkit-transform: translateX(30px);
        transform: translateX(30px);
    }
}
