@charset "utf-8";
body{
	display: block;
    position: relative;
    margin: auto;
    max-width: 10rem;
    min-width: 4.26666667rem;
    font-size: 0.36rem;
    font-family: "Microsoft Yahei", "Arial", sans-serif;
	}
body, div, p, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, input, select, button, textarea, table, th, td, a, span, canvas {
    margin: 0;
    padding: 0;
    background: no-repeat center / contain;
    cursor: default;
}

html, body { height: 100vh; overflow: hidden; }   /* 页面高度=窗口、禁止溢出 → 取消页面滚动条 */

#codex {
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 100vh;                           /* 主容器限高视口，与窗口同高，不随内容撑高 */
	display: flex; 
	flex-direction: column;

}
#codex .header {
  margin: 0.1rem auto;
  width: 8.85333333rem;
  height: 0.82666667rem;
  /* background-color: #fd4c4c; */
  border-radius: 31px;
}
#codex .header .title {
  margin: 0.05rem auto;
  padding: 0 0.66666667rem;
  width: 85%;
  height: 0.82666667rem;
  background-color: #dc4c4c;
  line-height: 0.82666667rem;
  font-size: 0.41rem;
  color: #fff;
  border-radius: 0.41rem;
}
#codex .header .title div {
  float: right;
  width: 85%;
}
#codex .header .title a:visited{
	color: #f1e9d9;
}
#codex .header p {
  float: left;
  margin-right: 0.66666667rem;
}
#codex .header i {
  font-size: 0.29333333rem;
}
.iconfont {
    font-family: "iconfont" !important;
    font-size: 0.36rem;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
}
/*主体*/
.main {
  padding: 0.1rem 0.2rem;
  width: 92%;
  height: auto;
}
.main li {
  padding: 0.53333333rem 0;
  width: 100%;
  height: 1.86666667rem;
  border-top: 1px solid #ddd;
}
.main li a {
  display: block;
  width: 100%;
  height: 100%;
}
.main li a img {
  width: 35%;
  height: inherit;
}
.main li div {
  position: relative;
  float: right;
  margin-top: 0.32rem;
  width: 60%;
  height: 1.6rem;
}
.main li div p:nth-child(1) {
  overflow: hidden;
  margin-bottom: 0.05rem;
  width: 4.66666667rem;
  font-size: 0.37333333rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #333;
}
.main li div p:nth-child(2) {
  font-size: 0.32rem;
  color: #999;
}
.main li div i {
  position: absolute;
  right: 0;
  top: 0.4rem;
  font-size: 0.45333333rem;
  color: #999;
}

#record-list {
	flex: 1 1 auto;      /* 自动占满顶部区块之后的剩余高度 → 一直延伸到窗口底部 */
	min-height: 0;       /* 允许高度受限时收缩，配合 overflow 内部滚动 */
	overflow-y: auto;    /* 记录多时自动竖向滚动 */
	overflow-x: hidden;  /* 横向不出滚动条 */
}
#record-list ul li {
  padding: 0.05rem 0;
  width: 100%;
  height:1.8rem;
  border-top: 1px solid #ddd;
  font-size:0.38rem;
  overflow:hidden;
}
#record-list .record-li-div{
  float:left;
  margin-top:0.05rem;
}
#record-list .record-img{
  width:1.8rem;
}
#record-list .record-img img{
  width:1.6rem;
  height:1.6rem;
}
#record-list .record-cont{
  width:4.4rem;
  padding-left:0.3rem;
  padding-top:0.2rem;
  overflow:hidden;
}
#record-list .record-cont .record-p{
  color:#686565;
}
#record-list .record-cont .record-time{
  color:#C7C7C7;
}
#record-list .record-state{
  width:1.6rem;
}
#record-list .record-state img{
  width:1.6rem;
}
#record-list .record-state p{
  margin-top:0.3rem;
  padding-top:0.18rem;
  width:1.6rem;
  height:0.8rem;
  color:#ffffff;
  background-color:#ee635f;
  border:1px solid;
  border-radius: 0.2rem;
  text-align:center;
}
#mask-rule, #mask {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.85);
}
#mask-rule .box-rule {
    display: flex;
    flex-direction: column;
    position: relative;
    margin: 12% auto;
    padding-top: 0.53333333rem;
    width: 90%;
    height: 78%;
	max-height:80%;
    border-radius: 0.26666667rem;
	background-color:#f9f6f5;
}
#mask-rule .rule-div {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}
#mask-rule .box-rule .star {
    position: absolute;
    left: 50%;
    top: -1.33333333rem;
    margin-left: -1.73333333rem;
    width: 3.45333333rem;
    height: 1.16rem;
}
#mask-rule .con {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    height: calc(100% - 1.3rem);
    position: relative;
    margin: 0.53333333rem auto;
    padding-right: 0.2rem;
    width: 7.73333333rem;
    line-height: 0.64rem;
    font-size: 0.34666667rem;
    color: #fff;
}
ul, ol {
    list-style: none;
}
.rule-div li {
    text-align: center;
    font-size: 0.3rem;
    line-height: 0.5rem;
}
#mask-rule .box-rule h2 {
    width: 100%;
    text-align: center;
    line-height: 0.54rem;
    font-size: 0.54rem;
    font-weight: bold;
    color: #d80903;
}
#mask-rule #close-rule {
    position: absolute;
    right: 0.45333333rem;
    top: 0.50666667rem;
    width: 0.53333333rem;
    height: 0.53333333rem;
    background-image: url(../../../static/image/icon-close-2.png);
}
.myinput {
    width: 100%;
    height: 1.0rem;
	color: #be6365;
	border: 1px #adabab solid;
	background-color: #FCFCFC;
	border-radius: 40px;
	padding:10px;
}

