@charset "utf-8";
.cp-box { width:1000px; height:auto; margin:0 auto; overflow:hidden; padding:20px 0px; }
.cp-box-tt{width: 500px; height: 512px; float: left; background: url("ttbg.png") no-repeat center top; position: relative;}
.cp-box-vr{width: 500px; height: 512px; float: left; background: url("vrbg.png?v=1") no-repeat center top; position: relative;}
.cp-free{background: url("free.png") no-repeat center top; width: 75px; height: 67px; position: absolute; right: 17px; top:87px;}
a.cp-game{color: #f1f1f1;font-weight: bold;	font-size: 40px;width: 200px;height: 60px; line-height:60px; text-decoration:none;position: absolute;	right: 87px;bottom: 32px;display: block;text-align: center;}
a.cp-game:hover{color: #fff;}
a.vr-game{left:100px; }

/*2019-11-25 new version*/
.cp_xy{width: 333px; height: 512px; float: left;position: relative;}
.cp_logo{ padding: 2px; display: block; position: absolute;bottom: 100px; right: 20px;z-index: 30; }
.cp_vrlogo{ padding: 2px; display: block; position: absolute;bottom: 105px; left: 20px;z-index: 30; }
.cp_ttlogo{ padding: 2px; display: block; position: absolute;top: 10px; right: 80px;z-index: 30; }
/*左右移动 */
.cp_rw{ padding: 2px;position: absolute;bottom: 78px ; left: 20px;z-index: 10; -webkit-animation: twinkling 5s infinite ease-in-out; }
.cp_rw img{width: 80%;}
@-webkit-keyframes twinkling{
    0% {
        transform: translateX(0px);
    }
    50% {
        transform: translateX(30px);
    }
    100%{
        transform: translateX(0px);
    }
}
@keyframes twinkling{
    0% {
        transform: translateX(0px);
    }
    50% {
        transform: translateX(20px);
    }
    100%{
        transform: translateX(0px);
    }
}

a.cp_lj{ display: block;width: 80px; height: 80px;position: absolute; bottom: 75px; left: 20px; z-index: 14; }
/*自动旋转 */
.cp_an{ position: absolute;   z-index: 15;
    animation-name:around;
    animation-duration: 1s;
    animation-timing-function: ease;

    animation-iteration-count:infinite;
    /* animation-iteration-count:2; 可以设置运动几次*/ }
@-webkit-keyframes around{
    0% {

        transform: rotate(0deg);
    }

    100%{

        transform: rotate(360deg);
    }

}
@keyframes around{
    0% {

        transform: rotate(0deg);
    }

    100%{

        transform: rotate(360deg);
    }

}
/*放大缩小 */
.cp_logo,.cp_vrlogo,.cp_ttlogo img{-moz-animation:heart_beat .5s ease-in-out;-webkit-animation:heart_beat .5s ease-in-out;}
@-moz-keyframes heart_beat{0%{-moz-transform:scale(1)}
    25%{-moz-transform:scale(1.70)}
    50%{-moz-transform:scale(0.9)}
    75%{-moz-transform:scale(1.55)}
    100%{-moz-transform:scale(1)}}
@-webkit-keyframes heart_beat{0%{-webkit-transform:scale(1)}
    25%{-webkit-transform:scale(1.70)}
    50%{-webkit-transform:scale(0.9)}
    75%{-webkit-transform:scale(1.55)}
    100%{-moz-transform:scale(1)}}

.cp_an1{ position: absolute; bottom: 8px; left: 18px; z-index: 18; }
.cp_an2{ position: absolute; bottom: -10px; left: 8px; z-index: 18; }
.weih{  position: absolute; top:0px; left: 0px; z-index: 100; }