.navIndex {
  padding: 0.46rem 0.32rem 0.2rem;
}
.navIndex > img {
  width: 4.87rem;
  display: block;
  margin: 0 auto 0.2rem auto;
}
.navIndex > a {
  display: block;
  margin-bottom: 0.5rem;
}
/* ------ 在线预约-首页 ------ */
.bookIndex {
  height: 100vh;
  overflow: hidden;
  padding: 0 0.36rem;
  background: url("../images/onlineBooking/bg1.png") no-repeat left top / cover;
}
.bookIndex ul {
  position: fixed;
  width: 100%;
  left: 0;
  top: 4.1rem;
  height: 74vh;
  overflow-y: auto;
  padding-bottom: 1.2rem;
}
.bookIndex ul > a {
  display: block;
  width: 6.72rem;
  height: 2.06rem;
  margin: 0 auto;
  background: url("../images/jyz-list-bg.png") no-repeat left top / 100%;
  padding: 0.26rem 0.28rem;
}
.bookIndex ul li {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background: url("../images/icon-r4.png") no-repeat 98% center / 0.3rem;
}
.bookIndex ul li .img {
  width: 2.16rem;
  height: 1.36rem;
}
.bookIndex ul li .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.bookIndex ul li .info {
  padding-left: 0.24rem;
  color: #41a0e8;
  font-weight: 800;
  font-size: 0.4rem;
}
.bookIndex ul li .info small {
  color: rgba(117, 196, 255, 0.8);
  font-size: 0.28rem;
  font-weight: 500;
}
.bookIndex ul li .info h3 {
  font-size: 0.2rem;
  color: rgba(129, 178, 234, 0.7);
}
.bookIndex .toSuggest {
  margin-top: 0.4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 0.24rem;
}
.bookIndex .toSuggest span {
  background-color: #fff;
  padding: 0.04rem 0.2rem;
  border-radius: 0.2rem;
  font-size: 0.22rem;
  color: #41a0e8;
}
.online-suggest {
  padding: 0.35rem 0.4rem;
}
.online-suggest .box {
  border-bottom: 1px solid #ece8e8;
}
.online-suggest .box .count {
  text-align: right;
  padding: 0 0.2rem 0.2rem;
}
.online-suggest textarea {
  width: 100%;
  border: 0;
  min-height: 3.5rem;
  font-size: 0.26rem;
}
.online-suggest textarea::placeholder {
  color: #bebebe;
}
.online-suggest .btn-sub {
  position: fixed;
  bottom: 1rem;
  left: 22.5%;
  width: 4.18rem;
  height: 0.88rem;
  line-height: 0.88rem;
  text-align: center;
  font-size: 0.3rem;
  color: #fff;
  background: linear-gradient(-77deg, #44c0fd, #3ca2f4);
  box-shadow: 0rem 0rem 0.24rem 0rem rgba(104, 115, 121, 0.22);
  border-radius: 0.44rem;
}
.xlga {
  text-align: center;
  padding-bottom: 1.6rem;
  position: relative;
}
.xlga > img {
  width: 100%;
  display: block;
  margin: 0 auto;
  margin-bottom: 0.16rem;
}
.xlga h2 {
  font-weight: bold;
  font-size: 0.32rem;
  text-align: center;
  border-radius: 0.4rem 0.4rem 0 0;
  background-color: #fff;
  position: fixed;
  z-index: 11;
  top: 3.55rem;
  left: 0;
  width: 100%;
  padding: 0.1rem 0 0.18rem;
}
.xlga h2 img {
  display: block;
  width: 0.24rem;
  margin: 0.08rem auto 0;
  animation: ani1 3s infinite alternate;
}
.xlga .mescroll {
  background-color: #fff;
  position: fixed;
  z-index: 10;
  top: 4.2rem;
  bottom: 0;
  height: auto;
  /*如设置bottom:50px,则需height:auto才能生效*/
  padding: 0.5rem 0;
}
.list {
  background-color: #fff;
  text-align: left;
}
.list > a {
  display: inline-block;
  box-sizing: border-box;
  width: 49.8%;
  padding: 0px 0.22rem;
  margin-bottom: 0.26rem;
  overflow: hidden;
}
.list > a:nth-of-type(2n-1) {
  padding-right: 0.11rem;
}
.list > a:nth-of-type(2n) {
  padding-left: 0.11rem;
}
.list .item-inner {
  box-shadow: 0px 0px 14px 1px rgba(205, 203, 203, 0.35);
  overflow: hidden;
  background-color: #fff;
  border-radius: 0.1rem;
}
.list .img {
  width: 100%;
  height: 2.64rem;
}
.list .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.list .title {
  background-color: #fff;
  padding: 0.24rem 0.1rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: justify;
}
.list .title2 {
  font-size: 14px;
  height: 35px;
  line-height: 1.3;
  background-color: #fff;
  padding: 0rem 0.14rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-align: justify;
  margin: 0.2rem auto;
}
.clear {
  clear: both;
}
.booking {
  z-index: 10;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1.6rem;
  background-color: #fff;
  text-align: center;
  padding-top: 0.35rem;
}
.booking button {
  border: 0;
  width: 6.32rem;
  height: 0.9rem;
  color: #fff;
  background: linear-gradient(-77deg, #44c0fd, #3ca2f4);
  box-shadow: 0rem 0rem 0.24rem 0rem rgba(104, 115, 121, 0.22);
  border-radius: 0.44rem;
  font-size: 0.3rem;
}
.bookPop {
  height: 90vh;
  box-shadow: 0px 3px 29px 3px rgba(0, 0, 0, 0.16);
  padding: 0.1rem 0.36rem;
  z-index: 11;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  overflow-y: auto;
}
.bookPop .close2 {
  text-align: right;
}
.bookPop .close2 span {
  display: inline-block;
  width: 0.45rem;
  line-height: 0.42rem;
  border-radius: 50%;
  font-size: 0.24rem;
  border: 1px solid #44c0fd;
  text-align: center;
  color: #44c0fd;
}
.bookPop .list {
  margin-bottom: 0.28rem;
}
.bookPop .list li {
  font-size: 0.3rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.36rem 0.04rem;
  border-bottom: 1px solid rgba(100, 100, 100, 0.1);
}
.bookPop .list li span:nth-of-type(1) {
  display: inline-block;
  min-width: 6em;
  color: rgba(100, 100, 100, 0.9);
}
.bookPop .list li span:nth-of-type(2) {
  color: #000;
  display: inline-block;
  width: 100%;
  text-align: right;
}
.bookPop .list li span:nth-of-type(2) input {
  width: 100%;
  text-align: right;
  border: 0;
}
.bookPop .list li select {
  border: 0;
  text-align-last: right;
}
.bookPop .list li select option {
  direction: ltr;
}
.bookPop .wrapper02 {
  position: relative;
  height: 1rem;
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  background: #fff;
}
.bookPop .wrapper02 .scroller {
  position: absolute;
  display: flex;
  justify-content: flex-start;
}
.bookPop .wrapper02 .scroller li {
  color: #333;
  float: left;
  font-size: 0.26rem;
  text-align: center;
  width: 1.25rem;
  height: 1rem;
  margin-right: 0.2rem !important;
  border: 1px solid rgba(220, 220, 220, 0.5);
  border-radius: 0.06rem;
  padding-top: 0.08rem;
}
.bookPop .wrapper02 .scroller li.cur {
  border: 1px solid #3ca2f4;
}
.bookPop .wrapper02 .scroller li.cur p {
  color: #3ca2f4;
}
.bookPop .wrapper02 .scroller li.cur span {
  color: #3ca2f4;
}
.bookPop h2 {
  font-size: 0.32rem;
  font-weight: 600;
  color: #000;
  margin-bottom: 0.2rem;
}
.bookPop .amPm {
  margin-top: 0.22rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.26rem;
}
.bookPop .amPm span {
  border: 1px solid rgba(220, 220, 220, 0.5);
  display: inline-block;
  width: 48.6%;
  text-align: center;
  border-radius: 0.06rem;
  font-size: 0.26rem;
  padding: 0.24rem;
}
.bookPop .amPm span.active {
  color: #3ca2f4;
  background-color: rgba(60, 162, 244, 0.1);
  border: 1px solid #3ca2f4;
}
.bookPop .reason {
  width: 100%;
  border: 1px solid rgba(220, 220, 220, 0.8);
  padding: 0.14rem;
  font-size: 0.3rem;
}
.bookPop .reason::placeholder {
  color: rgba(202, 202, 202, 0.8);
}
.bookPop button {
  margin: 0.2rem auto;
  border: 0;
  width: 6.32rem;
  height: 0.9rem;
  color: #fff;
  background: linear-gradient(-77deg, #44c0fd, #3ca2f4);
  box-shadow: 0rem 0rem 0.24rem 0rem rgba(104, 115, 121, 0.22);
  border-radius: 0.44rem;
  font-size: 0.3rem;
}
.mask {
  position: fixed;
  z-index: 2000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.3);
}
.mask .box {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.mask .box .content {
  background-color: #fff;
  width: 5.45rem;
  height: 5.88rem;
  background: #ffffff;
  border-radius: 0.27rem;
  text-align: center;
  padding-top: 0.8rem;
  position: relative;
}
.mask .box .content img {
  width: 2.7rem;
  display: inline-block;
}
.mask .box .content h3 {
  font-size: 0.34rem;
  font-weight: 600;
  color: #000;
  margin-bottom: 0.2rem;
}
.mask .box .content span {
  font-size: 0.28rem;
  color: rgba(128, 128, 128, 0.8);
}
.mask .box .content button {
  width: 3.5rem;
  height: 0.8rem;
  border: 0;
  color: #fff;
  background: linear-gradient(-77deg, #44c0fd, #3ca2f4);
  box-shadow: 0rem 0rem 0.24rem 0rem rgba(104, 115, 121, 0.22);
  border-radius: 0.44rem;
  font-size: 0.3rem;
  margin-top: 0.6rem;
}
.mask .box .content .popClose {
  width: 0.6rem;
  height: 0.6rem;
  line-height: 0.5rem;
  font-size: 0.32rem;
  font-weight: 600;
  border-radius: 50%;
  text-align: center;
  border: 2px solid #fff;
  color: #fff;
  position: absolute;
  bottom: -1rem;
  left: 44%;
}
@keyframes ani1 {
  0% {
    -webkit-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
  }
  50% {
    -webkit-transform: translate(0px, 0px);
    transform: translate(0px, 0.08rem);
  }
  100% {
    -webkit-transform: translate(0px, 10px);
    transform: translate(0px, 0rem);
  }
}