html,body{
    background: url(/images/index-bg.jpg) no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 100%;
}
.body{
    position: relative;
    text-align: center;
}
.index-title{
    width: 80%;
    display: block;
    margin:0 auto;
    padding-top: 15px;
}
.index-npc-1{
    position: fixed;
    width: 45%;
    left: 20px;
    top: 45%;
    animation: float 3s ease-in-out infinite;
}
.index-npc-2{
    position: fixed;
    width: 45%;
    right: 20px;
    top: 40%;
    animation: float 2s ease-in-out infinite;
}
.btn-bottom{
    left: 50%;
    position: fixed;
    bottom: 40px;
    transform: translateX(-50%);
}
.btn-start{
    width: 160px;
    height: 50px;
    background: url(/images/btn-start.png) no-repeat;
    background-size: 100% 100%;
    padding: 0;
    border: 0;
    transition: transform 0.3s ease-out;
}

@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
    100% { transform: translateY(0px); }
}



/*video*/
.video-title{
    width: 85%;
    padding-top: 5px;
}
.video-content{
    width: 85%;
    padding-top: 5px;
}
.video-btn{
    width: 120px;
    height: 105px;
    background: url(/images/btn-on.png) no-repeat;
    background-size: 100% 100%;
    padding: 0;
    border: 0;
    display: block;
    margin:0 auto;
}
.video-btn:hover{
    background: url(/images/btn-off.png) no-repeat;
    background-size: 100% 100%;
}