.smw-zz {
    /*background: url(../images/sy-bg.png) center;*/
    background: #000;
    opacity: .9;
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 99999999;
}

.smw-wrap{
    width: 1200px;
    height: 617px;
    position: fixed;
    top: 50%;
    margin-top: -308px;
    left: 50%;
    margin-left: -371px;
    z-index: 99999999;
}

.smw-wrap-relative{

    width: 1200px;
    margin: 0 auto;
    position: relative;
}

.smw-fl{
    position: absolute;
    left: 0;
    top: 0;
    width: 180px;
    height: 617px;
    margin: 0 auto;
    opacity:0;
    -webkit-animation-name: smw-fl ;
    animation-name: smw-fl;
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-fill-mode: forwards ;
    animation-fill-mode: forwards;
    animation-delay: 0.5s;
    -moz-animation-delay: 0.5s;
    -webkit-animation-delay: 0.5s;
}
.smw1{
    animation: swinging 2s 0.5s normal ease;
    animation-fill-mode: forwards;
    -webkit-animation: swinging 2s 0.5s normal ease;
    -webkit-animation-fill-mode: forwards;
}

@keyframes smw-fl {
    0%  { left:0;top:-560px; opacity:0;-webkit-transform: rotate(0deg);}
    100%  { left:0; top:0; opacity:1;}
}
@keyframes swinging{
    0% { -webkit-transform: rotate(0deg); }
    25% { -webkit-transform: rotate(0deg); }
    30% { -webkit-transform: rotate(-7deg); }
    35% { -webkit-transform: rotate(6deg); }
    40% { -webkit-transform: rotate(-5deg); }
    45% { -webkit-transform: rotate(4deg); }
    50% { -webkit-transform: rotate(-3deg); }
    60% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(0deg); }
}