html body{
  width: calc(100vw);
  height: calc(100vh);
  margin: 0px;
  padding: 0px;
}

h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p {
    margin: 0;
    font-size: inherit;
  }

::-webkit-scrollbar {
  width: 0;
  height: 0;
  color: transparent;
}
.pointer{
  cursor: pointer;	
}
.app-container{
  // padding-bottom:50px;
  width: 100vw;
  min-height: 100vh;
  .van-overlay {
    z-index: 100;
  }
  
}

/* 常用流布局 */
.display-box { display: box; display: -webkit-box; }
.flexbox-v { display: box; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-flex-flow: column; flex-flow: column; height: 100%; -webkit-flex-direction: column; flex-direction: column; box-sizing: border-box; -webkit-box-sizing: border-box; }
.flexbox-h { display: box; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: horizontal; -webkit-flex-flow: row; flex-flow: row; width: 100%; -webkit-flex-direction: row; flex-direction: row; box-sizing: border-box; -webkit-box-sizing: border-box; }
.flex-item { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; box-sizing: border-box; -webkit-box-sizing: border-box; }
.flex-flow-row-wrap { flex-direction: row; flex-wrap: wrap; -webkit-flex-direction: row; -webkit-flex-wrap: wrap; }
.flex-flow-row-nowrap { flex-direction: row; flex-wrap: nowrap; -webkit-flex-direction: row; -webkit-flex-wrap: nowrap; }

/* 常用定位 */
.position-absolute { position: absolute; }
.position-relative { position: relative; }
.position-fixed { position: fixed; }
.position-static { position: static; }

.float-left{float: left;}

/*定位元素垂直居中*/
.position-vertical-middle { top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); }
/*定位元素水平居中*/
.position-horizontal-center { left: 50%; transform: translate(-50%,0); -webkit-transform: translate(-50%,0); }
/*定位元素水平垂直居中*/
.position-center-all { top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }

/* 行块元素垂直对齐 */
.v-middle { display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-align: center; display: box; box-orient: horizontal; box-align: center; }
.v-top { display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-align: start; display: box; box-orient: horizontal; box-align: start; }
.v-bottom { display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-align: end; display: box; box-orient: horizontal; box-align: end; }
.v-center{ justify-content: center;}

/* 行块元素水平对齐 */
.h-center { display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-pack: center; display: box; box-orient: horizontal; box-pack: center; }
.h-left { display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-pack: start; display: box; box-orient: horizontal; box-pack: start; }
.h-right { display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-pack: end; display: box; box-orient: horizontal; box-pack: end; }

/* 行块元素水平垂直对齐 */
.center-all { display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-pack: center; -webkit-box-align: center; display: box; box-orient: horizontal; box-pack: center; box-align: center; }

/*常用内边距*/ 
.p-0{ padding: 0px;}
.p-2{ padding: 2px;}
.p-4{ padding: 4px;}
.p-6{ padding: 6px;}
.p-8{ padding: 8px;}
.p-10{ padding: 10px;}
.p-12{ padding: 12px;}
.p-14{ padding: 14px;}
.p-16{ padding: 16px;}
.p-18{ padding: 18px;}
.p-20{ padding: 20px;}
.p-22{ padding: 22px;}
.p-24{ padding: 24px;}
.p-26{ padding: 26px;}
.p-28{ padding: 28px;}
.p-30{ padding: 30px;}
.p-36{ padding: 36px;}
.p-40{ padding: 40px;}

