/**app.wxss**/
page,
view,
scroll-view,
swiper,
swiper-item,
movable-area,
movable-view,
cover-view,
cover-image,
icon,
text,
rich-text,
progress,
button,
checkbox-group,
checkbox,
form,
input,
label,
picker,
picker-view,
radio-group,
radio,
slider,
switch,
textarea,
navigator,
functional-page-navigator,
image,
video,
camera,
live-player,
live-pusher,
map,
canvas,
open-data,
web-view,
ad {
  box-sizing: border-box;
}
/* ------  normal主色调 border边框颜色  ------ */
page {
  word-break: break-all;
  --normal: #f10545;
  --border: #f1f1f1;
  --arrow: #f0f0f0;
  --nothing: #0d8aff;
  --red: #ff3333;
  --blue: #0d8aff;
  --green: #019734;
  --yellow: #ffcf00;
  --black: #000;
  --darkGray: #333;
  --gray: #666;
  --ghostWhite: #999;
  --white: #ffffff;
}
.container {
  width: 100%;
  font-family: "PingFang SC", "Microsoft Yahei";
  line-height: 1.4;
  font-size: 28rpx;
  color: var(--black);
  background-color: white;
  overflow: hidden;
  min-height: 100vh;
}
.page-head {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  z-index: 999;
  overflow: hidden;
}
.page-foot {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
}
.page-foot ~ .container {
  padding-bottom: 1.28rem;
}
/*IPhoneX适配*/
/* @supports (bottom: constant(safe-area-inset-bottom)) or (bottom: env(safe-area-inset-bottom)) {
    .container{
        padding-bottom: calc(68rpx/2);
        padding-bottom: calc(constant(safe-area-inset-bottom)/2);
        padding-bottom: calc(env(safe-area-inset-bottom)/2);
    }
    .page-foot{
        padding-bottom: 68rpx;
        padding-bottom: constant(safe-area-inset-bottom);
        padding-bottom: env(safe-area-inset-bottom);
    }
    .page-foot ~ .container{
        padding-bottom: calc(130rpx + 68rpx);
        padding-bottom: calc(constant(safe-area-inset-bottom) + 130rpx);
        padding-bottom: calc(env(safe-area-inset-bottom) + 130rpx);
    }
} */
/* 相对定位 */
.pr {
  position: relative;
}
/* 左右浮动 */
.fl {
  float: left;
}
.fr {
  float: right;
}
/* 组件 - 模拟表格布局 */
.table {
  width: 100%;
  display: table;
  table-layout: fixed;
}
.table-cell {
  display: table-cell;
  vertical-align: middle;
}
.table-cell.vt {
  vertical-align: top;
}
.table-cell.vb {
  vertical-align: bottom;
}
/* 按钮 */
button.m-button {
  padding: 0;
  margin: 0;
  text-align: center;
  background-color: transparent;
  border: none;
  width: auto;
}
button.m-button::after {
  border: none;
}
/*flex布局*/
.flex {
  display: flex;
}
.flex-end {
  align-items: flex-end;
}
.flex-box {
  display: flex;
  align-items: center;
}
.flex-grow-1 {
  flex: 1;
  overflow: hidden;
}
.flex-wrap {
  flex-wrap: wrap;
}
.flex-between {
  justify-content: space-between;
}
.flex-center {
  justify-content: center;
}
.flex-col {
  flex-direction: column;
}
.flex-col-reserve {
  flex-direction: column-reverse;
}
.flex-row {
  flex-direction: row;
}
.flex-row-reserve {
  flex-direction: row-reverse;
}
/*清除浮动*/
.clearfix {
  display: block;
}
.clearfix:after {
  content: " ";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  overflow: hidden;
}
/*1像素边框*/
/* 用法 外层class="m-hairline" 需要设置边框的元素class="m-hairline--left" */
.m-hairline,
.m-hairline--bottom,
.m-hairline--left,
.m-hairline--right,
.m-hairline--surround,
.m-hairline--top,
.m-hairline--top-bottom {
  position: relative;
}
.m-hairline--bottom:after,
.m-hairline--left:after,
.m-hairline--right:after,
.m-hairline--surround:after,
.m-hairline--top-bottom:after,
.m-hairline--top:after,
.m-hairline:after {
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  width: 200%;
  height: 200%;
  border: 0 var(--border) solid;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
  pointer-events: none;
  box-sizing: border-box;
}
.m-hairline--top:after {
  border-top-width: 0.02rem;
}
.m-hairline--left:after {
  border-left-width: 0.02rem;
}
.m-hairline--right:after {
  border-right-width: 0.02rem;
}
.m-hairline--bottom:after {
  border-bottom-width: 0.02rem;
}
.m-hairline--top-bottom:after {
  border-width: 0.02rem 0;
}
.m-hairline--surround:after {
  border-width: 0.02rem;
}
/*阴影*/
/* .m-shadow{box-shadow:0 0.01rem 0.18rem 0 rgba(0,0,0,0.06);} */
/*分割线*/
.m-baseline {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.3rem;
  font-size: 0.2rem;
  color: #e1e1e1;
}
.m-baseline:before,
.m-baseline:after {
  content: "";
  display: block;
  flex: 1;
  height: 0.02rem;
  background-color: currentColor;
  transform: scaleY(0.5);
}
.m-baseline:before {
  margin-right: 0.2rem;
}
.m-baseline:after {
  margin-left: 0.2rem;
}

