wxmini/pages/components/SubIndex/index.wxss

/**index.wxss**/
@import '../../../app.wxss';

.SubContainer {
  background: #fff;
}

.top {
  width: 100%;
  height: 0;
  position: relative;
  overflow: hidden;
  padding-bottom: 60%;
  background: #eee;
}

.topView{
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  bottom: 0;
}

.nav {
  padding: 0 40rpx;
  position: relative;
  overflow: visible;
  margin: 40rpx auto 0;
}

.nav > view {
  width: 100%;
  position: relative;
  overflow: hidden;
  background: #fff;
  padding: 40rpx 0;
  border-radius: 16rpx;
  box-shadow: 0 0 20rpx 10rpx rgba(0, 0, 0, 0.05);
}

.nav > view > view {
  position: relative;
  overflow: hidden;
}

.nav > view > view::after {
  content: '';
  width: 1rpx;
  height: 50%;
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  background: #e4e4e4;
}

.nav > view > view:first-child::after {
  display: none;
}

.nav > view > view image {
  max-width: 44rpx;
  max-height: 44rpx;
  display: block;
  margin: 0 auto;
}

.nav > view > view text {
  width: 100%;
  display: block;
  text-align: center;
  font-size: 26rpx;
  line-height: 38rpx;
  margin-top: 12rpx;
}

.title {
  font-size: 38rpx;
  line-height: 50rpx;
  width: 100%;
  display: block;
  text-indent: 40rpx;
  margin-top: 60rpx;
}

.mapList {
  padding: 0 40rpx;
  position: relative;
  overflow: visible;
  margin-top: 40rpx;
}

.mapList > view {
  width: 100%;
  position: relative;
  overflow: hidden;
  background: #fff;
  padding: 40rpx 0;
  border-radius: 16rpx;
  box-shadow: 0 0 20rpx 10rpx rgba(0, 0, 0, 0.05);
}

.mapList > view > view.flex-item {
  position: relative;
  overflow: hidden;
  margin-left: 40rpx;
}

.mapList > view > view.flex-item::after {
  content: '';
  width: 1rpx;
  height: 100%;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  background: #eee;
}

.mapList > view > view.flex-item text {
  width: 100%;
  display: block;
  white-space: nowrap;
}

.mapList > view > view.flex-item text:nth-child(1) {
  font-size: 32rpx;
  line-height: 52rpx;
  font-weight: bold;
}

.mapList > view > view.flex-item text:nth-child(2) {
  font-size: 22rpx;
  line-height: 46rpx;
}

.mapList > view > view.flex-item text text {
  font-size: 26rpx;
  font-weight: bold;
  color: #e23838;
  display: inline-block;
}

.mapList > view > view:nth-child(2) {
  width: 182rpx;
  position: relative;
  overflow: hidden;
  text-align: center;
}

.mapList > view > view:nth-child(2) text {
  width: 100%;
  display: block;
  text-align: center;
  font-size: 24rpx;
  line-height: 32rpx;
  color: #9d876d;
  font-weight: bold;
  margin-top: 15rpx;
}

.mapList > view > view:nth-child(2) image {
  max-width: 46rpx;
  max-height: 46rpx;
}

.roomList {
  padding: 0 40rpx;
  position: relative;
  overflow: hidden;
}

.roomList > view {
  width: 100%;
  position: relative;
  overflow: visible;
  margin-top: 50rpx;
  border-bottom: 1rpx solid #eee;
}

.roomList > view .img {
  width: 100%;
  height: 0;
  position: relative;
  overflow: hidden;
  z-index: 1;
  border-radius: 10rpx;
  background: #eee;
  padding-bottom: 56%;
}

.roomList > view .img image {
  z-index: 1
}

.roomList > view .img > view {
  width: 100%;
  position: absolute;
  overflow: hidden;
  z-index: 2;
  bottom: 10rpx;
  left: 0;
  align-items: center;
}

.roomList > view .img > view > view {
  white-space: nowrap;
  position: relative;
  overflow: hidden;
  margin-right: 10rpx;
}

.roomList > view .img > view > view text {
  display: inline-block;
  vertical-align: middle;
  padding: 0 10rpx;
  background: #fff;
  line-height: 35rpx;
  border: 2rpx solid #bb9c79;
  border-radius: 6rpx;
  margin-left: 10rpx;
  font-size: 20rpx;
  color: #9D876D;
}

.roomList > view .img > view > text {
  font-size: 22rpx;
  line-height: 35rpx;
  color: #fff;
  white-space: nowrap;
  margin-right: 15rpx;
}

.roomList > view .img > view > image {
  display: inline-block;
  margin-right: 5rpx;
  width: 14rpx;
}

.roomList > view .icon {
  display: inline-block;
  position: absolute;
  z-index: 2;
  top: 28rpx;
  background: #e23838;
  line-height: 40rpx;
  font-size: 20rpx;
  color: #fff;
  padding: 0 24rpx;
  right: -16rpx;
  box-shadow: 0 0 20rpx 10rpx rgba(0, 0, 0, 0.05);
  border-radius: 40rpx;
}