/*常用水平内边距*/
.p-h-0{ padding-left: 0 ; padding-right: 0 ;}
.p-h-2{ padding-left: 2px ; padding-right: 2px;}
.p-h-4{ padding-left: 4px; padding-right: 4px;}
.p-h-6{ padding-left: 6px; padding-right: 6px;}
.p-h-8{ padding-left: 8px; padding-right: 8px;}
.p-h-10{ padding-left: 10px; padding-right: 10px;}
.p-h-12{ padding-left: 12px; padding-right: 12px;}
.p-h-14{ padding-left: 14px; padding-right: 14px;}
.p-h-16{ padding-left: 16px; padding-right: 16px;}
.p-h-18{ padding-left: 18px; padding-right: 18px;}
.p-h-20{ padding-left: 20px; padding-right: 20px;}
.p-h-22{ padding-left: 22px; padding-right: 22px;}
.p-h-24{ padding-left: 24px; padding-right: 24px;}
.p-h-26{ padding-left: 26px; padding-right: 26px;}
.p-h-28{ padding-left: 28px; padding-right: 28px;}
.p-h-30{ padding-left: 30px; padding-right: 30px;}
.p-h-36{ padding-left: 36px; padding-right: 36px;}
.p-h-40{ padding-left: 40px; padding-right: 40px;}
.p-h-60{ padding-left: 60px; padding-right: 60px;}
.p-h-80{ padding-left: 80px; padding-right: 80px;}

.p-l-2{ padding-left: 2px;}
.p-l-4{ padding-left: 4px;}
.p-l-6{ padding-left: 6px;}
.p-l-8{ padding-left: 8px;}
.p-l-10{ padding-left: 10px;}
.p-l-12{ padding-left: 12px;}
.p-l-14{ padding-left: 14px;}
.p-l-16{ padding-left: 16px;}
.p-l-18{ padding-left: 18px;}
.p-l-20{ padding-left: 20px;}
.p-l-22{ padding-left: 22px;}
.p-l-24{ padding-left: 24px;}
.p-l-26{ padding-left: 26px;}
.p-l-28{ padding-left: 28px;}
.p-l-30{ padding-left: 30px;}
.p-l-36{ padding-left: 36px;}
.p-l-40{ padding-left: 40px;}

.p-r-2{ padding-right: 2px;}
.p-r-4{ padding-right: 4px;}
.p-r-6{ padding-right: 6px;}
.p-r-8{ padding-right: 8px;}
.p-r-10{ padding-right: 10px;}
.p-r-12{ padding-right: 12px;}
.p-r-14{ padding-right: 14px;}
.p-r-16{ padding-right: 16px;}
.p-r-18{ padding-right: 18px;}
.p-r-20{ padding-right: 20px;}
.p-r-22{ padding-right: 22px;}
.p-r-24{ padding-right: 24px;}
.p-r-26{ padding-right: 26px;}
.p-r-28{ padding-right: 28px;}
.p-r-30{ padding-right: 30px;}
.p-r-36{ padding-right: 36px;}
.p-r-40{ padding-right: 40px;}

/*常用垂直内边距*/
.p-v-4{padding-top: 4px; padding-bottom: 4px;}
.p-v-5{padding-top: 5px; padding-bottom: 5px;}
.p-v-6{padding-top: 6px; padding-bottom: 6px;}
.p-v-8{padding-top: 8px; padding-bottom: 8px;}
.p-v-10{padding-top: 10px; padding-bottom: 10px;}
.p-v-12{padding-top: 12px; padding-bottom: 12px;}
.p-v-16{ padding-top: 16px; padding-bottom: 16px;}
.p-v-18{ padding-top: 18px; padding-bottom: 18px;}
.p-v-20{ padding-top: 20px; padding-bottom: 20px;}
.p-v-22{ padding-top: 22px; padding-bottom: 22px;}
.p-v-24{ padding-top: 24px; padding-bottom: 24px;}
.p-v-26{ padding-top: 26px; padding-bottom: 26px;}
.p-v-28{ padding-top: 28px; padding-bottom: 28px;}
.p-v-30{ padding-top: 30px; padding-bottom: 30px;}
.p-v-40{ padding-top: 40px; padding-bottom: 40px;}

.p-b-2{ padding-bottom: 2px;}
.p-b-4{ padding-bottom: 4px;}
.p-b-6{ padding-bottom: 6px;}
.p-b-8{ padding-bottom: 8px;}
.p-b-10{ padding-bottom: 10px;}
.p-b-12{ padding-bottom: 12px;}
.p-b-14{ padding-bottom: 14px;}
.p-b-16{ padding-bottom: 16px;}
.p-b-18{ padding-bottom: 18px;}
.p-b-20{ padding-bottom: 20px;}
.p-b-22{ padding-bottom: 22px;}
.p-b-24{ padding-bottom: 24px;}
.p-b-26{ padding-bottom: 26px;}
.p-b-28{ padding-bottom: 28px;}
.p-b-30{ padding-bottom: 30px;}
.p-b-40{ padding-bottom: 40px;}

