html,
body {
  height: 100%;
  position: relative;
  background: #f5f5f5;
}

i {
  font-style: normal;
}

#myapp {
  width: 100%;
  height: 100%;
}

[v-cloak] {
  display: none;
}

#Header {
  color: rgba(255, 255, 255, 1);
}

.van-notice-bar {
  height: 40*2upx;
  background: #fff !important;
}

.width-s {
  width: 100%;
}

/* .title-header {
    width: 100%;
    height: 1.2*37*2upx;
    height: 50*2upx;
    background: #348cf2;
} */

/* .btn-header h1 {
    width: 2*37*2upx;
    height: .666667*37*2upx;
    font-size: .373333*37*2upx;
    background: #348cf2;
    color: #fff;
    font-weight: 500;
} */
/* .btn-header {
    height: .666667*37*2upx;
    overflow: hidden;
    font-size: .48*37*2upx;
    color: #fff;
    line-height: .666667*37*2upx;
} */
.btns-header {
  width: 100%;
  height: 1.066667*37*2upx;
  background: #ffffff;
  font-size: 0.32*37*2upx;
  color: #333333;
  /* padding-left: 0.8*37*2upx; */
}

.btns-header p :nth-child(2) {
  color: #333333;
  font-size: 0.32*37*2upx;
}

.btns-header .round {
  width: 0.32*37*2upx;
  height: 0.32*37*2upx;
  display: inline-block;
  border-radius: 50%;
  background: #cccccc;
  margin-right: 0.266667*37*2upx;
}

.btns-header .left {
  margin-right: 3.493333*37*2upx;
}

.btns-header p,
.barber>div,
.kind>div {
  display: flex;

  line-height: 1;
}

/* .borderLeftH1{
    border-left: 1*2upx solid #fff;
    border-top: 1*2upx solid #fff;
    border-bottom: 1*2upx solid #fff;
    border-right: 0*2upx;
    border-radius: .133333*37*2upx 0*37*2upx 0*37*2upx .133333*37*2upx!important;
}
.borderRightH1{
    border-right: 1*2upx solid #fff;
    border-top: 1*2upx solid #fff;
    border-bottom: 1*2upx solid #fff;
    border-left: 0*2upx;
    border-radius:  0*37*2upx .133333*37*2upx  .133333*37*2upx 0*37*2upx!important;
} */

.height-fz {
  /* height: calc(100% - 1.2*37*2upx  ); */
  height: auto;
}

/* .btn-header .show{
    color: #fff;
    background: #348cf2;
} */

.zb {
  background: #00c277 !important;
}

.zbLeft {
  border-radius: 0.133333*37*2upx 0*37*2upx 0*37*2upx 0.133333*37*2upx !important;
}

.zbRight {
  border-radius: 0*37*2upx 0.133333*37*2upx 0.133333*37*2upx 0*37*2upx !important;
}

.yz {
  color: #348cf2;
  background: #fff;
}

/* 内容区 */
.content {
  // padding: 0.266667*37*2upx 0*37*2upx 0 0*37*2upx;
}

.content,
.content:nth-child(1) div {
  width: 100%;
  /* padding-bottom: 2.56*37*2upx; */
}

.time-header {
  /* height: 1.2*37*2upx; */
  width: 100%;
  background: #ffffff;
  color: #333333;
  font-size: 0.293333*37*2upx;
  overflow-x: scroll;
  display: flex;
  padding: .2*37*2upx 0.4*37*2upx;

}

.time-content {
  font-size: 0.373333*37*2upx;
  position: relative;
  color: #00c277;
  width: 2.6*37*2upx !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: .3*37*2upx;
  margin-right: .3*37*2upx;
}

.dataactive {
  font-size: 0.373333*37*2upx;
  position: relative;
  color: #00c277;
  width: 2.6*37*2upx !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: .3*37*2upx;
  margin-right: .3*37*2upx;
}

.dataactives {
  font-size: 16*2upx;
  position: relative;
  color: #ffffff;
  width: 2.6*37*2upx !important;
  border-bottom: none;
  background-color: #00c277;
}

.dataactive .line {
  width: 0.773333*37*2upx;
  height: 0.08*37*2upx;
  background: #00c277;
  position: absolute;
  left: center;
  bottom: -1%;
}

