header,footer,section,article,aside,nav,hgroup,address,figure,figcaption,menu,details{display:block;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;font-weight:normal;}
html,body,fieldset,img,iframe,abbr{border:0;}
i,cite,em,var,address,dfn{font-style:normal;}
[hidefocus],summary,input{outline:0;}/*hideFocus对超链接外虚线框的设置*/
ul,dl,li{list-style:none;}
h1,h2,h3,h4,h5,h6,small{ font-weight:normal;}
pre,code,kbd,samp{font-family:inherit;}
textarea{overflow:auto;resize:none;}
label,summary{cursor:default;}/*default默认光标（通常是一个箭头）*/
a,button{cursor:pointer; -webkit-tap-highlight-color: transparent;}
del,ins,a,a:hover{text-decoration:none;}
body,textarea,input,button,select{font:14px arial,"微软雅黑";color:#333;outline:0; line-height: 22px;}
*{ padding: 0px; margin: 0px;}
body{ background-color: #fff;}
.topNav{ padding-top: 12px; padding-bottom: 12px; background-color: #f5f5f5; padding-left: 3.25%; padding-right: 3.25%;
 display: flex;display: -webkit-flex;align-items: center;-webkit-align-items: center; justify-content: space-between;-webkit-justify-content: space-between;}
 .topNav-lt{ width: 12%;max-width: 72px;}
 .topNav-lt img{ display: block; width: 100%;}
  .topNav-tx{ margin-left: 5px;flex: 1; line-height: 1; overflow: hidden;}
 .topNav-tx h3{font-size: 14px; font-weight: bold;}
  .topNav-tx p{ width: 100%; white-space: nowrap;overflow: hidden;text-overflow:ellipsis; font-size: 11px; color: #999; margin-top: 6px;}
  .topNav-btn1{ background: linear-gradient(to right,#4799ff,#2386ff); color: #fff; border-radius: 26px; font-size: 13px;
    padding: 7px 12px; line-height: 1; white-space: nowrap; }
.topNav-close{ margin-left: 12px;}	
.topNav-close img{ display: block; width: 14px;}
.potoAdv{ position: relative;}
.potoAdvbd-img img{display: block; width: 100%;}
.swiper-pagination{ color: #fff; font-size: 12px;text-align: right;}
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{ bottom:35%;
   left: auto;  right: 10px; width: 40px; height:20px;line-height: 20px;text-align: center; display: block; background: url(../images/poto-bg1.png) no-repeat; background-size: 100% 100%;}
.potoAdv-ft{ position:absolute; left:0;right:0;top:0; display:flex;display:-webkit-flex;justify-content:space-between;-webkit-justify-content:space-between;
    align-items:center;-webkit-align-items:center;z-index:1;
    background-image:linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0));padding: 12px 3.25% 6px 3.25%;}
.userImg{width: 11%;max-width: 56px; position: relative;}	
.userImg img{ display: block; width: 80%; margin: 0 auto; border-radius: 50%;}
.userImg a{ position: absolute; left: 0; right: 0; top: -2px; display: block; background:linear-gradient(to right,#3492fe,#006eff); border-radius: 26px;
 color: #fff; text-align: center; font-size: 10px; line-height: 1.4; transform: scale(0.8);}
 .poto-logo{ flex: 1; border-left: 1px solid rgba(255,255,255,0.5);padding-left: 12px;margin-left: 12px;}
 .poto-logo img{ width:52%;display: block;max-width: 128px; }
.search{width:30%;height:32px;align-items: center;background:rgba(255,255,255,0.2); border-radius: 26px;position:relative;overflow:hidden;}
.search img{width:18px;display:block;margin-right:5px;position:absolute;top:7px;left:10px;}
.search input{ width: 0; flex: 1;height: 32px; border: none; background: transparent; color: #fff;}
.search input::-webkit-input-placeholder{ color: #fff;}
.search .search-item{height:32px;line-height:32px;position:absolute;left:33px;top:32px;color:rgba(235,235,235,0.8);white-space:nowrap;}

 .potoAdv-ft-rt{text-align: center;color: #fff; margin-left: 12px;}
 .potoAdv-ft-rt img{ display: block; width: 22px;margin-bottom: 1px;}
 .potoAdv-ft-rt span{ display: block; text-align: center; line-height:1; font-size: 12px; transform: scale(0.8);}
 .card{ margin-left: 3.25%; margin-right: 3.25%; position: relative;z-index: 2; margin-top: -18%;padding-bottom: 35px; }
  .cardTx{ display: flex;display: -webkit-flex;align-items: center;-webkit-align-items: center; justify-content: space-between;-webkit-justify-content: space-between;
  position: absolute; left:4%; right: 4%; top: 10px;}
.card-bd{ position: relative; background-color: #fff; border-radius: 10px; box-shadow: 0 0 8px rgba(0,0,0,0.2); padding: 12px;box-sizing: border-box;}  
 .cardTx-lt{ font-size: 17px;font-weight: bold;}
 .cardTx p{flex: 1; margin-left: 5px; font-size: 13px; color: #999;}
 .cardTx p span{ color: #ff2657;}
 .cardTx p em{ color: #ff2657;font-size: 14px;}
 .cardTx img{ width: 8px;}
 .cardTx2-tp{ position: relative; background-color: #eef5fb; padding: 2px 10px; border-radius: 26px;margin-top: 5px; color: #999; font-size: 12px;} 
 .cardTx2-tp span{ color: #006eff; padding-left: 5px;}
.cardTx2-tp a{ position: absolute; right: 0; top: 0;bottom: 0; display: inline-block;background:linear-gradient(to right,#2f8efe,#0471ff);
  padding: 0 20px;color: #fff;border-radius: 26px;display: flex;display: -webkit-flex;align-items: center;-webkit-align-items: center;}
 .cardTx2-bd{ display: flex;display: -webkit-flex;justify-content: space-around;-webkit-justify-content:space-around;padding-top: 16px;
 padding-bottom: 5px;}
.cellTx{ text-align: center;} 
.cellTx-tp{ color: #ff2657;}
.cellTx-tp em{ font-size: 22px; font-weight: bold;}
.cellTx-tp3{ color: #333;}
.cellTx-tp3 em{ font-size: 22px; font-weight: bold;}
.cellTx-tp2{  font-weight: bold;}
.cellTx-tp2 em{display: block;width: 42px;margin: 0 auto;white-space: nowrap; overflow: hidden; clip-path: polygon(10% 0,90% 0,90% 100%,10% 100%);}
.cellTx-tp2 span{ font-size: 22px;}
.cardTx2-bd2-tp em{display: block;font-weight: bold; width: 42px;margin: 0 auto;white-space: nowrap; overflow: hidden; clip-path: polygon(10% 0,90% 0,90% 100%,10% 100%);}
.cellTx-ct{ color: #999; font-size: 13px;}
.cellTx-ct span{ display: inline-block;background-color: #f0f0f0; border-radius: 3px;margin-left: 2px;line-height: 1;
 font-size: 10px; padding: 2px 3px;vertical-align: middle; margin-top: -2px;}
.cellTx-ft{ display: inline-block;margin-top: 6px; padding: 2px 10px 2px 12px; background-color: #eef5fb; border-radius: 26px; color: #006eff;
  font-size: 13px;}
.cellTx-ft img{ vertical-align: middle; margin-left: 2px;width:7px; margin-top: -2px;} 
.cardTx2-bd2-tp{text-align: center; padding-top: 22px;padding-bottom: 20px;font-size: 15px;}
.btnGroups{  text-align: center; margin-bottom: 4px;}
.btnGroups a{ display: inline-block;background-color: #eef5fb; padding: 8px 12px 8px 16px; border-radius: 26px;
 line-height: 1; color: #006eff; font-size: 13px; margin: 0 5px;}
.btnGroups a img{ width: 7px; vertical-align: middle; margin-left: 10px; margin-top: -1px;} 
@keyframes widthChangeDown{
	from{ transform: scale(0.9) translateY(-40px);  }
	to{ transform: scale(1) translateY(0px);   }
}

@-webkit-keyframes widthChange{
	from{transform: scale(0.9) translateY(-40px);  }
	to{transform: scale(1) translateY(0px);  }
}
@keyframes widthChangeUp{
	from{ transform: scale(0.9) translateY(0px);  }
	to{ transform: scale(1) translateY(35px);   }
}

@-webkit-keyframes widthChangeUp{
	from{transform: scale(0.9) translateY(0px);  }
	to{transform: scale(1) translateY(35px);  }
}

@-webkit-keyframes getLlite{
	from{transform: scale(1)   }
	to{transform: scale(0.9) ;  }
}
.flashtDown{animation: widthChange 0.3s 1 forwards;}
.flashtUp{animation: widthChangeUp 0.3s 1 forwards ;}
.cardInner{ top: initial;  bottom: 0; }
.cardInner .cardTx{ visibility: hidden;}
.cardInner .cardTx2{visibility: visible; }
.cardPre{width: 100%; top:-10px;position: absolute;transform: scale(0.9);   z-index: -1; animation:getLlite 0.2s 1 ;}
.cardPre .cardTx{ visibility: visible;}
.cardPre .cardTx2{visibility: hidden; }
.cardNext{width: 100%; bottom: -10px;position: absolute;transform: scale(0.9) ; z-index: -1;animation:getLlite 0.1s 1 ;}
.cardNext .cardTx{ top: initial; bottom: 7px; visibility: visible; }
.cardNext .cardTx2{visibility: hidden;}
.floor{ margin-top: 26px;}
.quickNav1{ margin-left: 3.25%; margin-right: 3.25%; width:93.5%;overflow: hidden; display: flex;display: -webkit-flex; justify-content: space-between;-webkit-justify-content: space-between; padding-bottom: 12px;}
.quickNav1 a{ /*width: 23.5%;*/padding-top: 14px; padding-bottom: 14px; text-align: center;background-color: #d9eff8; border-radius: 8px; color: #333; font-size: 14px;
 font-weight: bold;}
.quickNav1 a.bgcolor2{ background-color: #f3ecff;} 
.quickNav1 a.bgcolor3{ background-color: #fffae4;} 
.quickNav1 a.bgcolor4{ background-color: #ffeef0;} 
.quickNav1 a img{ display: block; width: 80%;max-width:112px ; margin: 0 auto;}
.quickNav2{ display: flex;display: -webkit-flex; justify-content: space-between;-webkit-justify-content: space-between;
  flex-wrap: wrap;-webkit-flex-wrap: wrap;}
.quickNav2 a{ width: 20%; text-align: center; margin-top: 12px; color: #333; font-size: 12px;}

.quickNav2 a p{ position: relative; width: 50%;margin: 0 auto;}
.quickNav2 a p img{ display: block; width: 100%; }
.tag{ position: absolute; right: -12px; top: -5px; display: inline-block;background-color: #ff2657; border-radius: 26px;
 color: #fff; font-size: 10px; color: #fff;line-height: 1.2;padding: 0 5px; white-space: nowrap;}
.tips_index{ margin-top: 22px; padding-top: 15px;/* border-top: 1px solid #e0e0e0;*/ padding-left: 3.25%; padding-right: 3.25%;
 display: flex;display: -webkit-flex; padding-bottom: 15px;align-items: center;-webkit-align-items: center;} 
.tips_index span{ border: 1px solid #ff2a5a; color: #ff2657;font-size: 12px; line-height: 1.5; border-radius: 26px;
  padding: 0 5px; margin-right: 5px;} 
.tips_index p a{ color: #ff2657;}
.footerTx{ background-color: #f5f5f5; padding-top: 11px; padding-bottom: 11px; font-size: 11px;text-align: center; line-height: 1.5;}
.floatLayer{ position: fixed; right: 15px; top: 58%; z-index: 3;}
.floatLayer a img{ width: 70px;}
/**/
@keyframes  addflash{
	from{transform: translateX(-100%);}
	to{ transform: translateX(0);}
}
@-webkit-keyframes name{
	from{ transform: translateX(-100%);}
	to{transform: translateX(0); }
}
@keyframes disappear{
	from{  background-color: rgba(0,0,0,0.3); }
	to{  background-color: rgba(0,0,0,0);}
}
@-webkit-keyframes disappear{
	from{ background-color: rgba(0,0,0,0.3); }
	to{  background-color: rgba(0,0,0,0); }
} 

.enterSlide .popboxCon{animation:addflash 0.5s 1 forwards; -webkit-animation:addflash 0.5s 1 forwards;}
.outSlide .popboxCon{ animation:addflash 0.5s  1 reverse forwards;  }
.disappear{animation:disappear 0.4s 0.3 1  forwards; }
.popbox{position: fixed; left: 0; right: 0; top: 0; height: 100%; background-color: rgba(0,0,0,0.5); z-index: 10; }

.popboxCon{position: absolute; top: 0;bottom: 0; left: 0;width: 65%; background-color: #fff;z-index: 11;
  box-sizing: border-box; padding:50px 12px 0; box-sizing: border-box; }
.userMsg{ display: flex;display: -webkit-flex;align-items: center;-webkit-align-items: center;}  
.userMsg-lt{ width: 20%;max-width: 50px; }
.userMsg-lt img{ display:block;width: 100%; border-radius: 50%;border: 1px solid #d3d3d3;}
.userMsg-rt{ flex: 1; margin-left:10px;}
.userMsg-rt-tp{display: flex;display: -webkit-flex;justify-content: space-between;-webkit-justify-content: space-between;align-items: center;-webkit-align-items: center;}
.userName{ font-size: 16px;font-weight: bold;}
.status-lt{ display: inline-block;font-size: 12px;}
.status-lt::before{ content: ""; display: inline-block;width: 8px;height: 8px;background-color: #42dc29;border-radius: 6px;
  vertical-align: middle; margin-right: 3px;margin-top: -2px;}
.gray::before{ content: ""; display: inline-block;background-color: #ff2657;}  
  .status-rt{ display: inline-block;vertical-align: middle;background-color: #ebebeb; color: #999;font-size: 12px;
   padding: 4px 6px; border-radius: 26px; line-height: 1;}
.userMsg-rt-ft{ font-size: 10px;margin-top: 2px;}   
.link1{margin-top: 20px;}
.link1 a{display: block;}
.link1 a img{ display: block; width: 100%; border-radius: 5px;}
.listNav{ margin-left: 10px; margin-right: 10px; padding-top: 10px;}
.listNav a{ width: 100%; display:flex;display: -webkit-flex;align-items: center;-webkit-align-items: center; margin-top: 23px; color: #333;
 font-size: 13px;line-height: 1;}
.listNav a img{ width:22px;}
.listNav a  p{flex: 1; position: relative; margin-left: 6px;}
.listNav a  p::after{ content: ""; display: inline-block;width: 8px;height: 12px;background: url(../images/icon-arrow1.png) no-repeat;
 background-size: 100% 100%; position: absolute; right: 0; top: 50%; margin-top: -5px;}
.btnExit{margin-left: 10px; margin-right: 10px;    padding-top: 17px; border-top: 1px solid #d9d9d9;margin-top:38%;} 
@media screen and (max-width:320px) {
	.btnExit{ margin-top: 15%;}
	.popboxCon{ padding-top: 40px;}
}
.btnExit a{width: 100%; display:flex;display: -webkit-flex;align-items: center;-webkit-align-items: center; color: #333;
 font-size: 13px;line-height: 1;}
.btnExit a img{ width:22px;}
.btnExit a  p{flex: 1; position: relative; margin-left: 6px;}
.btnExit a  p::after{ content: ""; display: inline-block;width: 8px;height: 12px;background: url(../images/icon-arrow1.png) no-repeat;
 background-size: 100% 100%; position: absolute; right: 0; top: 50%; margin-top: -5px;} 
 .potoAdv-ft-lt{width: 11%;max-width: 56px;}
  .potoAdv-ft-lt a{ display: block; height: 24px; background: linear-gradient(to right,#3291fe,#016eff); border-radius: 5px;
   color:#fff; text-align: center; line-height: 24px; font-size: 12px;}
   
.myscorecss{
	position: absolute;
    display: flex;
    display: -webkit-flex;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -webkit-align-items: center;
    font-size: 22px;
    color: #fea321;
}