.p-t-2{ padding-top: 2px;}
.p-t-4{ padding-top: 4px;}
.p-t-6{ padding-top: 6px;}
.p-t-8{ padding-top: 8px;}
.p-t-10{ padding-top: 10px;}
.p-t-12{ padding-top: 12px;}
.p-t-14{ padding-top: 14px;}
.p-t-16{ padding-top: 16px;}
.p-t-18{ padding-top: 18px;}
.p-t-20{ padding-top: 20px;}
.p-t-22{ padding-top: 22px;}
.p-t-24{ padding-top: 24px;}
.p-t-26{ padding-top: 26px;}
.p-t-28{ padding-top: 28px;}
.p-t-30{ padding-top: 30px;}
.p-t-40{ padding-top: 40px;}

/*常用外边距*/
.m-2{ margin: 2px;}
.m-4{ margin: 4px;}
.m-6{ margin: 6px;}
.m-8{ margin: 8px;}
.m-10{ margin: 10px;}
.m-12{ margin: 12px;}
.m-14{ margin: 14px;}
.m-16{ margin: 16px;}
.m-18{ margin: 18px;}
.m-20{ margin: 20px;}
.m-22{ margin: 22px;}
.m-24{ margin: 24px;}
.m-26{ margin: 26px;}
.m-28{ margin: 28px;}
.m-30{ margin: 30px;}
.m-40{ margin: 40px;}

/*常用水平外边距*/
.m-h-2{margin-left: 4px;margin-right: 4px;}
.m-h-4{margin-left: 4px;margin-right: 4px;}
.m-h-6{margin-left: 4px;margin-right: 4px;}
.m-h-8{margin-left: 8px;margin-right: 8px;}
.m-h-10{margin-left: 10px;margin-right: 10px;}
.m-h-12{margin-left: 12px;margin-right: 12px;}
.m-h-14{margin-left: 14px;margin-right: 14px;}
.m-h-16{margin-left: 16px;margin-right: 16px;}
.m-h-18{margin-left: 18px;margin-right: 18px;}
.m-h-20{margin-left: 20px;margin-right: 20px;}
.m-h-22{margin-left: 22px;margin-right: 22px;}
.m-h-24{margin-left: 24px;margin-right: 24px;}
.m-h-26{margin-left: 26px;margin-right: 26px;}
.m-h-28{margin-left: 28px;margin-right: 28px;}
.m-h-30{margin-left: 30px;margin-right: 30px;}
.m-h-36{margin-left: 36px;margin-right: 36px;}
.m-h-40{margin-left: 40px;margin-right: 40px;}

.m-l-2{ margin-left: 8px;}
.m-l-4{ margin-left: 4px;}
.m-l-6{ margin-left: 8px;}
.m-l-8{ margin-left: 8px;}
.m-l-10{ margin-left: 10px;}
.m-l-12{ margin-left: 12px;}
.m-l-14{ margin-left: 14px;}
.m-l-16{ margin-left: 16px;}
.m-l-18{ margin-left: 18px;}
.m-l-20{ margin-left: 20px;}
.m-l-22{ margin-left: 22px;}
.m-l-24{ margin-left: 24px;}
.m-l-26{ margin-left: 26px;}
.m-l-28{ margin-left: 28px;}
.m-l-30{ margin-left: 30px;}
.m-l-36{ margin-left: 36px;}
.m-l-40{ margin-left: 40px;}

