/* 基础样式设置 */
/* 设置页面背景为白色，清除默认内外边距，统一字体 */
html, body {
	background-color: #ffffff; /* 页面背景色为白色 */
	margin: 0px; /* 清除默认外边距 */
	padding: 0px; /* 清除默认内边距 */
	font-family: BinancePlex,Arial,sans-serif!important; /* 优先使用BinancePlex字体，其次Arial，最后sans-serif */
	font-size: 14px; /* 基础字体大小14px */
}

/* 表单占位符样式 - 适配不同浏览器 */
::-webkit-input-placeholder { /* WebKit内核浏览器 (Chrome, Safari等) */
  color: #424852; /* 占位符文本颜色 */
  font-size: 14px; /* 占位符字体大小 */
}

::-moz-placeholder { /* Mozilla Firefox 19+ */
  color: #424852;
  font-size: 14px;
}

:-ms-input-placeholder { /* Internet Explorer 10+ */
  color: #424852;
  font-size: 14px;
}

/* 表单元素获得焦点时的样式 */
input:focus{background:#1b1e25;outline: 1px solid #1b1e25;} /* 输入框聚焦时背景和边框色 */
select:focus{background:#1b1e25;outline: 1px solid #1b1e25;} /* 下拉框聚焦样式 */
textarea:focus{background:#1b1e25;outline: 1px solid #1b1e25;} /* 文本域聚焦样式 */

/* 通用布局工具类 */
.fl{float:left;}/* 左浮动 */
.fr{float:right;}/* 右浮动 */
.bhalf{width:50%;}/* 宽度占50% */
.allhg{height:100%;}/* 高度继承父元素100% */
.txtl{text-align: left;} /* 文本左对齐 */
.txtr{text-align: right;} /* 文本右对齐 */

/* 文本颜色类 */
/*.fcy{color:#FCD535;} !* 黄色（已注释）*!*/
.fcy{color:#0052fe;} /* 蓝色（替代黄色） */
.fcch{color:#707A8A;} /* 灰色 */
.fcc{color:#000;} /* 黑色（注释描述为灰色，可能有误） */
.fch{color:#000;} /* 黑色 */
.fzm{font-size:12px;} /* 小字体12px */
.fzmm{font-size:14px;} /* 中等字体14px */
.fzmmm{font-size:14px;} /* 中等字体14px（重复定义） */
.fw{font-weight: bold;} /* 粗体 */

/* 更多颜色和字体大小定义 */
.fcfs{color: #73797f !important;} /* 特定灰色（重要级别） */
.fcgs{color: #2ebd85 !important;} /* 绿色（重要级别） */
.fccs{color: #73797f !important;} /* 特定灰色（重要级别） */
.fcc{color:#7b7b7b;} /* 灰色 */
.fch{color:#000 !important;} /* 黑色（重要级别） */
.fcf{color:#ffffff;} /* 白色 */
.fcy{color:#00b897;} /* 青绿色（覆盖之前的fcy定义） */
.fcb{color:#0052fe !important;} /* 蓝色（重要级别） */
.fred{color:#CF304A} /* 红色 */
.fgreen{color:#03A66D;} /* 绿色 */
.flogin{color:#6d7c82;} /* 登录相关文本灰色 */
.floginbr{color:#16b979;} /* 登录相关文本绿色 */
.fbaseblue {color: #0052fe;} /* 基础蓝色 */

/* 字体大小类 */
.f12{font-size:12px;}
.f14{font-size:14px !important;}
.f16{font-size:16px;}
.f18{font-size:18px;}
.f20{font-size:20px;}
.f22{font-size:22px;}
.f36{font-size:36px;}

/* 显示控制类 */
.hide {display: none !important;} /* 强制隐藏元素 */
.hideen {display: none;} /* 隐藏元素 */
.disblock {display: block;} /* 块级显示 */

/* 图标样式 */
.icon {
  width: 1em; /* 图标宽度为1em，自适应字体大小 */
  height: 1em; /* 图标高度为1em */
  vertical-align: -0.15em; /* 垂直对齐微调 */
  fill: #00b897; /* 图标填充色为青绿色 */
  overflow: hidden; /* 超出部分隐藏 */
}

/* 底部导航样式 */
.footer{
	width:100%; /* 宽度100% */
	height:65px; /* 高度65px */
	background:#ffffff; /* 白色背景 */
	position:fixed; /* 固定在底部 */
	bottom:0px; /* 距离底部0 */
	z-index:999; /* 层级较高，确保显示在上方 */
	padding-bottom: 10px; /* 底部内边距10px */
	border-radius: 20px 20px 0px 0px; /* 顶部圆角，底部直角 */
}
.footer_op{
	width:20%; /* 每个导航项占20%宽度（5个项刚好满宽） */
	height:55px; /* 高度55px */
	float:left; /* 左浮动排列 */
}
.f_op_t{
	width:100%; /* 导航项图标区域宽度100% */
	height:30px; /* 高度30px */
	text-align:center; /* 内容居中 */
}
.fticon{
	width:25px; /* 图标宽度25px */
	height: 25px; /* 图标高度25px */
	margin-top:5px; /* 顶部外边距5px */
}
.f_op_b{
	width:100%; /* 导航项文本区域宽度100% */
	height:20px; /* 高度20px */
	line-height:20px; /* 行高20px，垂直居中 */
	text-align: center; /* 文本居中 */
}
.nfticon{font-size: 24px;} /* 导航图标字体大小24px */

/* 按钮样式 */
.alltn{
	width:100%; /* 按钮宽度100% */
	height:40px; /* 高度40px */
	line-height:40px; /* 行高40px，文字垂直居中 */
	text-align:center; /* 文字居中 */
	border-radius:5px; /* 圆角5px */
	background:#FCD535; /* 黄色背景 */
}
.allbtn{
	width:100%; /* 按钮宽度100% */
	height:50px; /* 高度50px */
	line-height:50px; /* 行高50px */
	text-align:center; /* 文字居中 */
	background:#ccc; /* 灰色背景（被渐变覆盖） */
	border-radius:5px; /* 圆角5px */
	background: linear-gradient(to left,#eeb80d,#ffe35b); /* 从右到左的黄色渐变背景 */
	margin-top:20px; /* 顶部外边距20px */
}

/* 各种容器和区块样式 */
.shuffl-title {
    width: 100%;
    height: 290px;
    /* background: #282736; 已注释的背景色 */
}

.divfl {float: left;} /* 左浮动（重复定义，可能用于特定场景） */

.shuffl-title-rtop {
    height: 200px;
    background: #ffffff;
    border-radius: 20px; /* 20px圆角 */
}

.shuffl-title-rbottom {
    margin-top: 7px; /* 与上方元素间距7px */
    height: 80px;
    background: #ffffff;
    border-radius: 20px;
}

.shuffl-title-r {
    padding: 0px 0px 0px 7px ; /* 左内边距7px */
    border-radius:20px;
    height: 290px;
}

.zixunconten-box {
    border-radius: 20px;
    height: 90px;
}

.zixunconten-l {border-radius: 20px;}
.zixunconten-r {border-radius: 20px;}

.scroll-to-notice {
    width:100%;
    height:40px;
    margin-top:5px;
}

.market {
    width:98%; /* 宽度98% */
    background:#ffffff;
    margin-top:10px;
    border-radius: 20px;
    margin: 10px 1% 0px 1%; /* 上下外边距10px，左右1% */
}

.zixunlist {
    height: 150px;
    width: 100%;
    background: #ffffff;
    border-radius: 20px;
}

.index-div-base-margin {
    margin: 7px 1% 0px 1% !important; /* 重要级别的外边距 */
    width: 98% !important; /* 重要级别的宽度 */
}

.market-list {
    width:100%;
    height:50px;
    padding: 0px 7px; /* 左右内边距7px */
}

.market-list-info {
    color:#ffffff;
    border-radius: 5px;
    width:70px;
    height:35px;
    line-height:35px; /* 垂直居中 */
    text-align:center;
    display:inline-block; /* 行内块显示 */
    font-weight: bold;
}

.optionbox{
    width:100%;
    height:90px;
    background:#f7f7f7; /* 浅灰色背景 */
    border-radius:20px;
    padding: 5px 8px; /* 内边距 */
    margin-top: 10px;
}

/* 全局样式重置 */
* {
     box-sizing: border-box; /* 盒模型为border-box，确保padding和border不增加元素总宽高 */
     margin: 0;
     padding: 0;
 }

/* 导航相关样式（部分被注释） */
/* by default include the background of the option for the home navigation */
/*body {
    background: #5b37b7;
    color: #010101;
    min-height: 100vh;
    display: grid;
    place-items: center;
    font-family: "Open Sans", sans-serif;
    transition: background 0.2s ease-out;
}*/

/* display the anchor link side by side  */
/*nav {
    display: flex;
    background: #ffffff;
    padding: 1.5rem 1.5rem;
    border-radius: 20px;
    box-shadow: 0 1px 15px rgb(0 0 0 / 10%);
    position: fixed;
    bottom: 0;
}*/

/* remove default style and slightly separate the anchor links from one another */
/*nav a {
    color: inherit;
    text-decoration: none;
    margin: 0 1rem 0 1.5rem;
    display: flex;
    align-items: center;
    padding: 0.75rem 1.25rem;
    border-radius: 30px;
    position: relative;
    --hover-bg: #5b37b720;
    --hover-c: #5b37b7;
}*/

/* include considerable negative margin to have the svg icon overlapping with the span element */
/*nav a svg {
    margin-right: -2.5rem;
    width: 28px;
    height: 28px;
    pointer-events: none;
    transition: margin 0.2s ease-out;
}*/
/* by default hide the span element */
/*nav a span {
    opacity: 0;
    visibility: hidden;
    font-size: 0.9rem;
    margin: 0px 0.4rem 0px 0.4rem;
}*/
/* include with a pseudo element relative to the anchor link a circle, with a fixed with and height */
/*nav a:before {
    position: absolute;
    content: "";
    top: 50%;
    left: 0;
    width: 20%;
    height: 70px;
    border-radius: 50%;
    transform: translate(0%, -50%) scale(0);
    visibility: visible;
    opacity: 1;
}*/
/* when active */
/* specify the colors dictated by the custom properties */
/*nav a.active {
    background: var(--hover-bg);
    color: var(--hover-c) !important;
}*/
/* using the color specified by the then updated custom property show the circle of the pseudo element increasing its size and highlighting it momentarily */
/*nav a.active:before {
    background: var(--hover-c);
    opacity: 0;
    visibility: hidden;
    transform: translate(0%, -50%) scale(2);
    transition: all 0.4s ease-out;
}*/
/* remove the margin applied to the svg to make it overlay atop the anchor link */
/*nav a.active svg {
    margin-right: 0;
}*/
/* show the span element */
/*nav a.active span {
    visibility: visible;
    opacity: 1;
    transition: all 0.2s ease-out;
}*/

/* on smaller viewports show the navigation bar on the side, attached to the left of the screen */
/*nav a{color: #fff;}*/

/* 底部导航链接样式 */
.nav-footer-a {
    color: inherit !important;
    text-decoration: none;
    margin: 0 0.2rem;
    align-items: center;
    padding: 0.75rem 0.90rem;
    border-radius: 30px;
    position: relative;
    --hover-bg: #5b37b720;
    --hover-c: #5b37b7;
}

.nav-box {
    width: 100%;
    height: 100%;
}

/* 文本对齐类 */
.tcc{text-align:center;} /* 文本居中 */
.tcr{text-align:right;} /* 文本右对齐 */

/* 栅格列样式 */
.div-col-5 {
    -ms-flex: 0 0 20%; /* IE兼容的flex设置 */
    flex: 0 0 20%; /* 占20%宽度，不伸缩 */
    max-width: 20%;
}

/* 头部样式 */
.no_header {
    z-index: 9999; /* 最高层级 */
    padding:0px 10px;
    background-color:rgba(0,0,0,0); /* 完全透明背景 */
}

.nav-img {
    width: 25px;
    margin-right: 30%; /* 右外边距30% */
}

.optext:visited {
    visibility: visible; /* 访问过的链接保持可见 */
}

.icon_spot {width: 50px;}

/* 特定区块样式 */
.shuffl-title-rbottom-p {margin-bottom: 0px!important;} /* 强制底部外边距0 */
.shuffl-title-rbottom-l {padding-top: 18px;} /* 顶部内边距18px */
.shuffl-title-rbottom-r {padding: 0px;padding-top: 10px;} /* 顶部内边距10px */

.icon-top {width: 100%;}

.fbg::placeholder {color: #3db485 !important;} /* 特定输入框占位符颜色 */

/* 更多颜色定义 */
.fe6 { color: #555050}
.fe6im { color: #5f5f5f !important;}
.fa8a { color: #707A8A}
.bgf5465c {background: #f5465c;} /* 红色背景 */
.bgf5465cim {background: #f5465c !important;} /* 红色背景（重要级别） */
.f121420im {color: #121420 !important;} /* 深灰色（重要级别） */

/* 计时器相关样式 */
.timer_t_box {
    width:100%;
    min-height:80px;
    margin: 20px 0;
    border-radius: 10px;
    border: 1px solid #1eb585; /* 绿色边框 */
}

.timer_t_box_list {
    width: 90%;
    margin:10px auto; /* 水平居中 */
    height: 30px;
    line-height: 30px;
}

.timer_t_box_msg {padding: 0 20px;}

.wait_box_info {
    width: 100%;
    height: 140px;
    line-height: 140px; /* 垂直居中 */
    text-align: center;
    margin: 0 auto;
    margin-top: 20px;
    border-radius: 10px;
    border: 1px solid #1eb585;
}

/* 更多颜色类 */
.fc51 {color: #768da9;}
.fc1e {color: #1eb585;} /* 绿色 */
.fce5 {color: #A9AEB8;}
.fc6b7785 {color: #6b7785;}

/* 文本缩进和内边距 */
.ti12 {text-indent:12px;} /* 文本缩进12px */
.pl20{padding-left:20px!important;} /* 左内边距20px（重要级别） */
.pt20{padding-top:20px!important;} /* 上内边距20px（重要级别） */

/* 顶部标题样式 */
.top-title-b {
    width: 90%;
    height: 85px;
    background-color: #E1F5Ed; /* 浅绿色背景 */
    margin: 0px 5%; /* 左右5%外边距，水平居中 */
    position: absolute;
    bottom: 20px; /* 距离底部20px */
    border-radius: 5px 5px 0 0; /* 顶部圆角 */
    padding: 10px 10px 10px 20px;
}

.top-title-a {
    width: 100%;
    height: 60%;
}

.top-title-a-nfo {
    height: 50px;
    width: 100%;
    padding:50px 0 0 20px; /* 上内边距50px，左20px */
}

.f30 {font-size: 30px;}
.wt80b {width: 80%;}

.top-title-msg {
    width: 120px;
    background-image: url(/Public/Mobile/images/bg-title.png); /* 背景图 */
    background-repeat: no-repeat;
    background-size: 120px 100%; /* 背景图大小 */
    padding-left: 5px;
}

.ieo-buy-go {
    background-image: url(/Public/Mobile/images/jiantou.png); /* 箭头背景图 */
    background-repeat: no-repeat;
    background-size: 40px auto;
    height: 60px;
    float: right;
    width: 55px;
    position: absolute;
    right: 0;
    top: 42px;
}

/* 最后和外边距类 */
.f444545 {color: #444545;}
.ml10 {margin-left: 10px;} /* 左外边距10px */
.ml20 {margin-left: 20px;} /* 左外边距20px */
.rzred {color: #f5465c;} /* 认证相关红色 */
.rzgreen {color: #2ebc84;} /* 认证相关绿色 */