/*文本省略*/
.m-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.m-ellipsis-l2,
.m-ellipsis-l3,
.m-ellipsis-l7 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
}
.m-ellipsis-l2 {
  -webkit-line-clamp: 2;
}
.m-ellipsis-l3 {
  -webkit-line-clamp: 3;
}
.m-ellipsis-l7 {
  -webkit-line-clamp: 7;
}
/* 无数据 */
.nothing {
  padding: 0.6rem 0;
  text-align: center;
}
.nothing image {
  display: block;
  width: 1.6rem;
  height: 1.6rem;
  margin: 0 auto;
}
.nothing text {
  display: block;
  margin-top: 0.2rem;
  text-align: center;
  line-height: 0.6rem;
  font-size: 0.26rem;
  color: var(--nothing);
}
.nothing.hide {
  display: none;
}
/* 通用样式 */
.fwb {
  font-weight: bold;
}
.tc {
  text-align: center;
}
.tr {
  text-align: right;
}
.tl {
  text-align: left;
}
/* 圆角 */
.br10 {
  border-radius: 0.1rem;
}
.br20 {
  border-radius: 0.2rem;
}
.br30 {
  border-radius: 0.3rem;
}
.br40 {
  border-radius: 0.4rem;
}
.br50 {
  border-radius: 0.5rem;
}
.brarc {
  border-radius: 50%;
}
/* 字体颜色 */
.colf {
  color: #fff;
}
.colc {
  color: #ccc;
}
.col0 {
  color: #000;
}
.col3 {
  color: #333;
}
.col6 {
  color: #666;
}
.col9 {
  color: #999;
}
.cold {
  color: #ddd;
}
.cola {
  color: #aaa;
}
.col89 {
  color: #898989;
}
/* 字体大小 */
.fs10 {
  font-size: 0.1rem;
}
.fs12 {
  font-size: 0.12rem;
}
.fs14 {
  font-size: 0.14rem;
}
.fs16 {
  font-size: 0.16rem;
}
.fs18 {
  font-size: 0.18rem;
}
.fs20 {
  font-size: 0.2rem;
}
.fs22 {
  font-size: 0.22rem;
}
.fs24 {
  font-size: 0.24rem;
}
.fs26 {
  font-size: 0.26rem;
}
.fs28 {
  font-size: 0.28rem;
}
.fs30 {
  font-size: 0.3rem;
}
.fs32 {
  font-size: 0.32rem;
}
.fs34 {
  font-size: 0.34rem;
}
.fs36 {
  font-size: 0.36rem;
}
.fs38 {
  font-size: 0.38rem;
}
.fs40 {
  font-size: 0.4rem;
}
.fs42 {
  font-size: 0.42rem;
}
.fs44 {
  font-size: 0.44rem;
}
.fs46 {
  font-size: 0.46rem;
}
.fs48 {
  font-size: 0.48rem;
}
.fs50 {
  font-size: 0.5rem;
}
/* padding */
.p5 {
  padding: 0.05rem;
}
.p10 {
  padding: 0.1rem;
}
.p15 {
  padding: 0.15rem;
}
.p20 {
  padding: 0.2rem;
}
.p25 {
  padding: 0.25rem;
}
.p30 {
  padding: 0.3rem;
}
.p35 {
  padding: 0.35rem;
}
.p40 {
  padding: 0.4rem;
}
.pb5 {
  padding-bottom: 0.05rem;
}
.pb10 {
  padding-bottom: 0.1rem;
}
.pb15 {
  padding-bottom: 0.15rem;
}
.pb20 {
  padding-bottom: 0.2rem;
}
.pb25 {
  padding-bottom: 0.25rem;
}
.pb30 {
  padding-bottom: 0.3rem;
}
.pb35 {
  padding-bottom: 0.35rem;
}
.pb40 {
  padding-bottom: 0.4rem;
}
.pt5 {
  padding-top: 0.05rem;
}
.pt10 {
  padding-top: 0.1rem;
}
.pt15 {
  padding-top: 0.15rem;
}
.pt20 {
  padding-top: 0.2rem;
}
.pt25 {
  padding-top: 0.25rem;
}
.pt30 {
  padding-top: 0.3rem;
}
.pt35 {
  padding-top: 0.35rem;
}
.pt40 {
  padding-top: 0.4rem;
}
.pl5 {
  padding-left: 0.05rem;
}
.pl10 {
  padding-left: 0.1rem;
}
.pl15 {
  padding-left: 0.15rem;
}
.pl20 {
  padding-left: 0.2rem;
}
.pl25 {
  padding-left: 0.25rem;
}
.pl30 {
  padding-left: 0.3rem;
}
.pl35 {
  padding-left: 0.35rem;
}
.pl40 {
  padding-left: 0.4rem;
}
.pr5 {
  padding-right: 0.05rem;
}
.pr10 {
  padding-right: 0.1rem;
}
.pr15 {
  padding-right: 0.15rem;
}
.pr20 {
  padding-right: 0.2rem;
}
.pr25 {
  padding-right: 0.25rem;
}
.pr30 {
  padding-right: 0.3rem;
}
.pr35 {
  padding-right: 0.35rem;
}
.pr40 {
  padding-right: 0.4rem;
}
.plr5 {
  padding-left: 0.05rem;
  padding-right: 0.05rem;
}
.plr10 {
  padding-left: 0.1rem;
  padding-right: 0.1rem;
}
.plr15 {
  padding-left: 0.15rem;
  padding-right: 0.15rem;
}
.plr20 {
  padding-left: 0.2rem;
  padding-right: 0.2rem;
}
.plr25 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.plr30 {
  padding-left: 0.3rem;
  padding-right: 0.3rem;
}
.plr35 {
  padding-left: 0.35rem;
  padding-right: 0.35rem;
}
.plr40 {
  padding-left: 0.4rem;
  padding-right: 0.4rem;
}
.ptb5 {
  padding-top: 0.05rem;
  padding-bottom: 0.05rem;
}
.ptb10 {
  padding-top: 0.1rem;
  padding-bottom: 0.1rem;
}
.ptb15 {
  padding-top: 0.15rem;
  padding-bottom: 0.15rem;
}
.ptb20 {
  padding-top: 0.2rem;
  padding-bottom: 0.2rem;
}
.ptb25 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.ptb30 {
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
}
.ptb35 {
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
}
.ptb40 {
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
}
/* margin */
.m5 {
  margin: 0.05rem;
}
.m10 {
  margin: 0.1rem;
}
.m15 {
  margin: 0.15rem;
}
.m20 {
  margin: 0.2rem;
}
.m25 {
  margin: 0.25rem;
}
.m30 {
  margin: 0.3rem;
}
.m35 {
  margin: 0.35rem;
}
.m40 {
  margin: 0.4rem;
}
.mb5 {
  margin-bottom: 0.05rem;
}
.mb10 {
  margin-bottom: 0.1rem;
}
.mb15 {
  margin-bottom: 0.15rem;
}
.mb20 {
  margin-bottom: 0.2rem;
}
.mb25 {
  margin-bottom: 0.25rem;
}
.mb30 {
  margin-bottom: 0.3rem;
}
.mb35 {
  margin-bottom: 0.35rem;
}
.mb40 {
  margin-bottom: 0.4rem;
}
.mt5 {
  margin-top: 0.05rem;
}
.mt10 {
  margin-top: 0.1rem;
}
.mt15 {
  margin-top: 0.15rem;
}
.mt20 {
  margin-top: 0.2rem;
}
.mt25 {
  margin-top: 0.25rem;
}
.mt30 {
  margin-top: 0.3rem;
}
.mt35 {
  margin-top: 0.35rem;
}
.mt40 {
  margin-top: 0.4rem;
}
.ml5 {
  margin-left: 0.05rem;
}
.ml10 {
  margin-left: 0.1rem;
}
.ml15 {
  margin-left: 0.15rem;
}
.ml20 {
  margin-left: 0.2rem;
}
.ml25 {
  margin-left: 0.25rem;
}
.ml30 {
  margin-left: 0.3rem;
}
.ml35 {
  margin-left: 0.35rem;
}
.ml40 {
  margin-left: 0.4rem;
}
.mr5 {
  margin-right: 0.05rem;
}
.mr10 {
  margin-right: 0.1rem;
}
.mr15 {
  margin-right: 0.15rem;
}
.mr20 {
  margin-right: 0.2rem;
}
.mr25 {
  margin-right: 0.25rem;
}
.mr30 {
  margin-right: 0.3rem;
}
.mr35 {
  margin-right: 0.35rem;
}
.mr40 {
  margin-right: 0.4rem;
}
.mlr5 {
  margin-left: 0.05rem;
  margin-right: 0.05rem;
}
.mlr10 {
  margin-left: 0.1rem;
  margin-right: 0.1rem;
}
.mlr15 {
  margin-left: 0.15rem;
  margin-right: 0.15rem;
}
.mlr20 {
  margin-left: 0.2rem;
  margin-right: 0.2rem;
}
.mlr25 {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}
.mlr30 {
  margin-left: 0.3rem;
  margin-right: 0.3rem;
}
.mlr35 {
  margin-left: 0.35rem;
  margin-right: 0.35rem;
}
.mlr40 {
  margin-left: 0.4rem;
  margin-right: 0.4rem;
}
.mtb5 {
  margin-top: 0.05rem;
  margin-bottom: 0.05rem;
}
.mtb10 {
  margin-top: 0.1rem;
  margin-bottom: 0.1rem;
}
.mtb15 {
  margin-top: 0.15rem;
  margin-bottom: 0.15rem;
}
.mtb20 {
  margin-top: 0.2rem;
  margin-bottom: 0.2rem;
}
.mtb25 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}
.mtb30 {
  margin-top: 0.3rem;
  margin-bottom: 0.3rem;
}
.mtb35 {
  margin-top: 0.35rem;
  margin-bottom: 0.35rem;
}
.mtb40 {
  margin-top: 0.4rem;
  margin-bottom: 0.4rem;
}

