@charset "utf-8";
/***************************** public *****************************/
* { margin: 0; padding: 0; border: 0; vertical-align: baseline; }
html, body { font-family: Inter, pingfang, PingFangSC-Regular, Helvetica, STHeiti STXihei, Microsoft YaHei, Microsoft JhengHei, Arial; }
body { background-color: #fff; color: #313131; font-size: 3vw; overflow: auto; }
img, canvas { vertical-align: middle; }
select { appearance: none; -moz-appearance: none; -webkit-appearance: none; width: 100%; background: transparent; }
input { width: 100%; background: transparent; }
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; }
select:focus, input:focus { outline: none; }
input, button, textarea, select, optgroup, option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit }

a { color: #666971; }
a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover { text-decoration: none; }
a:active { text-decoration: none; }
body {
    -webkit-text-size-adjust: 100% !important ; /* 禁用 iOS 浏览器字体缩放 */
    -ms-text-size-adjust: 100% !important; /* 禁用 IE 浏览器字体缩放 */
    text-size-adjust: 100% !important; /* 通用属性 */
}
/* 字体颜色 */
.white { color: #fff !important; }
.red { color: #D94E4E !important; }
.green { color: #008000 !important; }
.yellow { color: #EDBF00 !important; }
.grey { color: #777777 !important; }
.blue { color: #007fe4; }

/***** 按钮 *****/
.but01 { line-height: 1rem; text-align: center; border-radius: 0.4rem; color: #fff; width: 90%; margin: auto; box-shadow: 0px 10px 0px #E1E1E1; }
.prohibit { background: #d5d5d5 !important; color: #fff !important; }

/***** 弹框遮罩层 *****/
.mask { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.65); border: 0; z-index: 100; }

/***** ajax load *****/
.load { z-index: 102; }
.load img { position: fixed; height: 1rem; width: 1rem; top: 50%; left: 50%; margin-top: -0.5rem; margin-left: -0.5rem; animation: loading 2s infinite; }

.loading { text-align: center; margin-top: 3rem; line-height: 1rem; }
.loading img { width: 0.4rem; }

@keyframes loading {
    50% { transform: rotate(360deg); }
}

/****** 提示Toast  ******/
.toast { position: fixed; bottom: 50%; width: 100%; text-align: center; z-index: 110; }
.toast .mesg { color: #fff; padding: 2vw 4vw; word-break: break-all; background-color: rgba(0, 0, 0, 0.7); border-radius: 2vw; display: inline-block; }

/*** 上传图片弹框 *****/
.up-image .foot { position: fixed; box-sizing: border-box; left: 0; bottom: 0.267rem; z-index: 103; padding: 0.267rem; text-align: center; width: 100%; font-size: 0.48rem; color: #007AFF; }
.up-image .beat { line-height: 1.334rem; background: #fff; border-radius: 0.134rem 0.134rem 0 0; cursor: pointer; }
.up-image .album { line-height: 1.334rem; background: #fff; border-top: solid 1px #eee; border-radius: 0 0 0.134rem 0.134rem; cursor: pointer; }

/**** 图片预览 ****/
.preview { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: rgba(0,0,0,.60); text-align: center; z-index: 99; }
.preview:after { display: inline-block; content: ''; width: 0; height: 100%; vertical-align: middle; }
.preview .box { display: inline-block; text-align: left; vertical-align: middle; position: relative; }
.preview img { max-width: 90vw; max-height: 90vh; }

/***** 弹框公共样式 *****/
.alert { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: rgba(0,0,0,.65); text-align: center; color: #000; z-index: 105; }
.alert:after { display: inline-block; content: ''; width: 0; height: 100%; vertical-align: middle; }
.alert .box { display: inline-block; text-align: left; vertical-align: middle; position: relative; width: 70vw; background-color: #fff; padding: 4vw 2vw; border-radius: 5px; }
.alert .head { display: flex; align-items: center; line-height: 6vw; }
.alert .head i { color: #f8951c; }
.alert .head .title { font-weight: 700; padding-left: 1vw;  font-size:4vw}
.alert .cont { padding: 2vw; text-align: left; padding-left:4vw;}
.alert .foot { display: flex; justify-content: space-evenly; }
.alert .foot div { width: 25vw; line-height: 8vw; font-size: 4vw; color: #fff; padding: 0 2vw; text-align: center; border-radius: 1vw; cursor: pointer; }
    .alert .foot .close {
        background-color: #F1F1F1;
        color: #000;
    }
.alert .foot .define { background-color: #0C967F; }

/**** 底部导航 ****/
footer { height: 35vw; }
.foot_nav { position: fixed; display: flex; justify-content: space-between; bottom: 0; left: 0; width: 100%; background: #fff; border-top: 1px solid rgba(0,0,0,.2); padding-bottom: 4vw; z-index: 99; }
.foot_nav a { text-align: center; font-size: 3vw; display: block; width: 100%; padding: 2vw 0; }
.foot_nav a p { width: 5.4vw; height: 5.4vw; margin: auto; background-repeat: no-repeat; background-size: 100% 100%; }
.foot_nav a p.home { background-image: url('/Content/img/foot_home.png'); }
.foot_nav a p.cart { background-image: url('/Content/img/foot_cart.png'); }
.foot_nav a p.my { background-image: url('/Content/img/foot_my.png'); }
.foot_nav a.active { color: #000; font-weight: 800; }
.foot_nav a.active p.home { background-image: url('/Content/img/foot_home_act.png'); }
.foot_nav a.active p.cart { background-image: url('/Content/img/foot_cart_act.png'); }
.foot_nav a.active p.my { background-image: url('/Content/img/foot_my_act.png'); }

/***** 顶部 *****/
.app { }
.app .head { width: 100%; }
.app .head .top { display: flex; justify-content: space-between; height: 12vw; line-height: 12vw; }
.app .head .top a { display: flex; align-items: center; justify-content: center; color: #000; width: 10vw; }
.app .head .top a i { font-size: 6vw; }
.app .head .top span { font-size: 4.5vw; font-weight: 800; }
.app .loading { margin-top: 1rem; }
.app .content { height: 100%; overflow-y: auto; }
.app .footer { min-height: 20vw; }

/***** 登录 注册 顶部 *****/
.header { display: flex; justify-content: flex-start; left: 0; top: 0; width: 100%; line-height: 1rem; color: #5F8802; z-index: 100; }
.header a { padding: 0 0.267rem; color: #5F8802; }
.header h1 { width: 100%; text-align: center; font-size: 0.42rem; }

/***** 顶部 *****/
header { position: fixed; top: 0; left: 0; width: 100%; display: flex; justify-content: space-between; background-image: linear-gradient(#678F02, #A7C802); color: #fff; line-height: 1.3rem; z-index: 100; }
header a { padding: 0 0.3rem; color: #fff; width: 2rem; }
header a:last-child { text-align: right; }
header a i { font-size: 0.5rem !important; }
header span { font-size: 0.4rem; }

/**** 投注 ****/
.betting { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: rgba(0,0,0,.65); z-index: 104; }
.betting .cont { position: absolute; left: 0; bottom: 0; width: 100%; background-color: #fff; }
.betting .balance { line-height: 0.6rem; text-indent: 0.4rem; background: #262626; color: #fff; }
.betting .list { }
.betting .item { padding: 0.2rem; line-height: 0.6rem; }
.betting .titl { display: flex; justify-content: space-between; font-size: 0.46rem; }
.betting .money { display: flex; justify-content: space-between; }
.betting .money div { display: grid; align-content: end; text-align: right; }
.betting .money input { line-height: 1rem; border: 1px solid #d0d0d0; line-height: 1rem; text-indent: 0.2rem; font-size: 0.4rem; width: 50%; }
.betting .mesg { color: #D94E4E; line-height: 0.8rem; text-align: center; }
.betting .buts { display: grid; grid-template-columns: 1fr 1fr; }
.betting .but { width: 100%; text-align: center; cursor: pointer; display: grid; height: 1.2rem; align-content: center; }
.betting .bg0 { background: #dedede; }
.betting .bg1 { background: #C2C2C2; }
.betting .bg2 { background: #359A7C; color: #fff; }

.copyright { width: 100%; text-align:center; margin-top: 3vw; box-sizing: border-box; clear: both; font-size: 3vw; line-height: 4vw; color: #aaa; }
.copyright a { color: #aaa; text-decoration: underline; }