

body{ 
	font-family:"myFirstFont","微软雅黑", Helvetica, sans-serif;
	font-weight:normal;
	height: 100%;
	color:#333;
  font-size:15px;
  background:#fff;
}


/*底部*/
.footer{position: fixed;bottom: 0;left: 0;background: #fff;border-top: 1px solid #dbdbdb;width: 100%;/*20180815*/ z-index:4;/*20180815*/}
.footer ul li{width: 20%;float: left;}
.footer ul li .img2{display: none;}
.footer ul li i{width: 28%;margin: 0 auto;display: block;overflow: hidden;height:30px; margin-top:11px;}
.footer ul li i img{width:23px; display:block; margin:0 auto;}
.footer ul li span{font-size: 12px;text-align: center;line-height: 10px;display: block;width: 100%;color: #B9B9B9;margin-bottom:9px ;}
.footer ul li.on i .img1{display: none;}
.footer ul li.on i .img2{display: block;}
.footer ul li.on span{color: #F14712;}





.banner{ width:90%; margin:5% auto; box-shadow:0 0 30px 2px #eee; border-radius:5px; overflow:hidden;}
.banner img{ display:block; width:100%;}

.index{ width:100%;}
.index .text{margin:20px auto;align-items:center;width: 90%; background: #F3F3F3; border-radius: 5px;} 
.index .text img{ width:26px; margin-left: 10px; padding: 10px 0;}
.index .text .voice-icon{width: 16px; margin-left: 20px;}
.index .text span{margin-left:2px;font-size: 14px; color: #1B1B34;}
.index .text .right-icon{ width:14px; margin-left: 51px;}
.index .list{margin: 10px auto; width: 90%; text-align: center; position: relative;}
.index .list .pic img{width:100%;}
.index .list .pic .name{ position: absolute; left:0;bottom:40px; color:#FFFFFF; padding:2px 10px;  font-size:14px;}
.index .list foot{position:absolute;left:10px;bottom:17px;font-size:16px;color: #FFD04E;}
.index .list .credit{position:absolute;left:65px;bottom:20px;font-size:12px;color:#FFFFFF; opacity: 0.7;}
.index .list .buy{position:absolute;right:20px;bottom:15px;font-size:14px;color:#FFFFFF; background: #21498B; border-radius: 21px;width: 90px;height: 30px;display: flex;justify-content: center;align-items:center;}



.shop{width:100%}
.shop .head{display: flex;align-items: center; width: 100%;justify-content: space-between;margin: 5px auto;}
.shop .head .search{width:260px; height: 36px; background:#F3F3F3; border-radius: 18px; display:flex;justify-content: flex-start;align-items: center;margin-left: 15px;}
.shop .head .search i{font-size: 14px;margin-left: 10px;}
.shop .head .city{margin-right: 15px;}
.shop .head span{ color: #000B1C; font-size: 16px;font-weight: 800;}
.shop .head span i{margin-left:5px;font-size: 12px;}
.shop .list {width: 100%;border:1px solid #F3F3F3;margin: 10px auto auto auto; border-color: #F3F3F3 transparent  #F3F3F3  transparent;font-size: 14px;}
.shop .list table{width: 95%;margin:10px;}
.shop .list td{border:1px solid #F3F3F3;border-color: transparent #F3F3F3 transparent transparent; height: 30px;width: 30%; text-align: center;}
.shop .list td:last-child{border-right: 0;}
.shop .list .name .title1{color:#21498B;font-weight:800;}
.shop .list .name .title2{color:#001D15;font-weight:800; opacity: 0.6;}
.shop .list .name .title3{color:#001D15;font-weight:800;opacity: 0.6;}
.shop .list .h1{width: 30px; height: 1px; background: #21498B; border-radius: 2px; position: absolute; left:15%;margin-top: 30px;}
.shop .map{width: 100%;position: absolute;height: 100%;}






.bonus{width: 100%;height: 100%;}
.bonus .line{width: 100%; height:1px; background: #F3F3F3;}
.bonus .title{font-size: 16px;margin: 20px 0 0 14px;color:#333333;}
.bonus .title .money{color: #D40016;}
.bonus .text{width: 90%; margin: 15px auto; background: #FFFFFF;border-radius: 8px;}
.bonus .text .list{width:95%;margin-left: 2.5%;}
.bonus .text .one{border:1px solid #DDDDDD;width: 100%;height: 50%;border-color: transparent transparent #DDDDDD transparent;}
.bonus .text .name{color: #333333;font-size: 16px;padding: 17px 0;opacity: 0.6;width: 70%;}
.bonus .text .number{color:#333333;font-size: 16px;text-align: right;}
.bonus .add{width: 90%; margin: 70px auto;display: flex;justify-content:center;align-items: center;height: 50px;background: #21498B;border-radius: 8px;font-size: 18px;color: #FFFFFF;}
.bonus .foot{margin: 20px auto;width: 90%;display: flex;align-items: center;}
.bonus .foot img{width:14px;height: 14px;}
.bonus .foot span{font-size: 12px;color:#333333;opacity: 0.7;margin-left: 5px;}



.mine{width: 100%;}
.mine .head{display: flex;width: 90%; margin:10px auto;justify-content: space-between;}
.mine .head .h-img{margin-left: 15px;width: 70px;height: 70px;}
.mine .head .h-img img{width: 70px;height: 70px;border-radius: 50%;}
.mine .head .infos{display: flex;}
.mine .head .info{display: flex;flex-direction: column;margin-left: 11px;}
.mine .head .info .name{color: #000B1C;font-size: 18px; font-weight: 800;}
.mine .head .info .num{margin-top: 4px;color: #000B1C;font-size: 14px;}
.mine .head .info .vip{width: 80px;height: 20px;background: #E5E9F0;border-radius: 12px;display: flex;justify-content: center;align-items: center;font-size: 12px;color: #FE820A;margin-top: 5px;}
.mine .head .info .vip img{width: 14px;height: 14px;}
.mine .head .id{font-size: 12px;color: #000B1C;}
.mine .head .id img{width:14px;height: 14px;margin-left: 10px;}
.mine .text{margin: 15px auto;width:90%;background-image: url(../images/background.png);background-repeat: no-repeat;background-size: 100% 100%;}
.mine .text .tab .none{height: 10px;}
.mine .text .tab table{width: 92%;text-align: center;margin: 0 auto;}
.mine .text .tab td{width: 20%; border-right: 1px solid #2F4C89; border-bottom: 1px solid #2F4C89;}
.mine .text .tab  tr:last-child td{border-bottom: 0;}
.mine .text .tab  td:last-child{border-right: 0;}
.mine .text .tab  .money{font-size: 18px;color: #FFFFFF;margin-top: 15px;}
.mine .text .tab  .tip{font-size: 12px;color:white;margin: 5px 0 18px 0;}
.mine .stars{width: 90%;margin: 20px auto;background: #FFFFFF;border-radius:8px;  box-shadow: 0 0 6px #D4D4D4;justify-content: space-between;align-items: center;}
.mine .heath{margin: 10px 0px 0px 10px;font-size: 16px;color: #121D26;font-weight: 800;}
.mine .fiveStar{display: flex;align-items: center;}
.mine .fiveStar img{width: 14px;height: 14px;margin-right: 5px;}
.mine .fiveStar span{font-size: 14px;color: #F69631;font-weight: 800;margin:10px 10px 0 5px;}
.mine .orders{width: 90%;margin: 20px 0 0 5%;background: #FFFFFF;border-radius:8px;  box-shadow: 0 0 6px #D4D4D4;}
.mine .orders .order{display: flex;justify-content: space-between;}
.mine .orders .order .myOrder{font-size: 16px; font-weight: 800;color: #121D26;margin: 14px 0 0 9px;}
.mine .orders .order .all{font-size: 12px;margin:16px 7px 0 0;}
.mine .orders .line{width:95%;margin: 8px auto auto auto; border: 1px solid #E6E6E6;border-bottom: 0;}
.mine .orders .context{display: flex;justify-content: space-around;margin-top: 18px;}
.mine .orders .context .pic{display: flex; flex-direction: column;justify-content: center;align-items: center;}
.mine .orders .context .pic img{width: 26px;height: 26px;}
.mine .orders .context .pic span{font-size: 14px;color: #868C94;margin:9px 0 18px 0px ;}
.mine .orders .context .pic .Nums{display: flex;}
.mine .orders .context .pic .mark{width:16px;height:16px;margin:-5px 0 0 -10px;background:#CB141D;border-radius: 50%;display:flex;justify-content: center;align-items: center;color: #FFFFFF;font-size: 10px;}
.mine .icons{width: 90%;margin: 10px auto;background: #FFFFFF;border-radius: 8px;display: flex;flex-flow: wrap;justify-content: space-around; box-shadow: 0 0 6px #D4D4D4;}
.mine .icons .icon{display: flex; flex-direction: column;width: 25%;justify-content: center;align-items: center;}
.mine .icons .icon img{margin-top: 15px;width: 28px;height: 28px;}
.mine .icons .icon span{margin: 5px 0 15px 0 ;font-size: 12px; color: #868C94;}
.mine .icons .line{width: 90%;border: 1px solid #DDDDDD; border-bottom: 0;}