/* 字体颜色 */
.red {
  color: var(--red);
}
.yellow {
  color: var(--yellow);
}
.blue {
  color: var(--blue);
}
.green {
  color: var(--green);
}
.col-main {
  color: var(--normal);
}
/* 背景颜色 (根据项目自行添加) */
.bg-white {
  background-color: white;
}
.bg-ghostWhite {
  background-color: var(--ghostWhite);
}

/* 文章详情正文统一32rpx */
/* 页面布局
    <view class="page-head"></view>
    <view class="page-foot"></view>
    <view class="container"></view> 
*/
/* 所有颜色根据写在body里的 （--名称：颜色）如 --border:#f9f9f9;为基准 */
/* 自己额外定义的公共样式 */
/* .bg-1{background-color: var(--bg1);}
.m-button.btn1{background-color: var(--btn1);color: var(--white);} */

/* 自定义颜色 */
.col1 {
  color: #101010;
}
.col2 {
  color: #f86845;
}

/* btn 字体大小颜色 按钮背景颜色 margin */
.btn1 {
  background-color: var(--btn1);
  color: var(--white);
}
.btn2 {
  background-color: var(--btn2);
  color: var(--white);
}
.btn3 {
  background-color: var(--btn3);
  color: var(--white);
}
.btn4 {
  background-color: var(--btn4);
  color: var(--white);
}