.myinput-b2 {
    border: 1px #adabab solid;
	background-color: #FCFCFC;
	border-radius: 10px;
    width: 100%;
	height: 0.8rem;
	color: #be6365;
	border: 2px solid;
	padding:5px;
}

.rule-div input {
    width: 100%;
    height: 1.0rem;
	box-sizing: border-box;
    padding: 10px;
    border-radius: 40px;
    margin: 5px auto;
    font-size: 0.36rem;
    
}
.rule-info-text{
	padding-top:10px;
}
.rule-showmsg{
	color:#000000;
}
.rule-showmsgprize{
	max-height:1.2rem;
	overflow:hidden;
	font-size:0.36rem;
	color:#dc0f0f;
	text-align:center;
}
.rule-showmsgtips{
	color:#8a514f;
	max-height:2.4rem;
	overflow:hidden;
	margin-top:10px;
}
.rule-showmsgimg-in{
	width:280px;
	height:280px;
	padding:15px 0 0 15px;
	overflow:hidden;
}
.my-input{
	color: #be6365;
	border: 1px #adabab solid;
	background-color: #FCFCFC;
 }
.my-infobtn{
	color: #fff;
    border: 1px solid #ee635f;
    background-color: #ee635f;
}

.mytextarea {
    width: 100%;
    height: 1.4rem;
	border: 2px solid;
}
#loginshowmsg{
	overflow:hidden;
	max-height:1rem;
}
.shownone{
	display:none;
}
.showblock{
	display:block;
}
.ovflhidden{
	overflow:hidden;
}
.fr{
	color:red;
}
.fr2{
	color:#ba1212
}
.fb{
	color:blue;
}
/* 兼容桌面(web)浏览器：重置 body 水平外边距，使手机宽度页面在宽屏下水平居中 */
body { margin: 0 auto; }

/* ===== 桌面(web)端适配(宽度>420px 时生效，移动端不受影响) =====
   1) 弹窗宽度对齐内容列，消除弹窗内部两侧大片空白
   2) 弹窗在视口中垂直居中，不再整体靠下
   3) 弹窗按内容自适应高度，表单完整时直接显示提交按钮；超高时才内部滚动 */
@media (min-width: 421px) {

	/* 【本次改动】web 版返回按钮定位到导航栏(含"退出"按钮)正下方一点点：用 fixed 按视口计算
     (导航栏固定宽 8.85rem、页面主体 max-width 10rem 水平居中，故导航栏右端 = 视口一半 + 4.425rem)；
     手机版(<421px)不生效，返回按钮保持原样 fixed 右上角贴右缘不变 */
	#my-btn { position: fixed !important;                            /* 与手机版同为 fixed，仅覆盖坐标 */
				top: calc(0.2rem + 0.82666667rem + 0.1rem) !important; /* 导航栏(距顶0.2rem、高0.8267rem)底部再往下 0.1rem = 位于"退出"按钮下方一点点 */
				right: calc(50vw - 4.425rem) !important;               /* 右缘对齐导航栏右端，与"退出"按钮同侧 */
				left: auto !important; 
		}
	#mask-rule .box-rule {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 9rem;
		margin: 0;
		height: auto;
		max-height: 92%;
	}
	#mask-rule .con {
		height: auto;
		max-height: 84vh;
		overflow-y: auto;
	  }
}