/* iconfont */ //@import "/utils/iconfont.scss"; .container, input { font-family: PingFang-Medium, PingFangSC-Regular, Heiti, Heiti SC, DroidSans, DroidSansFallback, "Microsoft YaHei", sans-serif; -webkit-font-smoothing: antialiased; } .b-f { background: #fff; } .tf-180 { -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -o-transform: rotate(-180deg); transform: rotate(-180deg); } .tf-90 { -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } .dis-block { display: block; } .dis-flex { display: flex !important; /* flex-wrap: wrap; */ } .flex-wrap { flex-wrap: wrap; } .flex-box { flex: 1; } .flex-dir-row { display: flex !important; flex-direction: row; } .flex-dir-column { display: flex !important; flex-direction: column; } .flex-x-center { /* display: flex; */ justify-content: center; } .flex-x-between { justify-content: space-between; } .flex-x-around { justify-content: space-around; } .flex-x-end { justify-content: flex-end; } .flex-y-center { align-items: center; } .flex-y-end { align-items: flex-end; } .flex-x-y-center { justify-content: center; align-items: center; } .flex-two { box-sizing: border-box; flex: 0 0 50%; } .flex-three { float: left; width: 33.3%; } .flex-four { box-sizing: border-box; flex: 0 0 25%; } .flex-five { box-sizing: border-box; flex: 0 0 20%; } .flex-six { float: left; width: 66.6%; } .flex-seven { box-sizing: border-box; flex: 0 0 75%; } .t-l { text-align: left; } .t-c { text-align: center; } .t-r { text-align: right; } .p-a { position: absolute; } .p-r { position: relative; } .fl { float: left; } .fr { float: right; } .clearfix::after { clear: both; content: " "; display: table; } .oh { overflow: hidden; } .tb-lr-center { display: -webkit-box; display: -ms-flexbox; display: flex !important; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .f-100 { font-size: 100rpx; } .f-40 { font-size: 40rpx; } .f-38 { font-size: 38rpx; } .f-36 { font-size: 36rpx; } .f-34 { font-size: 34rpx; } .f-32 { font-size: 32rpx; } .f-31 { font-size: 31rpx; } .f-30 { font-size: 30rpx; } .f-29 { font-size: 29rpx; } .f-28 { font-size: 28rpx; } .lh-28 { line-height: 28rpx; } .f-26 { font-size: 26rpx; } .f-25 { font-size: 25rpx; } .f-24 { font-size: 24rpx; } .f-22 { font-size: 22rpx; } .f-20 { font-size: 20rpx; } .f-18 { font-size: 18rpx; } .f-16 { font-size: 16rpx; } .f-w { font-weight: 700; } .f-n { font-weight: 400; } .col-f { color: #fff; } .col-3 { color: #333; } .col-6 { color: #666; } .col-7 { color: #777; } .col-8 { color: #888; } .col-9 { color: #999; } .col-m { color: #fa2209 !important; } .col-s { color: #be0117 !important; } .col-white { color: white !important; } .col-green { color: #0ed339 !important; } .col-primary { color: #2979ff; } .col-primary-d { color: #2b85e4; } .col-error { color: #fa3534; } .col-error-d { color: #dd6161; } .col-warning { color: #ff9900; } .col-warning-d { color: #f29100; } .col-success { color: #19be6b; } .col-success-d { color: #18b566; } .col-info-d { color: #82848a; } .col-info-m { color: #c8c9cc; } .col-info-l { color: #f4f4f5; } .col-info { color: #909399; } .c-g-white { background-color: white; } .c-g-black { background-color: #151515; } .c-g-container { background-color: #f7f7f7; } .c-g-info { background-color: #909399; } .c-g-info-d { background-color: #767a82; } .c-g-info-m { background-color: #c8c9cc; } .c-g-info-l { background-color: #f4f4f5; } .c-g-primary-m { background-color: #a0cfff; } .c-g-primary-l { background-color: #ecf5ff; } .c-g-primary-g { background-image: linear-gradient(#a0cfff, #ecf5ff); } .c-g-warning-m { background-color: #fcbd71; } .c-g-warning-l { background-color: #fdf6ec; } .c-g-warning-g { background-image: linear-gradient(#fcbd71, #fdf6ec); } .c-g-success-m { background-color: #71d5a1; } .c-g-success-l { background-color: #dbf1e1; } .c-g-success-g { background-image: linear-gradient(#71d5a1, #dbf1e1); } .cont-box { padding: 20rpx; } .cont-bot { margin-bottom: 120rpx; } .padding-box { padding: 0 24rpx; box-sizing: border-box; } .p-10 { padding: 10rpx; } .p-15 { padding: 15rpx; } .p-20 { padding: 20rpx; } .p-30 { padding: 30rpx; } .p-40 { padding: 40rpx; } .p-50 { padding: 50rpx; } .p-60 { padding: 60rpx; } .p-70 { padding: 70rpx; } .p-t-20 { padding-top: 20rpx; } .p-t-30 { padding-top: 30rpx; } .p-t-40 { padding-top: 40rpx; } .p-b-t-10 { padding-top: 10rpx; padding-bottom: 10rpx; } .p-b-t-20 { padding-top: 20rpx; padding-bottom: 20rpx; } .p-b-t-30 { padding-top: 30rpx; padding-bottom: 30rpx; } .p-b-t-40 { padding-top: 40rpx; padding-bottom: 40rpx; } .p-b-t-50 { padding-top: 50rpx; padding-bottom: 50rpx; } .p-b-t-60 { padding-top: 60rpx; padding-bottom: 60rpx; } .p-b-0 { padding-bottom: 0; } .p-b-20 { padding-bottom: 20rpx; } .p-b-30 { padding-bottom: 30rpx; } .p-b-100 { padding-bottom: 100rpx; } .p-l-r-10 { padding-left: 10rpx; padding-right: 10rpx; } .p-l-r-15 { padding-left: 15rpx; padding-right: 15rpx; } .p-l-r-20 { padding-left: 20rpx; padding-right: 20rpx; } .p-l-r-30 { padding-left: 30rpx; padding-right: 30rpx; } .p-l-r-40 { padding-left: 40rpx; padding-right: 40rpx; } .p-l-r-60 { padding-left: 60rpx; padding-right: 60rpx; } .p-l-10 { padding-left: 10rpx; } .p-l-20 { padding-left: 20rpx; } .p-l-30 { padding-left: 30rpx; } .p-l-60 { padding-left: 60rpx; } .p-r-20 { padding-right: 20rpx; } .p-r-60 { padding-right: 60rpx; } .m-10 { margin: 10rpx; } .m-20 { margin: 20rpx; } .m-t-4 { margin-top: 4rpx; } .m-t-10 { margin-top: 10rpx; } .m-t-20 { margin-top: 20rpx; } .m-t-30 { margin-top: 30rpx; } .m-t-40 { margin-top: 40rpx; } .m-t-50 { margin-top: 50rpx; } .m-t-60 { margin-top: 60rpx; } .m-t-100 { margin-top: 100rpx; } .m-l-10 { margin-left: 10rpx; } .m-l-20 { margin-left: 20rpx; } .m-l-30 { margin-left: 30rpx; } .m-l-40 { margin-left: 40rpx; } .m-l-50 { margin-left: 50rpx; } .m-l-60 { margin-left: 60rpx; } .m-r-10 { margin-right: 10rpx; } .m-r-20 { margin-right: 20rpx; } .m-l-r-10 { margin-left: 10rpx; margin-right: 10rpx; } .m-l-r-30 { margin-left: 30rpx; margin-right: 30rpx; } .m-b-5 { margin-bottom: 5rpx; } .m-b-10 { margin-bottom: 10rpx; } .m-b-20 { margin-bottom: 20rpx; } .m-b-30 { margin-bottom: 30rpx; } .m-b-40 { margin-bottom: 40rpx; } .m-b-50 { margin-bottom: 40rpx; } .m-b-60 { margin-bottom: 40rpx; } .m-b-70 { margin-bottom: 40rpx; } .m-b-80 { margin-bottom: 40rpx; } .m-t-b-10 { margin-top: 10rpx; margin-bottom: 10rpx; } .m-t-b-20 { margin-top: 20rpx; margin-bottom: 20rpx; } .m-t-b-30 { margin-top: 30rpx; margin-bottom: 30rpx; } .oneline-hide { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .twoline-hide { display: -webkit-box; word-break: break-all; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .b-r { border-right: 1rpx solid #eee; } .b-b { border-bottom: 1rpx solid #eee; } .b-t { border-top: 1rpx solid #eee; } .ts-1 { -moz-transition: all 0.1s; -o-transition: all 0.1s; transition: all 0.1s; } .ts-2 { -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; } .ts-3 { -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .ts-5 { -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } /* 无样式button (用于伪submit) */ .btn-normal { display: block; margin: 0; padding: 0; line-height: normal; background: none; border-radius: 0; box-shadow: none; border: none; font-size: unset; text-align: unset; overflow: visible; color: inherit; } .btn-normal:after { border: none; } .btn-normal.button-hover { color: inherit; } button:after { content: none; border: none; } .width-30 { width: 30%; } .width-35 { width: 35%; } .width-40 { width: 40%; } .width-45 { width: 45%; } .width-50 { width: 50%; } .width-60 { width: 60%; } .width-70 { width: 70%; } .width-80 { width: 80%; } .width-90 { width: 90%; } .width-100 { width: 100%; } .height-100 { height: 100%; } .height-full { height: 100vh; } .height-half { height: 50vh; } /* 开头空两格 */ .t-indent { text-indent: 2em; } .t-bold { font-weight: bold; } .t-bold-i { font-weight: bold !important; } /* 圆形 */ .border-round { border-radius: 50%; } /* 圆角矩形 */ .border-round-5 { border-radius: 5px; } .border-round-10 { border-radius: 10px; } .border-round-20 { border-radius: 20px; } .border-round-25 { border-radius: 25px; } .border-round-50 { border-radius: 50px; } .border-r-t-20 { border-top-left-radius: 20px; border-top-right-radius: 20px; } /* 边框 */ .border-i { border-width: 1px; border-color: #909399; border-style: solid; } .border-i-m { border-width: 1px; border-color: #c8c9cc; border-style: solid; } .border-t-i { border-top-width: 1px; border-top-color: #909399; border-top-style: solid; } .border-t-i-l { border-top-width: 1px; border-top-color: #f4f4f5; border-top-style: solid; } .border-b-i-m { border-bottom-width: 1px; border-bottom-color: #c8c9cc; border-bottom-style: solid; } .border-t-i-m { border-top-width: 1px; border-top-color: #c8c9cc; border-top-style: solid; } .border-black { border-width: 1px; border-color: black; border-style: solid; } /* 阴影 */ .shadow-light { box-shadow: 0 0 5px 1px lightgrey; } /* 居顶 */ .top-0 { top: 0, } /* 居底 */ .bottom-20 { position: absolute; bottom: 20rpx; } .bottom-left-30 { position: absolute; left: 30rpx; bottom: 30rpx; } .bottom-right-40 { position: absolute; bottom: 40rpx; right: 40rpx; } .bottom-0 { position: absolute; bottom: 0; } .bottom-40-f { position: fixed; bottom: 40rpx; } .top-right { top: 0; right: 0; } .right-20 { position: absolute; right: 20px; } /* 一行文本 */ .line-1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .nowrap { white-space: nowrap; } /* 透明度 */ .opacity-02 { opacity: 0.2; } .opacity-06 { opacity: 0.6; } .no-visible { visibility: hidden; }