/*all*/
*{margin:0;padding:0;overflow: hidden;}
body{font-size:16px;font-family: Helvetica, Arial," sans-serif";background:#efefef;}
a{text-decoration: none;display: block;}

.main{position: relative;width:100vw;height:100vh}
header{width:100%;min-width: 1000px; height:60px;display: flex;position:fixed;top:3vw;left:5vh ;border-radius: 30px;padding:14px;box-sizing:border-box;z-index:10;}
header .logo{display: block;}
header nav{margin-left:20px;display: flex;}
header nav a{line-height: 32px;padding:0 20px;font-size:16px;color:#333;}
header .log{display: block;line-height:32px;padding:0 20px;border-radius: 50px;color:#333;background:#eee;border:solid 1px #ccc;margin-left:auto;/*在flex布局里默认左对齐，可以用margin-left:auto来实现最后一个元素右对齐*/}

header .start{display: block;line-height:32px;padding:0 20px;border-radius: 50px;color:#fff;background:#f954f6;margin-left:10px;}

.ad{width:40%;position: absolute;top:3vw;left:6vh;}
.ad h2{font-size: 4rem;color:#ffffff;margin-bottom:40px;text-shadow:4px 4px 0px rgba(19, 50, 91, 0.5);}
.ad p{width: 40%;font-size: 1rem;color:#234c98;border-top:solid 1px #234c98;border-bottom:solid 1px #234c98;line-height: 25px;padding:15px 0;}
.ad p span{padding:0 20px;}
.ad a{width:30%;border-radius: 15px;line-height: 50px;color:#234c98;background:#fff;box-sizing: border-box;text-align: center;margin-top:30px;border:solid 1px #234c98;}
.content{width:450px;position: absolute;top:6vh;right:3vw;padding-left:15px;}
.content h3{font-size:20px;color:#234c98;padding-bottom:10px;font-weight: normal;}
.content p{font-size: 1rem;color:#234c98;line-height: 25px;}
.pic{position: absolute;bottom:25%;right:3vw;display: flex;flex-direction: column;flex-direction: column;width:4%;padding:5px;}
.pic img{border:solid 1px #234c98;border-radius: 20px;margin:10px 0;}
.pic p{margin-bottom:10px;text-align: center;}
.surprise{margin-right:10px;width:110px;height:110px;border:solid 1px #234c98;border-radius: 20px;float: left;}
iframe{width:100vw;height:100vh;border:none;}
.keyboard{width:50%;height:150px;position: absolute;bottom:3vw;left:6vh;}
.keyboard h3{font-size:20px;color:#234c98;padding-bottom:10px;font-weight: normal;}
.keyboard p{font-size: 1rem;color:#234c98;line-height: 25px;}
.foot{width:60%;line-height:40px;border-top:solid 1px #333;border-bottom:solid 1px #333;position:fixed;bottom:60px;left:20%;display:flex;justify-content: center;}
.foot a{color:#333;padding: 0 20px;}
.pf{width:450px;height:150px;position: absolute;bottom:3vh;right:3vw;padding-left:15px;}
.pf h3{font-size:20px;color:#234c98;padding-bottom:10px;font-weight: normal;}
.pf p{font-size: 1rem;color:#234c98;line-height: 25px;}
.pf img{margin-right:10px;width:40px;height:40px;border:solid 1px #234c98;border-radius: 10px;float: left;}