*{
	margin: 0 auto;
	padding: 0;
}
#play{
	width: 1024px;
	height: 768px;
	margin: 0 auto;
	position: relative;/* 相对定位 */
}

/* 载入模块 */
/* 载入页面 */
.loadPage{
	width: 1024px;
	height: 768px;
	margin: 0 auto;
	background-image: url(./../images/startbg.jpg);
	position: absolute;
	overflow: hidden;
	display: flex;
	justify-content:center;
	align-items:center;
	z-index: 3;
}
/* logo */
.logo{
	width: 802px;
	height: 390px;
	background-image: url(../images/logo.png);
	position: absolute;
	z-index: 1;
	top: 185px ;
	left: 117px ;
}
/* 载入提示 */
.loadPrompt{
	width: 150px;
	height: 30px;
	position: absolute;
	top: 575px ;
	/* left:0px ; */
}
.loadPrompt span{
	color: #ffffff;
}

/* 主页模块 */
/* 游戏背景图 */
.gameBackground{
	width: 1024px;
	height: 768px;
	margin: 0 auto;
	background-image: url(./../images/startbg.jpg);
	position: absolute;
	overflow: hidden;
/* 	display: flex;
	justify-content:center;
	align-items:center;
 */}
 /* 开始游戏按钮 */
.startGame{
	width: 204px;
	height: 56px;
	position: absolute;
	top: 428px;
	left: 402px;
	border-radius: 10px;
	z-index: 2;
}
/* 规则模块 */
/* 规则按钮 */
.ruleButton{
	width: 50px;
	height: 50px;
	/* background-color: royalblue; */
	background-image: url(../images/book.png);
	background-size: 50px 50px ;
	position: absolute;
	top: 388px ;
	left: 938px ;
	z-index: 1;
	/* 
	-webkit-filter:blur(15px);
	
	-moz-filter:blur(15px);
	
	-o-filter:blur(15px);
	
	-ms-filter:blur(15px); 
	*/
	filter:blur(0.3px);
}
/* 规则窗口 */
.ruleGameBackground{
	width: 1024px;
	height: 768px;
	margin: 0 auto;
	background-image: url(./../images/startbg.jpg);
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 2;
}
.rule{
	width: 450px;
	height: 300px;
	border-style: dashed;
	background-color: #c8e7f9;
	z-index: 3;
	border-radius: 10px;
	border-width: 1px ;
	position: absolute;
}
.rule span{
	display: inline-block;
	width: 400px;
	color: #062a4f;
	line-height: 32px;
	text-indent: 2em;
	padding-left: 25px ;
}
.x{
	position: absolute;
	width: 30px;
	height: 30px;
	background-image: url(../images/close.png);
	background-size: 30px 30px ;
	left: 418px ;
}
/* 个人模块 */
.personalModule{
	width: 500px;
	height: 100px;
	background-color: transparent;
	border-radius: 0px 00px 10px 0px ;
	position: absolute;
	top: 0px ;
	left: 0px ;
	display: flex;
	justify-content: space-around;
	flex-direction: column;
}
/* 个人头像 */
.personaIcon{
	width: 60px;
	height: 60px;
	position: absolute;
	border-width: 5px ;
	border-color: #2f58c8;
	border-style: solid;
	/* top: 12px ; */
	left: 25px ;
	/* background-color: red; */
	background-image: url(../images/greenHead.jpeg);
	background-size: 60px 60px ;
	border-radius: 35px ;
}
.gameLevel_personalName{
	width: 186px;
	height: 26px;
	position: absolute;
	/* top: 0px ; */
	left: 69px ;
	background-color: #00499d;
	border-radius: 13px ;
	border-width: 0px ;
	border-style: solid;
	border-color: #2856d6;
}
/* 个人信息 成就 */
/* 背景模糊 */
.PAPackgroundBlur{
	width: 1024px;
	height: 768px;
	position: absolute;
	margin: 0 auto;
	background-image: url(./../images/startbg.jpg);
	/* filter:blur(1px); */
	z-index: 2;
	display: flex;
	flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.personalInformation_achievements{
	width: 650px ;
	height: 414px ;
	position: absolute;
	background-color: #1a1c49;
	border-radius: 10px ;
	
}
/* 关闭按钮 */
.closeButton{
	width: 40px;
	height: 40px;
	position: absolute;
	top: -5px ;
	left: 615px ;
	background-color: #ffffff;
	background-image: url(./../images/close.png);
	background-size:40px 40px ;
	border-radius: 23px ;
	z-index: 1;
}
/* 个人信息按钮 成就按钮 */
.personalInformationButton_achievementsButton{
	width: 610px;
	height: 43px;
	position: absolute;
	background-color: #1a1c49;
	border-radius: 10px ;
	top: 0px ;
	left: 20px ;
	display: flex;
	flex: 1;
}
/* 个人信息按钮 */
.personalInformationButton{
	width: 590px;
	height: 43px;
	background-image: linear-gradient( #182a7a, #1061ae);
	border-radius: 0px 0px 10px 10px ;
	border-width: 0px 3px 6px 3px ;
	border-style: solid;
	border-color: #182a7a;
}
.personalInformationButton span{
	width: 590px;
	height: 43px;
	position: absolute;
	line-height: 43px ;
	font-size: 20px ;
	font-weight: 600;
	text-align: center;
	color: #008dd3;
}
/* 个人信息展示 */
.personalInformation{
	width: 610px;
	height: 340px;
	position: absolute;
	top: 63px ;
	left: 20px ;
}
/* 头像 修改昵称 设置 */
.headPortrait_name_set{
	width: 193px;
	height: 330px;
	position: absolute;
	background-color: #002b5f;
	border-color: #154f85;
	border-radius: 10px ;
	border-width: 5px ;
	border-style: solid;
	top: 0px ;
	left: 0px ;
	display: flex;
	justify-content: center;
}
/* 头像 */
.PIHeadPortrait{
	width: 100px;
	height: 100px;
	position: absolute;
	border: 5px solid #0d7bbb;
	background-image: url(../images/greenHead.jpeg);
	background-size: 100px 100px ;
	border-radius: 10px ;
	top: 40px ;
}
.PIHeadPortrait span{
	width: 100px;
	height: 30px;
	position: absolute;
	top: 75px ;
	font-size: 15px ;
	text-align: center;
	color: #e6e6e6;
	background-color: rgba(0, 0, 0, 0.3);
}
/* 等级 */
.PIClass{
	width: 120px;
	height: 30px;
	position: absolute;
	border-radius: 10px ;
	border: 3px solid #0b659c;
	background-image: linear-gradient(180deg, #000000, #00275a);
	top: 155px ;
}
.PIClass span{
	width: 120px;
	position: absolute;
	top: 2px ;
	font-size: 20px ;
	text-align: center;
	font-style: italic;
	font-weight: 900;
	color: #ddd;
}
/* 修改昵称 */
.PINameButton{
	width: 100px;
	height: 35px;
	position: absolute;
	background-image: linear-gradient(180deg, #58e2ee, #0096d5);
	border-style: solid;
	border-width: 3px ;
	border-radius: 8px ;
	border-color: #2eaddb;
	top:200px ;
}
.PINameButton span{
	width: 100px;
	position: absolute;
	top: 4px ;
	font-size: 20px ;
	text-align: center;
	font-weight: 900;
	text-shadow: 1px 1px 0 #1fa5d3;
	color: #ddd;
}
/* 设置 */
.PISet{
	width: 100px;
	height: 35px;
	position: absolute;
	background-image: linear-gradient(180deg, #58e2ee, #0096d5);
	border-style: solid;
	border-width: 3px ;
	border-radius: 8px ;
	border-color: #2eaddb;
	top: 280px ;
}
.PISet span{
	width: 100px;
	position: absolute;
	top: 4px ;
	font-size: 20px ;
	text-align: center;
	font-weight: 900;
	text-shadow: 1px 1px 0 #1fa5d3;
	color: #ddd;
}

/* 等级 */
.fishingcClassShow{
	width: 397px;
	height: 102px;
	position: absolute;
	background-image: linear-gradient(180deg, #b247da, #7f34d2, #3f28a9, #4128ae);
	border-radius: 10px ;
	top: 0px ;
	left: 213px ;
}
/* 等级展示 */
.fishingcClass{
	width: 397px;
	height: 40px;
	position: absolute;
	/* background-color: pink; */
	top: 10px ;
	left: 0px ;
}
.fishingcClass span:nth-child(1){
	width: 60px;
	height: 30px;
	position: absolute;
	font-size: 23px ;
	font-weight: 900 ;
	text-align: center;
	color: #e9d734;
	top: 5px ;
	left: 40px ;
	/* background-color: #ffffff; */
}
.fishingcClass span:nth-child(3){
	width: 60px;
	height: 30px;
	position: absolute;
	font-size: 23px ;
	font-weight: 900 ;
	text-align: center;
	color: #e9d734;
	top: 5px ;
	left: 300px ;
	/* background-color: #ffffff; */
}
.arrows{
	width: 150px;
	height: 30px;
	position: absolute;
	top: 5px ;
	left: 125px ;
	background-color: transparent;
	display: flex;
	justify-content: center;
}
.arrowsImg{
	width: 100px;
	height: 30px;
	background-image: url(../images/right.png);
	background-size: 100px 30px ;
	/* background-color: pink; */
}
/* 升级提示 */
.upgradePrompt{
	width: 397px;
	height: 30px;
	position: absolute;
	background-color: transparent;
	top: 60px ;
	left: 0px ;
}
.upgradePrompt span{
	width: 200px;
	height: 30px;
	position: absolute;
	top: 2px ;
	left: 20px ;
	font-size: 17px ;
	font-weight: 500;
	color: #e9d734;
}
/* 详细信息 */
.detailedInformation{
	width: 397px;
	height: 218px;
	position: absolute;
	background-color: transparent;
	top: 122px ;
	left: 213px ;
}
/* 持有金币数 */
.goldCoin{
	width: 397px;
	height: 40px;
	position: absolute;
	top: 0px ;
	background-color: #0d306b;
	border-width: 0px 0px 3px 0px ;
	border-style: solid;
	border-color: #0f5496;
	border-radius: 2px ;
}
/* 持有钻石数 */
.diamondCoin{
	width: 397px;
	height: 40px;
	position: absolute;
	top: 45px ;
	background-color: #0d306b;
	border-width: 0px 0px 3px 0px ;
	border-style: solid;
	border-color: #0f5496;
	border-radius: 2px ;
}
/* 捕获鱼数量 */
.earnedGold{
	width: 397px;
	height: 40px;
	position: absolute;
	top: 90px ;
	background-color: #0d306b;
	border-width: 0px 0px 3px 0px ;
	border-style: solid;
	border-color: #0f5496;
	border-radius: 2px ;
}
/* 解锁鱼数量 */
.numberOfUnlockedFish{
	width: 397px;
	height: 40px;
	position: absolute;
	top: 135px ;
	background-color: #0d306b;
	border-width: 0px 0px 3px 0px ;
	border-style: solid;
	border-color: #0f5496;
	border-radius: 2px ;
}
/* 拥有武器数 */
.numberOfWeaponsOwned{
	width: 397px;
	height: 40px;
	position: absolute;
	top: 180px ;
	background-color: #0d306b;
	border-width: 0px 0px 3px 0px ;
	border-style: solid;
	border-color: #0f5496;
	border-radius: 2px ;
}
.goldCoin span:nth-child(1),.diamondCoin span:nth-child(1),.earnedGold span:nth-child(1),.numberOfUnlockedFish span:nth-child(1),.numberOfWeaponsOwned span:nth-child(1){
	width: 150px;
	height: 40px;
	position: absolute;
	font-size: 16px ;
	line-height: 40px ;
	color: #d9d9d9;
	left: 20px ;
}
.goldCoin span:nth-child(2),.diamondCoin span:nth-child(2),.earnedGold span:nth-child(2),.numberOfUnlockedFish span:nth-child(2),.numberOfWeaponsOwned span:nth-child(2){
	width: 150px;
	height: 40px;
	position: absolute;
	font-size: 16px ;
	color: #e7da47;
	line-height: 40px ;
	left: 140px ;
}

/* 游戏等级 */
.gameLevel{
	width: 50px;
	height: 26px;
	position: absolute;
	/* top: 56px ; */
	left: 23px ;
	background-color: transparent;
}
.gameLevel span{
	font-size: 18px ;
	text-align: center;
	color: #ffff7f;
}
/* 名称 */
.personalName{
	width: 90px;
	height: 26px;
	position: absolute;
	/* top: 56px ; */
	left: 80px ;
	background-color: transparent;
	border-radius: 13px ;
}
.personalName span{
	font-size: 16px ;
	text-align: center;
	color: #ffffff;
}
/* 持有金币 */
.goldCoinsHeld{
	width: 120px;
	height: 26px;
	position: absolute;
	/* top: 56px ; */
	left: 300px ;
	border-radius: 13px ;
	background-color: #00499d;
}
.goldCoinsHeld span{
	width: 120px;
	height: 26px;
	position: absolute;
	text-align: center;
	font-size: 20px ;
	line-height: 26px ;
	color: #ffffff;
}
/* 金币图标 */
.goldIco{
	width: 35px;
	height: 35px;
	position: absolute;
	top: -5px ;
	left: -13px ;
	background-image: url(../images/coinAni2_01.png);
	background-size: 35px 35px ;
}
/* 加号图标 */
.goldPlus{
	width: 26px;
	height: 26px;
	position: absolute;
	left: 105px ;
	background-color: #fff;
	border-radius: 13px ;
	background-image: url(../images/plus.png);
	background-size: 26px 26px ;
}
/* 钻石持有量 */
.diamondCoinsHeld{
	width: 120px;
	height: 26px;
	position: absolute;
	/* top: 56px ; */
	left: 460px ;
	border-radius: 13px ;
	background-color: #00499d;
}
.diamondCoinsHeld span{
	width: 120px;
	height: 26px;
	position: absolute;
	text-align: center;
	font-size: 20px ;
	line-height: 26px ;
	color: #ffffff;
}

 /* 钻石图标 */
.diamondIco{
	width: 40px;
	height: 40px;
	position: absolute;
	top: -8px ;
	left: -13px ;
	background-image: url(../images/diamond.png);
	background-size: 40px 40px ;
}
/* 修改昵称 */
.nameModification{
	width: 200px;
	height: 200px;
	position: absolute;
	top: 120px ;
	left: 250px ;
	background-color: #00275a;
	border-radius: 10px ;
	border-width: 3px ;
	border-style: solid;
	border-color: #0096d5;
	display: flex;
	justify-content: center;
}
.nameModification input{
	width: 100px;
	height: 30px;
	position: absolute;
	background-color: #eef9ff;
	border-width: 0px ;
	border-radius: 5px ;
	top: 40px ;
}
/* 提交按钮 */
.submitButton{
	width: 100px;
	height: 40px;
	position: absolute;
	top: 110px ;
	border-radius: 8px;
	background-image: linear-gradient(180deg, #58e2ee, #0096d5);
	
	/* background-color: #00275a; */
}
.submitButton span{
	width: 100px;
	height: 30px;
	position: absolute;
	top: 5px;
	/* background-color: #ffaaff; */
	border-radius: 8px ;
	font-size: 20px ;
	font-weight: 600 ;
	color: #fff;
	text-align: center;
}
/* 输入提示 */
.nameModificationhHint{
	width: 120px;
	height: 20px;
	/* background-color: pink; */
	position: absolute;
	top: 75px ;
}
.nameModificationhHint span{
	width: 120px;
	font-size: 14px ;
	font-weight: 500 ;
	text-align: center;
	color: #aa0000;
	display: none;
}
/* 返回按钮 */
.nameModificationReturn{
	width: 30px;
	height: 30px;
	position: absolute;
	background-color: #fff;
	background-image: url(../images/close.png);
	background-size: 30px 30px ;
	border-radius: 15px;
	top: -15px ;
	left: 185px ;
}

/* 设置模块 */
/* 设置 */
.set{
	width: 50px;
	height: 50px;
	background-color: #fff;
	border-radius: 25px ;
	background-image: url(../images/set.png);
	background-size: 50px 50px ;
	position: absolute;
	top: 30px ;
	left: 938px ;
	z-index: 1;
}
/* 设置窗口 */
/* 背景 */
.setBackground{
	width: 1024px;
	height: 768px;
	margin: 0 auto;
	background-image: url(./../images/startbg.jpg);
	position: absolute;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
}
.setWicket{
	width: 300px;
	height: 200px;
	position: absolute;
	background-color: #002f65;
	border-radius: 10px ;
	border-width: 3px ;
	border-style: solid;
	border-color: #00aaff;
	display: flex;
	justify-content: center;
}
.SetReturnButton{
	width: 40px;
	height: 40px;
	position: absolute;
	background-color: #fff;
	background-image: url(../images/close.png);
	background-size: 40px 40px ;
	border-radius: 20px;
	top: -20px;
	left: 280px ;
}
/* 音乐 */
.backgroundMusic{
	width: 300px;
	height: 50px;
	position: absolute;
	background-color: #002b5f;
	top: 75px ;
}
/* 音效 */
.soundEffect{
	width: 300px;
	height: 50px;
	position: absolute;
	background-color: #002b5f;
	top: 110px ;
}
.backgroundMusic span,.soundEffect span{
	width: 300px;
	height: 25px;
	position: absolute;
	font-size: 16px;
	text-align: center;
	font-weight: 600;
	color: #fff;
	/* background-color: pink; */
	top: 12px ;
}
/* 签到模块 */
/* 签到 */
.signIn{
	width: 50px;
	height: 50px;
	/* background-color: royalblue; */
	background-image: url(../images/signIn.png);
	background-size: 50px 50px ;
	position: absolute;
	top: 250px ;
	left: 938px ;
	z-index: 1;
}
/* 背景 */
.signInBackground{
	width: 1024px;
	height: 768px;
	margin: 0 auto;
	background-image: url(./../images/startbg.jpg);
	position: absolute;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
}
/* 窗口 */
.signInWicket{
	width: 500px;
	height: 360px;
	position: absolute;
	border-radius: 10px ;
	background-color: #154f85;
	display: flex;
	justify-content: center;
}
/* 每日签到 */
.dailyAttendance{
	width: 470px;
	height: 60px;
	position: absolute;
	background-color: #002b5f;
	top: 25px ;
	border-radius: 10px ;
}
.dailyAttendance span{
	width: 470px;
	position: absolute;
	top: 5px ;
	color: #fff;
	font-size: 30px ;
	font-weight: 900;
	text-align: center;
}
/* 签到点击位置 */
.signInClickPosition{
	width: 470px;
	height: 230px;
	position: absolute;
	border-radius: 10px ;
	background-color: #002b5f;
	top: 110px ;
	display: flex;
	justify-content: center;
}
/* 天数 */
.numberOfDays{
	width: 470px;
	height: 100px;
	position: absolute;
	background-color: transparent;
	top: 30px ;
	display: flex;
}

.first,.second,.thirdly,.fourthly,.fifth,.sixth,.seventh{
	width: 57px;
	background-color: #ffffff;
	border-radius: 7px ;
	display: flex;
	justify-content: center;
}
/* 天数 */
.first span:nth-child(1),.second span:nth-child(1),.thirdly span:nth-child(1),.fourthly span:nth-child(1),.fifth span:nth-child(1),.sixth span:nth-child(1),.seventh span:nth-child(1){
	width: 57px;
	position: absolute;
	text-align: center;
	font-size: 15px ;
	top: 5px ;
}
.signInGold{
	width: 30px;
	height: 30px;
	background-color: pink;
	position: absolute;
	top: 30px ;
}
/* 奖励 */
.first span:nth-child(3),.second span:nth-child(3),.thirdly span:nth-child(3),.fourthly span:nth-child(3),.fifth span:nth-child(3),.sixth span:nth-child(3),.seventh span:nth-child(3){
	width: 57px;
	position: absolute;
	text-align: center;
	top: 70px ;
}
/* 提交按钮 */
.punchIn{
	width: 150px;
	height: 50px;
	/* background-color: pink; */
	background-image: linear-gradient(180deg, #58e2ee, #0096d5);
	border: 2px solid #0052b6;
	position: absolute;
	top: 155px ;
	border-radius: 10px;
}
.punchIn span{
	width: 150px;
	height: 50px;
	position: absolute;
	top: 10px ;
	text-align: center;
	font-size: 20px ;
	font-weight: 800;
	color: #fff;
}
/* 返回按钮 */
.signInReturnButton{
	width: 40px;
	height: 40px;
	position: absolute;
	background-color: #fff;
	background-image: url(../images/close.png);
	background-size: 40px 40px ;
	border-radius: 20px;
	top: -20px;
	left: 480px ;
}
/* 商店模块 */
/* 商店 */
.shop{
	width: 50px;
	height: 50px;
	/* background-color: royalblue; */
	background-image: url(../images/shoppingTrolley.png);
	background-size: 50px 50px ;
	position: absolute;
	top: 526px ;
	left: 938px ;
	z-index: 1;
}
/* 背景 */
.shopBackground{
	width: 1024px;
	height: 768px;
	margin: 0 auto;
	background-image: url(./../images/startbg.jpg);
	position: absolute;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
}
/* 窗口 */
.shopWicket{
	width: 500px;
	height: 460px;
	position: absolute;
	border-radius: 10px ;
	background-color: #002b5f;
	display: flex;
	justify-content: center;
}
/* 金币标题 */
.goldTitle{
	width: 390px;
	height: 50px;
	position: absolute;
	border-radius: 10px ;
	top: 15px ;
	background-color: #001f48;
}
.goldTitle span{
	width: 390px;
	height: 50px;
	position: absolute;
	font-size: 28px ;
	font-weight: 900;
	color: #fff;
	text-align: center;
	line-height: 50px ;
}
/* 购买位置 */
.purchaseLocation{
	width: 390px;
	height: 360px;
	position: absolute;
	top: 80px ;
	background-color: #001f48;
	border-radius: 10px ;
	display: flex;
	flex-wrap: wrap;
	align-content: space-around;
}
/* 购买选择 */
.purchasingChoice1,.purchasingChoice2,.purchasingChoice3,.purchasingChoice4,.purchasingChoice5,.purchasingChoice6{
	width: 100px;
	height: 150px;
	background-color: #0087c5;
	border-radius: 10px ;
	border: 2px solid #0087c9;
	position: relative;
	display: flex;
	justify-content: center;
}
/* 购买数量 */
.purchasingChoice1 span:nth-child(1),.purchasingChoice2 span:nth-child(1),.purchasingChoice3 span:nth-child(1),.purchasingChoice4 span:nth-child(1),.purchasingChoice5 span:nth-child(1),.purchasingChoice6 span:nth-child(1){
	width: 100px;
	height: 30px;
	position: absolute;
	background-color: #00275a;
	border-radius: 10px 10px 0px 0px ;
	color: #ffff7f;
	text-align: center;
	font-size: 15px ;
	font-weight: 500;
	line-height: 30px ;
}
/* 金币图片 */
.shopGoldCoinPicture{
	width: 50px;
	height: 50px;
	position: absolute;
	top: 50px ;
	background-image: url(../images/coinAni2_01.png);
	background-size: 50px 50px ;
}
/* 购买按钮 */
.priceDisplay{
	width: 80px;
	height: 30px;
	position: absolute;
	border-radius: 8px ;
	top: 110px ;
	border-width: 3px ;
	border-style: solid;
	border-color: #0077ff;
	background-image: linear-gradient(180deg, #58e2ee, #0096d5);;
}
.shopDiamondPicture{
	width: 25px;
	height: 25px;
	position: absolute;
	background-image: url(../images/diamond.png);
	background-size: 25px 25px ;
	top: 2px ;
	left: 5px ;
}
.priceDisplay span{
	width: 40px;
	height: 25px;
	position: absolute;
	background-color: transparent;
	color: #ffffff;
	top: 2px ;
	left: 35px ;
}
/* 购买成功提示 */
.purchaseSuccessPrompt{
	width: 200px;
	height: 100px;
	position: absolute;
	background-color: #004fa9;
	border-radius: 10px ;
	border: 2px solid #00469c;
	top: 200px ;
}
.purchaseSuccessPrompt span{
	width: 200px;
	height: 100px;
	position: absolute;
	border-radius: 10px ;
	line-height: 100px ;
	text-align: center;
	font-size: 20px ;
	font-weight: 600;
	color: #fff;
	background-color: #001f48;
}
/* 提示关闭按钮 */
.purchaseSuccessPromptButton{
	width: 20px;
	height: 20px;
	position: absolute;
	background-color: #fff;
	background-image: url(../images/close.png);
	background-size: 20px 20px ;
	border-radius: 20px;
	top: -10px;
	left: 190px ;
}
/* 返回按钮 */
.shopnReturnButton{
	width: 40px;
	height: 40px;
	position: absolute;
	background-color: #fff;
	background-image: url(../images/close.png);
	background-size: 40px 40px ;
	border-radius: 20px;
	top: -20px;
	left: 480px ;
}
/* 活动模块 */
/* 活动 */
.activity{
	width: 50px;
	height: 50px;
	/* background-color: royalblue; */
	background-image: url(../images/giftBag.png);
	background-size: 50px 50px ;
	position: absolute;
	top: 250px ;
	left: 34px ;
	z-index: 1;
}
/* 背景 */
.activityBackground{
	width: 1024px;
	height: 768px;
	margin: 0 auto;
	background-image: url(./../images/startbg.jpg);
	position: absolute;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
}
/* 窗口 */
.activityWicket{
	width: 500px;
	height: 370px;
	position: absolute;
	border-radius: 10px ;
	background-color: #154f85;
	display: flex;
	justify-content: center;
}
/* 任务标题 */
.activityTitle{
	width: 200px;
	height: 50px;
	position: absolute;
}
.activityTitle span{
	width: 200px;
	height: 50px;
	position: absolute;
	border-radius: 10px ;
	line-height: 50px ;
	text-align: center;
	font-size: 20px ;
	font-weight: 600;
	color: #fff;
}
/* 任务详情 */
.taskDetails{
	width: 450px;
	height: 300px;
	position: absolute;
	border-radius: 10px ;
	top: 50px ;
	background-color: #001f48;
	overflow-y :auto;
	display: flex;
	flex-direction: column;
}
/* 任务一 */
.task{
	width: 400px;
	height: 60px;
	position: relative;
	margin-top: 12px ;
	border-radius: 2px ;
	border-width: 0px 0px 5px 0px ;
	border-style: solid;
	border-color: #002f65;
	background-color: #2284d9;
	display: flex;
	align-items: center;
}
::-webkit-scrollbar {
  width: 10px;
  background-color: transparent;
}
/* 图片 */
.pictureTask{
	width: 40px;
	height: 40px;
	border-width: 2px ;
	border-style: solid;
	border-color: #0052bd;
	/* position: absolute; */
	background-color: pink;
	background-image: url();
}
/* 内容 */
.taskDefinition{
	width: 160px;
	height: 50px;
	/* position: absolute; */
}
.taskDefinition span:nth-child(1){
	width: 160px;
	height: 50px;
	line-height: 25px ;
	text-align: center;
	font-size: 14px ;
	font-weight: 500;
	color: #fff;
}
.taskDefinition span:nth-child(3){
	width: 160px;
	height: 50px;
	line-height: 25px ;
	text-align: center;
	font-size: 14px ;
	font-weight: 500;
	color: #ffff00;
}
/* 领取按钮 */
.taskclaimButton{
	width: 50px;
	height: 25px;
	border-radius: 8px ;
	background-image: linear-gradient(180deg, #58e2ee, #0096d5);
	/* position: absolute; */
}
.taskclaimButton span{
	width: 50px;
	height: 425px;
	position: absolute;
	line-height: 25px ;
	text-align: center;
	font-size: 15px ;
	font-weight: 500;
	color: #fff;
}
/* 返回按钮 */
.activityReturnButton{
	width: 40px;
	height: 40px;
	position: absolute;
	background-color: #fff;
	background-image: url(../images/close.png);
	background-size: 40px 40px ;
	border-radius: 20px;
	top: -10px;
	left: 480px ;
}


/* 抽奖模块 */
/* 抽奖 */
.icon{
	width: 50px;
	height: 50px;
	/* background-color: royalblue; */
	background-image: url(../images/storehouse.png);
	background-size: 50px 50px ;
	position: absolute;
	top: 388px ;
	left: 34px ;
	z-index: 1;
}
/* 背景 */
.iconBackground{
	width: 1024px;
	height: 768px;
	margin: 0 auto;
	background-image: url(./../images/startbg.jpg);
	position: absolute;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
}
/* 窗口 */
.iconWicket{
	width: 500px;
	height: 500px;
	position: absolute;
	border-radius: 10px ;
	background-color: #154f85;
	display: flex;
	justify-content: center;
	align-items: center;
}

    /*外部大框样式*/
    .outer-square {
        background-color: #00357a;
        width: 400px;
        height: 400px;
        border-radius: 5%;
        position:absolute;
    }
    /*内部大框样式*/
    .inner-square {
        background-color: #093f85;
        width: 360px;
        height: 360px;
        border-radius: 5%;
        margin-left: 20px;
        margin-top: 20px;
    }
    /*小方格样式*/
    .small-square {
        background-color: white;
        width: 80px;
        height: 80px;
        border-radius: 10%;
        margin-left: 22px;
        margin-top: 22px;
        float:left;
        border: 5px solid transparent;
    }
 
    /*中间按钮样式*/
    .center-button {
        background-color: #00aaff;
        width: 88px;
        height: 88px;
        border-radius: 10%;
        margin-left: 22px;
        margin-top: 22px;
        float:left;
        font-size: 18px;
		color: #fff;
        font-family: "monospace";
    }
    /*小图片样式*/
    img {
        width: 30px;
        height: 30px;
        margin-left: 23px;
        margin-top: 23px;
    }
	.small-square span{
		width: 80px;
		position: absolute;
		text-align: center;
		font-size: 16px;
		color: #55aaff;
	}
.iconReturnButton{
	width: 40px;
	height: 40px;
	position: absolute;
	background-color: #fff;
	background-image: url(../images/close.png);
	background-size: 40px 40px ;
	border-radius: 20px;
	top: -10px;
	left: 480px ;
}

/* 倒计数奖励 */
.award{
	width: 50px;
	height: 50px;
	/* background-color: royalblue; */
	background-image: url(../images/coinAni2_01.png);
	background-size: 50px 50px ;
	position: absolute;
	top: 526px ;
	left: 34px ;
	z-index: 1;
}
.set span,.signIn span,.shop span,.activity span,.icon span,.award span,.ruleButton span{
	width: 50px;
	color: #ffffff;
	position: absolute;
	text-align: center;
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
	font-size: 15px ;
	top: 40px ;
}