.time-header span {
  height: 100%;
  width: 1.8*37*2upx;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.time-header span .week {
  display: flex;
  flex-direction: row;
  margin-top: 0.08*37*2upx;
  margin-bottom: 0.08*37*2upx;
  justify-content: center;
}

.time-headers {
  width: 100%;
  background: #ffffff;
  color: #333333;
  font-size: 14*2upx;
  overflow-x: scroll;
  display: flex;
  padding: 10*2upx;
  border-bottom: 1*2upx solid #f5f5f5;
  height: 90*2upx;
  border-radius: 10*2upx;
  padding-left: 0;
}

.time-contents {
  border-left: 1*2upx solid #f5f5f5;
  border-top: 1*2upx solid #f5f5f5;
  border-bottom: 1*2upx solid #f5f5f5;
  text-align: center;
  padding-top: 10*2upx;
  border-radius: 15*2upx;
  margin-right: .2703*37*2upx;
  box-shadow: 0 2*2upx 4*2upx rgba(0, 0, 0, 0.12), 0 0 6*2upx rgba(0, 0, 0, 0.04);
  align-items: center;
  justify-content: space-around;
  width: 80rpx;
  display: block;
}

.time {
  background: #fff;
  position: relative;
}

.time img {
  width: 0.48*37*2upx;
  height: 0.48*37*2upx;
  position: absolute;
  right: 0;
  bottom: 0;
}

.time-wrap {
  background: #fff;
}

.time-item {
  box-sizing: border-box;
  width: 50%;
  height: 1.333333*37*2upx;
  border-right: 0.013333*37*2upx solid #eeeeee;
  border-top: 0.013333*37*2upx solid #ffffff;
  border-left: 0.013333*37*2upx solid #ffffff;
  border-bottom: 0.013333*37*2upx solid #eeeeee;
  color: #333333;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  display: inline-block;
  margin-top: 0.2*37*2upx;
}

.time-wrap :nth-child(4) {
  border-right: 0.013333*37*2upx solid #ffffff;
}

.time-wrap :nth-child(8) {
  border-right: 0.013333*37*2upx solid #ffffff;
}

.showcommit {
  position: absolute;
  z-index: 999;
  width: 280*2upx;
}

.active {
  display: inline-block !important;
  /* color: #fff; */
  /* background-color: #00c277 !important; */
  border-right: 0.013333*37*2upx solid #00c277 !important;
  border-bottom: 0.013333*37*2upx solid #00c277 !important;
  border-top: 0.013333*37*2upx solid #00c277 !important;
  border-left: 0.013333*37*2upx solid #00c277 !important;
}

.actives {
  display: inline-block !important;
  color: #fff;
  background-color: #00c277 !important;
  border-right: 0.013333*37*2upx solid #00c277 !important;
  border-bottom: 0.013333*37*2upx solid #00c277 !important;
  border-top: 0.013333*37*2upx solid #00c277 !important;
  border-left: 0.013333*37*2upx solid #00c277 !important;
}

.active1 {
  border-right: 0.013333*37*2upx solid #00c277 !important;
  border-bottom: 0.013333*37*2upx solid #00c277 !important;
  border-top: 0.013333*37*2upx solid #00c277 !important;
  border-left: 0.013333*37*2upx solid #00c277 !important;
}

.time .yiyue {
  color: #348cf2;
}

.time-item p {
  font-size: 0.32*37*2upx;
  margin-top: 0.3*37*2upx;
  font-weight: bold;
}

.time-item span {
  font-size: 0.266667*37*2upx;
  color: #333333;
}

.kind {
  background: #fff;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 0 0.4*37*2upx;
  height: 1.333333*37*2upx;
  /* margin-bottom: 0.266667*37*2upx; */
  /* border-bottom-right-radius: 0.133333*37*2upx;
  border-bottom-left-radius: 0.133333*37*2upx; */
}

.kind_item .round {
  width: 0.32*37*2upx;
  height: 0.32*37*2upx;
  border-radius: 50%;
  background: #cccccc;
  display: inline-block;
  margin-right: 0.266667*37*2upx;
}

.kind span,
.barber-item {
  color: #333333;
  font-size: 0.32*37*2upx;
}

.barber> :last-child {
  margin-left: 3.08*37*2upx;
}

.left {
  margin-right: 3.493333*37*2upx;
}

.kindactive {
  background: #00c277 !important;
}

.new_name {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  height: .8*37*2upx;
}

.barber {
  background: #fff;
  display: flex;
  align-items: center;
  padding: .2*37*2upx 0.533333*37*2upx;
  /* height: 1.333333*37*2upx; */
  /* border-bottom: 0.013333*37*2upx solid #eeeeee;
  border-top-left-radius: 0.133333*37*2upx;
  border-top-right-radius: 0.133333*37*2upx; */
}

.barberactive {
  background: #00c277 !important;
}

/* .tip-s {
    color: #333333;
    font-size: .373333*37*2upx;
    margin-right: .293333*37*2upx;
} */

.barber-item .round {
  width: 0.32*37*2upx;
  height: 0.32*37*2upx;
  border-radius: 0.32*37*2upx;
  background: #cccccc;
  display: inline-block;
  margin-right: 0.266667*37*2upx;
}

.detail {
  /* margin-bottom: 0.266667*37*2upx; */
  background: #fff;
  border-radius: 0.133333*37*2upx;
}

.detail p {
  height: 1.2*37*2upx;
  color: #333333;
  font-size: 0.346667*37*2upx;
  border-bottom: 0.013333*37*2upx solid #eeeeee;
  display: flex;
  align-items: center;
  padding-left: 0.266667*37*2upx;
}

.detail p img {
  width: 0.24*37*2upx;
  height: 0.466667*37*2upx;
  position: absolute;
  right: 0.266667*37*2upx;
  top: 0.36*37*2upx;
}

.detail p input {
  font-size: 0.346667*37*2upx;
  border: 0;
  outline: none;
  color: #333333;
  width: 70%;
  font-weight: 400;
}

.detail p input::-webkit-input-placeholder {
  color: #999;
}

.detail span {
  border: 0;
  outline: none;
  padding-left: 1*37*2upx;
  color: #999;
  font-weight: 400;
}

.part {
  margin-left: 1.066667*37*2upx;
}

.name {
  /* margin-left: 0.666667*37*2upx; */
}

.tel {
  margin-left: 0.32*37*2upx;
}

.detail .last {
  border: none;
}

.maska {
  width: 100%;
  height: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.4);
}

