* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	text-decoration: none;
	list-style: none;
}
body {
	background: #001994;
	background-image:url(images/we.png);
}
.bg-img {
	background-image:url(images/redxx.png);
	height: 1005px;
	background-repeat: no-repeat;position: relative;bottom:100px;
}
.container {
	position: absolute;
	margin: 350px 67px;
	width: auto;
}
.topnav a {
	float: left;
	color: #f2f2f2;
	text-align: center;
	padding: 50px 16px;
	text-decoration: none;
	font-size: 25px;
}
.topnav a:hover {
	background-color: #ddd;
	color: black;
}
.gameborder {
	width: 1200px;
	height: 858px;
	background: #ffffff;
	border-radius: 67px;
	box-shadow: 0px 5px 15px #cccccc;
	position: relative;
	top: 50px;
}
/*文字*/
.textborder {
	width: 885px;
	height: 520px;
	background: #cccccc;
	position: absolute;
	top: 180px;
	left: 218px;
	box-shadow: 0px 5px 15px #cccccc;
}
/*微信图片*/
.wx {
	width: 336px;
	height: 336px;
	position: absolute;
	top: 89px;
	right: 39px;
	border: 4px solid #ffff00;
	background-image: url(images/wx.png);
	width: 315px;
	height: 315px;
	background-repeat: no-repeat;
}
.textborder h1 {
	display: flex;
	font-family: "微软雅黑";
	font-size: 96px;
	position: relative;
	top: 91px;
	left: 60px;
	bottom: 43px;
}
.textborder p {
	font-family: "微软雅黑";
	font-size: 47px;
	position: relative;
	top: 225px;
	left: 58px;
}

.righttop {
	width: 132px;
	height: 108px;
	background: #cccccc;
	border-radius: 25px 42px 55px 42px;
	position: absolute;
	top: 0px;
	left: 1068px;
	background-image: url(images/xx.png);
	background-repeat: no-repeat;
}
.bb {
	width: 157px;
	height: 66px;
	background: #3e3749;
	border-radius: 33px 33px;
	position: absolute;
	bottom: 11px;
	left: 329px;
}
.bb2 {
	width: 157px;
	height: 66px;
	background: #3e3749;
	border-radius: 33px 33px;
	position: absolute;
	bottom: 11px;
	left: 808px;
}
 /* 现学现卖环节*/
.ghost{
        position: absolute;left: 1300px;bottom: 450px;
        width: 160px;
        height: 200px;
    }

    .body{
        /* 制作身体 */
        position: relative;
        width: 100%;
        height: 100%;
        border-top-right-radius: 80px;
        border-top-left-radius: 80px;
        background-color: #fff;
		/* 漂浮*/
        animation: float 4s ease infinite;
    }
/* k帧数*/
    @keyframes float {
        0%,100%{
            top: 0px;
        }
        40%{
            top: -40px;
        }
    }
    .face{
        display: flex;
		/* flex元素指定，环绕*/
        flex-wrap: wrap;
        position: absolute;
        top: 67px;
        left: 40px;
        width: 72px;
        height: 41px;
    }
    .eye{
        width: 20px;
        height: 20px;
        background-color: #000;
        border-radius: 100%;
    }
    .eye.left{
        margin-right: 32px;
    }
    .smile{
        width: 32px;
        height: 16px;
        background-color: #000;
        margin-top: 6px;
        margin-left: 20px;
        border-bottom-left-radius: 16px 12px;
        border-bottom-right-radius: 16px 12px;
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
    }
    .rosy{
        position: absolute;
        top: 28px;
        width: 22px;
        height: 8px;
        background-color: #FFAA9E;
        border-radius: 100%;
    }
    .rosy.left{
        left: -6px;
        transform: rotate(-8deg);
    }
    .rosy.right{
        right: -6px;
        transform: rotate(8deg);
    }
    .arm{
        position: absolute;
        top: 136px;
        width: 60px;
        height: 40px;
        background-color: #fff;
    }
    .arm.left{
        left: -4px;
        border-radius: 60% 100%;
        animation: arms-left 4s ease infinite;
    }
    .arm.right{
        right: -65px;
        border-radius: 100% 60%;
        animation: arms-right 4s ease infinite;
    }
    @keyframes arms-left {
        0%,100%{
            transform: translate(-50%,-50%) rotate(50deg);
        }
        40%{
            transform: translate(-50%,-50%) rotate(40deg);
        }
    }
    @keyframes arms-right {
        0%,100%{
            transform: translate(-50%,-50%) rotate(-50deg);
        }
        40%{
            transform: translate(-50%,-50%) rotate(-40deg);
        }
    }
    .bottom{
        display: flex;
        position: absolute;
        top: 100%;
        left: 0px;
        right: -1px;
    }
    .bottom div{
        flex-grow: 1;
        position: relative;
        top: -14px;
        height: 28px;
        border-radius: 100%;
        background-color: #fff;
    }
    .bottom div:nth-child(2n){
        top: -10px;
        margin: 0 -2px;
        background-color: transparent;
        border-top: 10px solid #fff;
    }
    .shadow{
        position: absolute;
        bottom: -100px;
        left: 50%;
        width: 200px;
        height: 12px;
        border-radius: 100%;
        background-color: gray;
        animation: shadow 4s ease infinite;
    }
    @keyframes shadow {
        0%,100%{
            transform: translateX(-50%) scale(1);
        }
        40%{
            transform: translateX(-50%) scale(0.5);
        }
    }