/* 背景颜色 */
/* .bg-white{background-color: var(--white);} */
.bg-ghostWhite {
  background-color: var(--ghostWhite);
}
.m-shadow {
  box-shadow: 1px 2px 10px 0 rgba(95, 94, 88, 0.3);
}
.z2 {
  z-index: 2;
}
.fw500 {
  font-weight: 500;
}
.wp {
  white-space: pre-line;
}
.search_head ~ .container {
  padding-top: 1.65rem;
}
.btn1 {
  width: 3.3rem;
  height: 0.9rem;
  line-height: 0.9rem;
  text-align: center;
  background: linear-gradient(270deg, #ffca69 0%, #fdac52 100%);
  border-radius: 0.45rem;
  font-size: 0.32rem;
  font-weight: 400;
  color: #ffffff;
}
.btn2 {
  width: 3.3rem;
  height: 0.9rem;
  line-height: 0.9rem;
  text-align: center;
  font-size: 0.32rem;
  font-weight: 400;
  color: #ffffff;
  background: linear-gradient(270deg, #ff8e5e 0%, #f86845 100%);
  border-radius: 0.45rem;
}
.bg-f9 {
  background-color: #f9f9f9;
}
.popup_bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0.04rem 0.3rem;
}
.popup_bottom .order_btn {
  width: 3.3rem;
  height: 0.9rem;
  line-height: 0.9rem;
  text-align: center;
  font-size: 0.32rem;
  font-weight: 400;
  color: #ffffff;
  background: linear-gradient(270deg, #ff8e5e 0%, #f86845 100%);
  border-radius: 0.45rem;
  margin-left: auto;
  margin-right: 0;
}
.tlh {
  text-decoration: line-through;
}
