@font-face {
  font-family: "DINPro";
  src: url("../fonts/DINPro-Bold.woff");
  font-weight: normal;
  font-style: normal;
}

/* 格式化 */
html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
div,
dl,
dt,
dd,
ul,
ol,
li,
p,
blockquote,
pre,
hr,
figure,
table,
caption,
th,
td,
form,
fieldset,
legend,
input,
button,
textarea,
menu {
  margin: 0;
  padding: 0;
}

header,
footer,
section,
article,
aside,
nav,
hgroup,
address,
figure,
figcaption,
menu,
details {
  display: block;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption,
th {
  text-align: left;
  font-weight: normal;
}

html,
body,
fieldset,
img,
iframe,
abbr {
  border: 0;
}

i,
cite,
em,
var,
address,
dfn {
  font-style: normal;
}

[hidefocus],
summary {
  outline: 0;
}

li {
  list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
small {
  font-size: 100%;
}

sup,
sub {
  font-size: 83%;
}

pre,
code,
kbd,
samp {
  font-family: inherit;
}

q:before,
q:after {
  content: none;
}

textarea {
  overflow: auto;
  resize: none;
}

label,
summary {
  cursor: default;
}

a,
button {
  cursor: pointer;
}

h1,
h2,
h3,
h4,
h5,
h6,
em,
strong,
b {
  font-weight: bold;
}

del,
ins,
u,
s,
a,
a:hover {
  text-decoration: none;
}

body,
textarea,
input,
button,
select,
keygen,
legend {
  color: #333;
  outline: 0;
}

body {
  background: #fff;
}

a,
a:hover {
  color: #333;
}

a:active {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
}

.f-cb:after {
  display: block;
  clear: both;
  visibility: hidden;
  height: 0;
  overflow: hidden;
  content: ".";
}

a {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

input,
select,
textarea {
  font-size: 100%;
}

html,
body {
  font-family: 'Microsoft YaHei';
}

.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.flex-left {
  display: flex;
  align-items: center;
}

.flex-center-column {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.text-mini-weight {
  font-size: 0.26rem;
  font-weight: 800;
  color: #333;
  line-height: 0.37rem;
}

.text-small-weight {
  font-size: 0.32rem;
  font-weight: 800;
  color: #333;
  line-height: 0.45rem;
}

.text-normal-weight {
  font-size: 0.37rem;
  font-weight: 800;
  color: #333;
  line-height: 0.45rem;
}

.text-large-weight {
  font-size: 0.42rem;
  font-weight: 800;
  color: #333;
  line-height: 0.586rem;
}

.text-larger-weight {
  font-size: 0.53rem;
  font-weight: 800;
  color: #333;
  line-height: 0.75rem;
}

.text-huge-weight {
  font-size: 0.586rem;
  font-weight: 800;
  color: #333;
  line-height: 0.8rem;
}

.text-mini {
  font-size: 0.26rem;
  color: #333;
  line-height: 0.37rem;
}

.text-small {
  font-size: 0.32rem;
  color: #333;
  line-height: 0.45rem;
}

.text-normal {
  font-size: 0.37rem;
  color: #333;
  line-height: 0.45rem;
}

.text-large {
  font-size: 0.42rem;
  color: #333;
  line-height: 0.586rem;
}

.text-larger {
  font-size: 0.53rem;
  color: #333;
  line-height: 0.75rem;
}

.text-huge {
  font-size: 0.586rem;
  color: #333;
  line-height: 0.8rem;
}

.text-small-gray {
  font-size: 0.32rem;
  color: #999;
  line-height: 0.45rem;
}

.text-normal-gray {
  font-size: 0.37rem;
  color: #999;
  line-height: 0.45rem;
}

.w20 {
  width: 0.26rem;
}

.w30 {
  width: 0.4rem;
}

.my-protocol {
  height: 100%;
  padding: 0.53rem 0.42rem;
  box-sizing: border-box;
}

.my-protocol .container {
  padding: 0.26rem;
  box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
}

.my-protocol .text {
  font-size: 0.37rem;
  color: #666;
  line-height: 0.75rem;
  text-indent: 2em;
}

.my-protocol .text+.text {
  margin-top: 0.13rem;
}

.my-protocol .text-weight {
  margin-top: 0.26rem;
  font-size: 0.37rem;
  color: #333;
  line-height: 0.75rem;
  font-weight: 800;
}

.my-protocol .sub-title {
  margin-top: 0.26rem;
  margin-bottom: 0.13rem;
  color: #333;
  font-size: 0.42rem;
  line-height: 0.75rem;
}

/*margin padding*/
.p32 {
  padding: 0.42rem;
}

.pl32 {
  padding-left: 0.42rem;
}

.pr32 {
  padding-right: 0.42rem;
}

.pt32 {
  padding-top: 0.42rem;
}

.pb32 {
  padding-bottom: 0.42rem;
}

.pt16 {
  padding-top: 0.21rem;
}

.pb16 {
  padding-bottom: 0.21rem;
}

.mt16 {
  margin-top: 0.21rem;
}

.mb16 {
  margin-bottom: 0.21rem;
}

.h100 {
  height: 100%;
}

.van-nav-bar .van-nav-bar__content {
  height: 1.2rem;
}

.van-nav-bar .van-nav-bar__content img {
  width: 0.58rem;
  height: 0.58rem;
}

.van-nav-bar .van-nav-bar__content .van-nav-bar__title {
  font-size: 0.48rem;
  font-weight: 600;
  color: #080A13;
  line-height: 50px;
}

.van-nav-bar .van-nav-bar__content .van-nav-bar__left,
.van-nav-bar .van-nav-bar__content .van-nav-bar__right {
  padding: 0 0.32rem;
}

.van-nav-bar.van-hairline--bottom::after {
  border-bottom-width: 0;
}

#app {
  height: 100%;
  background: #F7F8FA;
}

html,
body {
  height: 100%;
}

*,
*:before,
*:after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

*,
*:before,
*:after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

li {
  list-style: none;
}

a {
  text-decoration: none;
}

.f-cb:after {
  display: block;
  clear: both;
  visibility: hidden;
  height: 0;
  overflow: hidden;
  content: ".";
}

html,
body {
  height: 100%;
}


.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.flex-left {
  display: flex;
  align-items: center;
}

.flex-center-column {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.text-mini-weight {
  font-size: 0.26667rem;
  font-weight: 800;
  color: #333;
  line-height: 0.37333rem;
}

.text-small-weight {
  font-size: 0.32rem;
  font-weight: 800;
  color: #333;
  line-height: 0.45333rem;
}

.text-normal-weight {
  font-size: 0.37333rem;
  font-weight: 800;
  color: #333;
  line-height: 0.45333rem;
}

.text-large-weight {
  font-size: 0.42667rem;
  font-weight: 800;
  color: #333;
  line-height: 0.58667rem;
}

.text-larger-weight {
  font-size: 0.53333rem;
  font-weight: 800;
  color: #333;
  line-height: 0.74667rem;
}

.text-huge-weight {
  font-size: 0.58667rem;
  font-weight: 800;
  color: #333;
  line-height: 0.8rem;
}

.text-mini {
  font-size: 0.26667rem;
  color: #333;
  line-height: 0.37333rem;
}

.text-small {
  font-size: 0.32rem;
  color: #333;
  line-height: 0.45333rem;
}

.text-normal {
  font-size: 0.37333rem;
  color: #333;
  line-height: 0.45333rem;
}

.text-large {
  font-size: 0.42667rem;
  color: #333;
  line-height: 0.58667rem;
}

.text-larger {
  font-size: 0.53333rem;
  color: #333;
  line-height: 0.74667rem;
}

.text-huge {
  font-size: 0.58667rem;
  color: #333;
  line-height: 0.8rem;
}

.text-small-gray {
  font-size: 0.32rem;
  color: #999;
  line-height: 0.45333rem;
}

.text-normal-gray {
  font-size: 0.37333rem;
  color: #999;
  line-height: 0.45333rem;
}

.w20 {
  width: 0.26667rem;
}

.w30 {
  width: 0.4rem;
}

.my-protocol {
  height: 100%;
  padding: 0.53333rem 0.42667rem;
  box-sizing: border-box;
}

.my-protocol .container {
  padding: 0.26667rem;
  box-shadow: 0 0.02667rem 0.06667rem 0 rgba(0, 0, 0, 0.1);
  border-radius: 0.10667rem;
}

.my-protocol .text {
  font-size: 0.37333rem;
  color: #666;
  line-height: 0.74667rem;
  text-indent: 2em;
}

.my-protocol .text+.text {
  margin-top: 0.13333rem;
}

.my-protocol .text-weight {
  margin-top: 0.26667rem;
  font-size: 0.37333rem;
  color: #333;
  line-height: 0.74667rem;
  font-weight: 800;
}

.my-protocol .sub-title {
  margin-top: 0.26667rem;
  margin-bottom: 0.13333rem;
  color: #333;
  font-size: 0.42667rem;
  line-height: 0.74667rem;
}

/*margin padding*/
.p32 {
  padding: 0.42667rem;
}

.pl32 {
  padding-left: 0.42667rem;
}

.pr32 {
  padding-right: 0.42667rem;
}

.pt32 {
  padding-top: 0.42667rem;
}

.pb32 {
  padding-bottom: 0.42667rem;
}

.pt16 {
  padding-top: 0.21333rem;
}

.pb16 {
  padding-bottom: 0.21333rem;
}

.mt16 {
  margin-top: 0.21333rem;
}

.mb16 {
  margin-bottom: 0.21333rem;
}

.h100 {
  height: 100%;
}

.van-toast {
  width: 1.86667rem;
  border-radius: 0.10667rem;
  background: rgba(0, 0, 0, 0.7);
}

.van-toast .van-toast__text {
  font-size: 0.34667rem;
  line-height: 0.53333rem;
  color: #fff;
  text-align: left;
}

.van-nav-bar .van-nav-bar__content {
  height: 1.2rem;
}

.van-nav-bar .van-nav-bar__content img {
  width: 0.58667rem;
  height: 0.58667rem;
}

.van-nav-bar .van-nav-bar__content .van-nav-bar__title {
  font-size: 0.48rem;
  font-weight: 600;
  color: #080A13;
  line-height: 0.66667rem;
}

.van-nav-bar .van-nav-bar__content .van-nav-bar__left,
.van-nav-bar .van-nav-bar__content .van-nav-bar__right {
  padding: 0 0.34667rem;
}

.van-nav-bar.van-hairline--bottom::after {
  border-bottom-width: 0;
}

.van-search {
  padding: 0.21333rem 0.42667rem;
}

.van-search .van-search__content {
  align-items: center;
  height: 0.85333rem;
  line-height: 0.85333rem;
  border-radius: 0.42667rem;
  padding: 0.42667rem;
}

.van-search .van-search__content .van-field__control {
  height: 0.42667rem;
}

.van-search .van-search__content input::-webkit-input-placeholder {
  font-size: 0.34667rem;
  font-weight: 400;
  color: #808695;
}

.van-search .van-search__content .van-field__right-icon i {
  color: #333;
  font-weight: 600;
  font-size: 0.42667rem;
}

.van-dropdown-item {
  width: 10rem;
}

.van-dialog {
  width: 7.73333rem;
  height: 3.69333rem;
  background: #FFFFFF;
  border-radius: 0.26667rem;
}

.van-dialog__content--isolated {
  font-size: 0.37333rem;
  font-family: PingFang SC;
  font-weight: 500;
  color: #333333;
}

.van-dialog__message {
  font-size: 0.37333rem;
  font-family: PingFang SC;
  font-weight: 500;
  color: #333333;
  line-height: 0.64rem;
  padding: 0 .4rem;
  margin-bottom: 0.26667rem;
}

.van-dialog__footer {
  height: 1.06667rem;
}

.van-button__content {
  font-size: 0.42667rem;
  font-family: PingFang SC;
  font-weight: bold;
  color: #00A9FF;
  line-height: 1.06667rem;
}

.van-dialog__cancel,
.van-dialog__confirm {
  height: 1.06667rem;
}

.van-dialog__header {
  font-size: 0.42667rem;
  font-family: PingFang SC;
  font-weight: bold;
  color: #333333;
  margin-top: 0.42667rem;
  margin-bottom: 0.29333rem;
  padding-top: 0;
}
#app.isWeb {
  margin: 0 auto;
  max-width: 540px;
  min-height: 100vh;
  height: auto;
  box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.2);
}
#app.isWeb .van-hairline--top-bottom, #app.isWeb .home-container .position-bottom, #app.isWeb .position-bottom, #app.isWeb .pour-container .nav-dropdown-menu, #app.isWeb .pour-container .shadow, #app.isWeb .van-dropdown-item, #app.isWeb .listeners .fixNav, #app.isWeb .van-tabs .van-tabs__nav, #app.isWeb .home-container .position-info, #app.isWeb .button-go span, #app.isWeb .van-nav-bar, #app.isWeb .listeners .van-action-sheet, #app.isWeb .chat .new-order, #app.isWeb .chat .van-popup {
  max-width: 540px;
  left: 50%;
  transform: translateX(-50%);
}
#app.isWeb .scroll {
  padding-bottom: 150px;
}
#app.isWeb .pour-container {
  position: relative;
}
#app.isWeb .order-container .van-popup {
  position: fixed;
}
#app.isWeb .chat .position-button {
  max-width: 750px;
  left: 54%;
  transform: translateX(-50%);
}
#app.isWeb .chat .van-popup {
  position: fixed;
  bottom: 0;
}
#app.isWeb .listeners .personal .van-tabs .van-tabs__nav {
  margin-left: 0;
}
#app.isWeb .listeners .fixNav{
  width: 100%;
}
#app.isWeb .message ul.list-mass .content .content-text{
  padding-bottom: 2px;
}

#app.isWeb .top-name .person-list-wrap::-webkit-scrollbar {
  /*滚动条整体样式*/
  width : 10px;  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
  }
  #app.isWeb .top-name .person-list-wrap::-webkit-scrollbar-thumb {
  /*滚动条里面小方块*/
  border-radius: 10px;
  box-shadow   : inset 0 0 5px rgba(0, 0, 0, 0.2);
  background   : #535353;
  }
  #app.isWeb .top-name .person-list-wrap::-webkit-scrollbar-track {
  /*滚动条里面轨道*/
  box-shadow   : inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  background   : #ededed;
  }
  /* #app.isWeb .pour-container .van-overlay{
    position: absolute;
  } */
  #app.isWeb .pour-container .van-popup{
    width: 405px!important;
    right: 50%;
    margin-right: -270px;
  }
  #app.isWeb .pour-container .search-condition .price{
    height: 56px;
  }
  #app.isWeb .theme-read .van-tabs .van-tabs__nav {
    margin-left: 0rem;
  }
  [v-cloak]{
    display:none
  }