/* 样式初始化 */
* { -webkit-tap-highlight-color: transparent; }
html{ font-size: 100px; }
navigator, scroll-view, body, div,view, p, input, button, h1, h2, ul, li,textarea { font-family: "microsoft yahei"; margin: 0; padding: 0; box-sizing: border-box; -webkit-box-sizing: border-box; }
input, button, select { outline: none; border: none; -webkit-appearance: none; }
input::-webkit-input-placeholder { color: #B2B2B2; }
input::-moz-placeholder { color: #B2B2B2; }
input:-moz-placeholder { color: #B2B2B2; }
input:-ms-input-placeholder { color: #B2B2B2; }
img,image{ border: 0;margin: 0;padding: 0;transition: all 1s;	  }
image,video{ display: block; }
ul, li { list-style: none; }
a { text-decoration: none; color: #888; }
a:link, a:visited, a:hover, a:active { text-decoration: none; }
body { font-family: Helvetica; }

.box{ box-sizing: border-box; -webkit-box-sizing: border-box; }

.tc{ text-align: center; }
.tl{ text-align: left; }
.tr{ text-align: right; }

.fc{ margin-left: auto; margin-right: auto; }
.fl{ display: block; float: left; }
.fr{ display: block; float: right; }
.inline{ display: inline-block; }
.none{ display: none;}
.dis{ display: block; }

.abs{ position: absolute; }
.rel{ position: relative; }
.wrapper{ width: 100%; }
.half{ width: 50%; }


.nowrap { display: -webkit-box; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; white-space: normal; -webkit-box-orient: vertical;-webkit-line-clamp: 1; }
.nowrap-2 { -webkit-line-clamp: 2; }
.nowrap-3 { -webkit-line-clamp: 3; }
.nowrap-5 { -webkit-line-clamp: 5; }

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

.flex{ width: 100%; display: flex;flex-direction: row;   }
.flex-start{ display: flex;flex-direction: row; justify-content:flex-start; }
.flex-center{ display: flex;flex-direction: row; align-items: center; }
.flex-between{ display: flex;flex-direction: row; justify-content:space-between; }
.flex-top{ display: flex;flex-direction: row; align-items: flex-start; }
.flex-end{ display: flex;flex-direction: row; justify-content: flex-end; }

.p40{ padding: 40px; }
.p30{ padding: 30px; }
.p20{ padding: 20px; }
.p10{ padding: 10px; }

.pt60{ padding-top: 60px; }
.pt50{ padding-top: 50px; }
.pt40{ padding-top: 40px; }
.pt30{ padding-top: 30px; }
.pt20{ padding-top: 20px; }
.pt10{ padding-top: 10px; }

.pb60{ padding-bottom: 60px; }
.pb50{ padding-bottom: 50px; }
.pb40{ padding-bottom: 40px; }
.pb30{ padding-bottom: 30px; }
.pb20{ padding-bottom: 20px; }
.pb10{ padding-bottom: 10px; }

.pl60{ padding-left: 60px; }
.pl50{ padding-left: 50px; }
.pl40{ padding-left: 40px; }
.pl30{ padding-left: 30px; }
.pl20{ padding-left: 20px; }
.pl10{ padding-left: 10px; }

.pr60{ padding-right: 60px; }
.pr50{ padding-right: 50px; }
.pr40{ padding-right: 40px; }
.pr30{ padding-right: 30px; }
.pr20{ padding-right: 20px; }
.pr10{ padding-right: 10px; }

.m40{ margin: 40px; }
.m30{ margin: 30px; }
.m20{ margin: 20px; }
.m24{ margin: 24px; }
.m10{ margin: 10px; }

.ml60{ margin-left: 60px;}
.ml50{ margin-left: 50px;}
.ml40{ margin-left: 40px;}
.ml30{ margin-left: 30px;} 
.ml20{ margin-left: 20px;}
.ml10{ margin-left: 10px;}

.mr60{ margin-right: 60px; }
.mr50{ margin-right: 50px; }
.mr40{ margin-right: 40px; }
.mr30{ margin-right: 30px; }
.mr20{ margin-right: 20px; }
.mr10{ margin-right: 10px; }

.mt60{ margin-top: 60px;}
.mt50{ margin-top: 50px;}
.mt40{ margin-top: 40px;}
.mt30{ margin-top: 30px;}
.mt20{ margin-top: 20px;}
.mt10{ margin-top: 10px;}

.mb60{ margin-bottom: 60px;}
.mb50{ margin-bottom: 50px;}
.mb40{ margin-bottom: 40px;}
.mb30{ margin-bottom: 30px;} 
.mb20{ margin-bottom: 20px;}
.mb10{ margin-bottom: 10px;}

.radius10{ border-radius: 10px; }
.radius16{ border-radius: 16px; }
.radius20{ border-radius: 20px; }
.radius30{ border-radius: 30px; }
.radius40{ border-radius: 40px; }
.radius50{ border-radius: 50px; }
.radius50_{ border-radius: 50%; }

.f40r{ font-size: 40px;font-family: PingFangSC-Regular, PingFang SC; }
.f40m{ font-size: 40px;font-family: PingFangSC-Semibold, PingFang SC; }

.f36r{ font-size: 36px;font-family: PingFangSC-Regular, PingFang SC; }
.f36m{ font-size: 36px;font-family: PingFangSC-Semibold, PingFang SC; }

.f34r{ font-size: 34px;font-family: PingFangSC-Regular, PingFang SC; }
.f34m{ font-size: 34px;font-family: PingFangSC-Semibold, PingFang SC; }

.f32r{ font-size: 32px;font-family: PingFangSC-Regular, PingFang SC; }
.f32m{ font-size: 32px;font-family: PingFangSC-Semibold, PingFang SC; }

.f28r{ font-size: 28px;font-family: PingFangSC-Regular, PingFang SC; }
.f28m{ font-size: 28px;font-family: PingFangSC-Semibold, PingFang SC; }

.f26r{ font-size: 26px;font-family: PingFangSC-Regular, PingFang SC; }
.f26m{ font-size: 26px;font-family: PingFangSC-Semibold, PingFang SC; }

.f24r{ font-size: 24px;font-family: PingFangSC-Regular, PingFang SC; }
.f24m{ font-size: 24px;font-family: PingFangSC-Semibold, PingFang SC; }

.f22r{ font-size: 22px;font-family: PingFangSC-Regular, PingFang SC; }
.f22m{ font-size: 22px;font-family: PingFangSC-Semibold, PingFang SC; }

.f20r{ font-size: 20px;font-family: PingFangSC-Regular, PingFang SC; }
.f20m{ font-size: 20px;font-family: PingFangSC-Semibold, PingFang SC; }

.bold{ font-weight: bold; }

.lh15{ line-height: 150%; }

.black_bg{ background-color: #000000; }
.white_bg{ background-color: #FFFFFF; }
.blue_bg{ background-color: #40A7EF; }
.red_bg{ background-color: #FF0000; }
.brown_bg{ background-color: #BD9D6D; }
.f5bg{ background: #F5F5F5; }
.f4bg{ background: #F4F4F4; }
.f3bg{ background: #F3F3F3; }
.eebg{ background-color: #EEEEEE; }
.e5bg{ background: #E5E5E5; }

.white{ color: #FFFFFF; }
.blue{ color: #40A7EF; }
.brown{ color: #BD9D6D; }

.c707070{ color: #707070; }