.roomList .info {
  width: 100%;
  position: relative;
  overflow: hidden;
  margin: 20rpx auto 58rpx;
}

.roomList .info > view {
  align-items: center;
}
/* 
.roomList .info > view .marquee{
  animation: geiwogun 2s linear infinite;
	white-space: nowrap;
}

@keyframes geiwogun {
from {
  transform: translate(0, 0);
}
to {
  transform: translate(-50%, 0);
}
}
 */

.roomList .info > view:nth-child(1) > text:nth-child(1) {
  line-height: 52rpx;
  font-size: 33rpx;
  font-weight: bold;
}

.roomList .info > view:nth-child(1) > text:nth-child(2) {
  line-height: 52rpx;
  font-size:22rpx;
  max-width:50%;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.roomList .info > view:nth-child(1) > text text {
  color: #e23838;
  font-size: 28rpx;
  font-weight: bold;
}

.roomList .info > view:nth-child(2) > text {
  line-height: 32rpx;
  font-size: 22rpx;
  color: #666;
}



/* .top {
  width: 100%;
  position: relative;
  overflow: hidden;
}

.bg {
  width: 100%;
  height: 0;
  position: relative;
  overflow: hidden;
  padding-bottom: 60%;
  background: #eee;
  z-index: 1;
}

.imgContent {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
}

.imgContent > swiper {
  width: 100%;
  height: 100%;
}

.nav {
  width: 100%;
  position: relative;
  overflow: visible;
}

.nav > view {
  padding: 0 40rpx;
  position: relative;
  overflow: visible;
}

.top .list {
  width: 100%;
  position: relative;
  overflow: hidden;
  background: #fff;
  border-radius: 20rpx;
  z-index: 2;
  box-shadow: 0 0 20rpx 10rpx rgba(0, 0, 0, 0.05);
  transform: translateY(-135rpx);
  -webkit-transform: translateY(-135rpx);
}

.top .list > view {
  padding: 0 40rpx;
}

.top .list > view > view {
  align-items: center;
  border-top: 1rpx solid #f0f0f0;
}

.top .list > view:first-child > view {
  border: none;
}

.top .list .text {
  margin-left: 25rpx;
  padding: 25rpx 0 20rpx 0;
}

.top .list > view:last-child .text {
  padding-bottom: 25rpx;
}

.top .list .text view {
  align-items: center;
}

.top .list .text view text {
  display: block;
  line-height: 42rpx;
  font-size: 32rpx;
}

.top .list .text > text {
  display: block;
  line-height: 34rpx;
  font-size: 22rpx;
  color: #999;
}

.projectList {
  width: 100%;
  position: relative;
  overflow: visible;
  margin-top: -90rpx;
}

.projectList > text {
  width: 100%;
  display: block;
  font-size: 32rpx;
  line-height: 42rpx;
  text-indent: 40rpx;
  font-weight: bold;
}

.projectList .list {
  width: 100%;
  position: relative;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  white-space: nowrap;
  overflow-y: visible;
  padding: 30rpx 0;
}

.projectList .list::-webkit-scrollbar {
  display: none;
  color: transparent;
  opacity: 0;
}

.projectList .list > view {
  width: 490rpx;
  display: inline-block;
  position: relative;
  overflow: hidden;
  background: #fff;
  border-radius: 20rpx;
  box-shadow: 0 0 20rpx 10rpx rgba(0, 0, 0, 0.05);
  margin-right: 40rpx;
}

.projectList .list > view:first-child {
  margin-left: 40rpx;
}

.projectList .list text {
  padding: 0 20rpx;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.projectList .name {
  font-size: 25rpx;
  line-height: 40rpx;
  margin-top: 18rpx;
  font-weight: bold;
}

.projectList .address {
  font-size: 20rpx;
  line-height: 34rpx;
  color: #666666;
  padding: 0 20rpx;
}

.projectList .address image {
  display: inline-block;
  width: 18rpx;
  margin-right: 5rpx;
  margin-top: 4rpx;
}

.projectList .address text{
  padding: 0 5rpx;
}

.projectList .listImg {
  padding: 20rpx;
  position: relative;
  overflow: hidden;
}

.projectList .listImg > view {
  width: 100%;
  position: relative;
  overflow: hidden;
  background: #eee;
  height: 0;
  border-radius: 10rpx;
  padding-bottom: 60%;
}

.projectList .listImg > view text {
  display: inline-block;
  font-size: 20rpx;
  line-height: 36rpx;
  color: #fff;
  padding: 0 15rpx;
  background: #bb9c79;
  border-radius: 36rpx;
  position: absolute;
  right: 20rpx;
  bottom: 20rpx;
  z-index: 2;
}

.projectList .listImg > view image {
  z-index: 1;
} */