hhsc/unpackage/dist/dev/mp-weixin/pages/index/index.wxss

@charset "UTF-8";
/* 页面左右间距 */
/* 文字尺寸 */
/*文字颜色*/
/* 边框颜色 */
/*颜色*/
/* 图片加载中颜色 */
/* 行为相关颜色 */
/* 功能栏字体大小 */
/*功能栏左侧小图标*/
page,
.center {
  height: auto;
  min-height: 100%;
  background-color: #ffffff;
}
.input-box {
  padding: 25rpx;
  background-color: #0fc8e4;
  height: 44px;
}
.input-box .iconsearch {
  font-size: 50rpx;
}
.input-box .input-content {
  border-radius: 99rpx;
  flex-grow: 1;
  padding: 5rpx 30rpx;
  background: #ffffff;
}
.input-box .input-content .input {
  flex-grow: 1;
}
.input-box .input-content .input input {
  font-size: 28rpx;
}
.input-box .input-button {
  padding-left: 20rpx;
  font-size: 28rpx;
  height: 100%;
}
.top {
  width: 1000rpx;
  height: 240rpx;
  background: linear-gradient(180deg, #08c4e6, #50ead2);
  overflow: hidden;
  text-align: center;
  border-bottom-left-radius: 50%;
  border-bottom-right-radius: 50%;
  margin-left: -125rpx;
}
.carousel {
  width: 700rpx;
  height: 300rpx;
  border-radius: 14rpx;
  margin: 0 auto;
  margin-top: calc(-260rpx + 25px);
}
.carousel .bor {
  border-radius: 14rpx;
}
.carousel .bor .carousel-item image {
  width: 100%;
  height: 100%;
  border-radius: 14rpx;
}
.swiper-dot {
  position: relative;
  z-index: 10;
  margin-top: -40rpx;
  display: flex;
  justify-content: center;
}
.swiper-dot .swiper-dots-item {
  width: 14rpx;
  height: 14rpx;
  background: #aaaaaa;
  border-radius: 50%;
  margin: 0 16rpx;
}
.swiper-dot .action {
  background-color: #ffffff;
}
.cate-section {
  display: flex;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
  padding: 40rpx 22rpx;
  /* 原图标颜色太深,不想改图了,所以加了透明度 */
}
.cate-section .cate-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 28rpx;
  color: #303133;
}
.cate-section .cate-font {
  margin-top: -26rpx;
}
.cate-section image {
  width: 150rpx;
  height: 150rpx;
  margin-bottom: 14rpx;
  border-radius: 50%;
}
.xian {
  width: 750rpx;
  height: 20rpx;
  background: #f5f5f5;
}
.main {
  margin-top: 40rpx;
  padding: 0 40rpx;
}
.main .main-top {
  align-items: center;
}
.main .main-top .main-left {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.main .main-top .main-left .shu {
  width: 8rpx;
  height: 38rpx;
  background: #05ab81;
  border-radius: 4rpx;
}
.main .main-top .main-left .main-title {
  margin-left: 10rpx;
  font-size: 36rpx;
  font-family: PingFang SC;
  font-weight: bold;
  color: #202739;
}
.main .main-top .main-left .main-tip {
  font-size: 22rpx;
  font-family: PingFang SC;
  font-weight: bold;
  color: #95a0b1;
  margin-left: 14rpx;
}
.guess-item {
  display: flex;
  width: 710rpx;
  height: 290rpx;
  background: #ffffff;
  box-shadow: 0px 0px 20rpx 0px rgba(50, 50, 52, 0.06);
  border-radius: 10rpx;
  padding: 15rpx;
  padding-bottom: 150rpx;
  margin: 20rpx auto 0;
  position: relative;
}
.guess-item image {
  width: 260rpx;
  height: 260rpx;
  border-radius: 10rpx;
}
.guess-item .guess-box {
  padding: 12rpx 0 0 24rpx;
  width: 436rpx;
}
.guess-item .guess-box .title {
  font-size: 30rpx;
  padding-left: 4rpx;
  font-family: PingFang SC;
  font-weight: 500;
  color: #333333;
  width: 368rpx;
  line-height: 36rpx;
}
.guess-item .guess-box .title .tuanF {
  display: inline-block;
  margin-right: 4rpx;
  position: relative;
  top: -6rpx;
}
.guess-item .guess-box .title .tuanF .tuan {
  display: flex;
  align-items: center;
  padding: 10rpx;
  height: 36rpx;
  background: #ffebe9;
  border-radius: 18rpx;
}
.guess-item .guess-box .title .tuanF .tuan .tuan-image {
  width: 18rpx;
  height: 18rpx;
}
.guess-item .guess-box .title .tuanF .tuan .tuan-font {
  display: inline;
  font-size: 20rpx;
  font-family: PingFang SC;
  font-weight: 500;
  color: #ff1135;
  margin-left: 2rpx;
}
.guess-item .guess-box .ping-box {
  margin-top: 15rpx;
  justify-content: flex-start;
}
.guess-item .guess-box .ping-box .ping {
  margin-left: 10rpx;
  height: 39rpx;
  background: #fdf7eb;
  border-radius: 5rpx;
  font-size: 22rpx;
  font-family: PingFang SC;
  font-weight: 500;
  color: #ff911f;
  display: flex;
  align-items: center;
  padding: 0 10rpx;
}
.guess-item .guess-box .price-box {
  margin-top: 80rpx;
  justify-content: flex-start;
}
.guess-item .guess-box .price-box .yuanprice {
  font-size: 26rpx;
  font-family: PingFang SC;
  font-weight: 500;
  text-decoration: line-through;
  color: #999999;
  padding-right: 6rpx;
}
.guess-item .guess-box .price-box image {
  width: 14rpx;
  height: 16rpx;
}
.guess-item .guess-box .price-box .jiang {
  padding-left: 2rpx;
  font-size: 24rpx;
  font-family: PingFang SC;
  font-weight: bold;
  color: #b59467;
}
.guess-item .guess-box .price {
  font-size: 36rpx;
  font-family: PingFang SC;
  font-weight: bold;
  color: #ff1135;
}
.guess-item .guess-box .btn {
  width: 137rpx;
  height: 56rpx;
  background: #16cc9f;
  border-radius: 28rpx;
  font-size: 28rpx;
  font-family: PingFang SC;
  font-weight: 500;
  color: #ffffff;
  line-height: 56rpx;
  text-align: center;
  position: absolute;
  bottom: 25rpx;
  right: 25rpx;
}
.popup {
  width: 640rpx;
  background-color: #ffffff;
  border-radius: 15rpx;
  text-align: center;
}
.popup .popup-dox {
  position: relative;
  top: -60rpx;
}
.popup .popup-dox .popup-logo {
  width: 460rpx;
  height: 132rpx;
}
.popup .popup-dox .pop-title {
  font-size: 40rpx;
  font-weight: bold;
  color: #333333;
  padding: 25rpx 0rpx;
  margin-bottom: 50rpx;
}
.popup .popup-dox .popup-text {
  width: 400rpx;
  height: 400rpx;
  margin-bottom: 50rpx;
}
.popup .popup-dox .btn {
  width: 300rpx;
  height: 50rpx;
  line-height: 50rpx;
  background: #96e4f2;
  margin: 0 auto;
  color: #ffffff;
  border-radius: 25rpx;
}
.popup .popup-dox .pop-tip {
  font-size: 30rpx;
  font-weight: 500;
  color: #333333;
  justify-content: center;
  margin-top: 20rpx;
}
.popup .popup-dox .pop-tip .weixin {
  width: 48rpx;
  height: 40rpx;
  margin-right: 14rpx;
}
.popup .popup-dox .pop-tip .weixin image {
  width: 48rpx;
  height: 40rpx;
}
.close_icon {
  width: 60rpx;
  height: 60rpx;
  margin: 88rpx auto 0;
}
.close_icon image {
  width: 100%;
  height: 100%;
}