.m-r-2{ margin-right: 4px;}
.m-r-4{ margin-right: 4px;}
.m-r-6{ margin-right: 8px;}
.m-r-8{ margin-right: 8px;}
.m-r-10{ margin-right: 10px;}
.m-r-12{ margin-right: 12px;}
.m-r-14{ margin-right: 14px;}
.m-r-16{ margin-right: 16px;}
.m-r-18{ margin-right: 18px;}
.m-r-20{ margin-right: 20px;}
.m-r-22{ margin-right: 22px;}
.m-r-24{ margin-right: 24px;}
.m-r-26{ margin-right: 26px;}
.m-r-28{ margin-right: 28px;}
.m-r-30{ margin-right: 30px;}
.m-r-36{ margin-right: 36px;}
.m-r-40{ margin-right: 40px;}

/*常用垂直外边距*/
.m-v-4{margin-bottom: 4x;margin-top:4px;}
.m-v-8{margin-bottom: 8px;margin-top: 8px;}
.m-v-12{margin-bottom: 12px;margin-top:12px;}
.m-v-16{margin-bottom: 16px;margin-top:16px;}
.m-v-20{margin-bottom: 20px;margin-top: 20px;}
.m-v-24{margin-bottom: 24px;margin-top: 24px;}
.m-v-40{margin-bottom: 40px;margin-top: 40px;}
.m-t-4{ margin-top: 4px;}
.m-t-6{ margin-top: 6px;}
.m-t-8{ margin-top: 8px;}
.m-t-10{ margin-top: 10px;}
.m-t-12{ margin-top: 12px;}
.m-t-14{ margin-top: 14px;}
.m-t-16{ margin-top: 16px;}
.m-t-18{ margin-top: 18px;}
.m-t-20{ margin-top: 20px;}
.m-t-22{ margin-top: 22px;}
.m-t-24{ margin-top: 24px;}
.m-t-26{ margin-top: 26px;}
.m-t-28{ margin-top: 28px;}
.m-t-30{ margin-top: 30px;}
.m-t-36{ margin-top: 36px;}
.m-t-40{ margin-top: 40px;}
.m-t-60{ margin-top: 60px;}
.m-t-66{ margin-top: 66px;}

.m-b-2{ margin-bottom: 2px;}
.m-b-4{ margin-bottom: 4px;}
.m-b-6{ margin-bottom: 6px;}
.m-b-8{ margin-bottom: 8px;}
.m-b-10{ margin-bottom: 10px;}
.m-b-12{ margin-bottom: 12px;}
.m-b-14{ margin-bottom: 14px;}
.m-b-16{ margin-bottom: 16px;}
.m-b-18{ margin-bottom: 18px;}
.m-b-20{ margin-bottom: 20px;}
.m-b-22{ margin-bottom: 22px;}
.m-b-24{ margin-bottom: 24px;}
.m-b-26{ margin-bottom: 26px;}
.m-b-28{ margin-bottom: 28px;}
.m-b-30{ margin-bottom: 30px;}
.m-b-36{ margin-bottom: 36px;}
.m-b-40{ margin-bottom: 40px;}

/*常用字体*/
.size-4{ font-size: 4px;}
.size-5{ font-size: 5px;}
.size-6{ font-size: 6px;}
.size-7{ font-size: 7px;}
.size-8{ font-size: 8px;}
.size-9{ font-size: 9px;}
.size-10{ font-size: 10px;}
.size-11{ font-size: 11px;}
.size-12{ font-size: 12px;}
.size-13{ font-size: 13px;}
.size-14{ font-size: 14px;}
.size-15{ font-size: 15px;}
.size-16{ font-size: 16px;}
.size-18{ font-size: 18px;}
.size-20{ font-size: 20px;}
.size-22{ font-size: 22px;}
.size-24{ font-size: 24px;}
.size-25{ font-size: 25px;}
.size-26{ font-size: 26px;}
.size-28{ font-size: 28px;}
.size-32{ font-size: 32px;}
.size-36{ font-size: 36px;}
.size-48{ font-size: 48px;}
.size-56{font-size: 56px;}