.deptBg {
  width: 100%;
  height: 33%;
  position: fixed;
  bottom: 0;
  left: 0;
  background-color: #fff;
  overflow-y: scroll;
  padding-left: 0.4*37*2upx;
  box-sizing: border-box;
}

.deptBg span {
  width: 100%;
  height: 1.067*37*2upx;
  border-bottom: 0.013333*37*2upx solid #ccc;
  font-size: 0.373*37*2upx;
  color: #333333;
  line-height: 1.067*37*2upx;
  display: block;
}

.deptBg span:last-child {
  border: none;
}

/* 评论 */
.evaluate {
  background: #fff;
  border-radius: 0.133333*37*2upx;
  padding-bottom: 1*37*2upx
}

.evaluate>p {
  font-size: 0.373333*37*2upx;
  color: #333333;
  height: 1.2*37*2upx;
  line-height: 1.2*37*2upx;
  border-bottom: 0.013333*37*2upx solid #eeeeee;
  padding-left: 0.266667*37*2upx;
}

.evaluate .evaluate_item {
  border-bottom: 0.013333*37*2upx solid #eeeeee;
  padding-left: 0.266667*37*2upx;
}

.evaluate .evaluate_item:last-child {
  border: none;
}

.evaluate .evaluate_item .user {
  padding: 0.4*37*2upx 0 0.293333*37*2upx 0;
}

.evaluate .evaluate_item .user .username {
  color: #333333;
  font-size: 0.373333*37*2upx;
  display: inline-block;
  margin-right: 0.266667*37*2upx;
}

.evaluate .evaluate_item .user span {
  display: inline-block;
  vertical-align: middle;
}

.evaluate .evaluate_item .user span img {
  width: 0.413333*37*2upx;
  height: 0.4*37*2upx;
  margin-right: 0.053333*37*2upx;
}

.evaluate .evaluate_item p {
  color: #999999;
  font-size: 0.32*37*2upx;
  word-break: break-all;
  padding-right: 0.4*37*2upx;
  padding-bottom: 0.4*37*2upx;
}

/* iphone 6plus screen-width:414*2upx */
@media only screen and (max-width: 768*2upx) {
  .title-header {
    height: 1.242*37*2upx;
    padding-top: 0.012*37*2upx;
  }
}

@media only screen and (-webkit-device-pixel-ratio: 2) {
  .title-header {
    height: 1.242*37*2upx;
    padding-top: 0.012*37*2upx;
  }
}

/* @media only screen  and (-webkit-device-pixel-ratio: 3) {
    .title-header {
        height: 2.374*37*2upx;
        padding-top: 1.173*37*2upx;

    }
} */