/*主题颜色*/
.bg-f2{background: #f2f2f2;}
.bg-f7{background: #f7f7f7;}
.bg-999{background: #999;}
.bg-mian{background: #22453f;}
.bg-e4a224{background: #e4a224;}
.bg-ffe9c2{background: #ffe9c2;}
.bg-default{background: #f8f8f8}
.bg-white {background: #fff;}
.bg-fff {background: #fff;}
.bg-red{ background: #e21640; }

/*字体颜色*/
.color-default{color: #333333;}
.color-main{color:#22453f;}
.color-fff {color: #fff;}
.color-ff710d {color: #ff710d;}
.color-f9584d{color: #f9584d;}
.color-red{color: #e21640;}
.color-green{color: #19be6b;}
.color-30dbaf{color: #30dbaf;}
.color-ffaf25{color: #ffaf25;}
.color-info{color: #2d8cf0;}
.color-eee{color: #eeeeee}
.color-ccc{color: #cccccc}
.color-333{color: #333333;}
.color-666{color: #666666}
.color-999{color: #999999}
.color-000{color: #000000}
.color-icon{color: #1492ff}

/*定义匹配某个区域的特定元素*/
.box-sizing-border{box-sizing:border-box;}
.box-sizing-content{box-sizing:content-box;}
.box-sizing-inherit{box-sizing:inherit;}

/*文本对齐*/
.text-center{text-align: center;}
.text-right{text-align: right;}
.text-left{text-align: left;}
/* 首行缩近*/
.text-indent{text-indent: 28px;}
/* 文本粗细*/
.text-bold{font-weight: bold;}
/* 圆角*/
.radius6{border-radius: 6px;}
/* 圆角*/
.radius3{border-radius: 3px;}
/* 文本中线*/
.text-decoration{text-decoration: line-through;}
.shadow{
	box-shadow: 2px 2px 5px #ddd;
}
/*点击高亮*/
.touch-active { }
.touch-active:active { background: #eee; }
.touch-active-ddd { }
.touch-active-ddd:active { background: #ddd; }

/*常用描边*/
.border-bottom{position: relative;}
.border-bottom::after{
content:'';position:absolute;top:0;bottom:0;width:200%;height:199%;transform:scale(0.5);transform-origin:0 0;pointer-events:none;box-sizing:border-box;border:0 solid #e9eaec;border-bottom-width:1px;left:0;right:0; 
}
.border-solid{
border: solid 1px #eee;
}

.border-solid-f2{
border-bottom: solid 1px #f2f2f2;
}

.divider{ padding-bottom: 100px;}
.display-block{
display: block;
}
.display-none{
display: none;
}
.border-none::after{
display: none;
}
.relative{
position: relative;
}
.absolute{
width: 100%;
position:absolute;
top: 0px;
left: 0px;
}
/*添加按钮*/
.fixed_button{width: 100%;color: #fff;position: fixed;bottom: 0px;left: 0px; z-index: 5; }

.cutoff{ height: 20px; background: #f2f2f2; }

/* 设置文字显示多少行 */
.row-1, .row-2, .row-3, .row-4, .row-5 { overflow: hidden; text-overflow: ellipsis; display: box; display: -webkit-box; word-wrap: break-word; white-space: normal !important; -webkit-box-orient: vertical; }
.row-1 { line-clamp: 1; -webkit-line-clamp: 1; }
.row-2 { line-clamp: 2; -webkit-line-clamp: 2; }
.row-3 { line-clamp: 3; -webkit-line-clamp: 3; }
.row-4 { line-clamp: 4; -webkit-line-clamp: 4; }
.row-5 { line-clamp: 5; -webkit-line-clamp: 5; }

// 步进器样式覆盖
//步进器打包加减符号显示错位
.van-stepper__minus::after, .van-stepper__minus::before, .van-stepper__plus::after, .van-stepper__plus::before {
  margin: unset;
}
//步进器大小调整
.van-stepper__minus:after, .van-stepper__plus:after {
  width: 0.05rem;
  height: 50%;
}
.van-stepper__minus:before, .van-stepper__plus:before {
  width: 50%;
  height: .05rem;
}
.product_con{
  .van-popup {
    .van-picker-column{
      font-size: 24px;
    }
  }
}
//覆盖宫格原始padding
.no_padding{
  .van-grid {
    .van-grid-item__content {
      padding: 0;
    }
  }
}