shyaf-artist-platform-miniapp/pages/index/index.wxss

page{
  overflow-x: hidden;
}
/**index.wxss**/
.page-index{
  overflow-x: hidden;
}
.index-slider{
  position: relative;
  height: 530rpx;
}
.index-slider .swiper-box{
  position: relative;
  height: 530rpx;
}
.index-slider .swiper-box .swiper-item{
  height: 530rpx;
}

.index-slider  .index-slider-doc{
  position: absolute;
  z-index:2;
  bottom: 30rpx;
  left: 50%;
  transform: translate(-50%,0);
  white-space: nowrap;
}
.index-slider  .index-slider-doc .item-doc{
  display: inline-block;
   margin: 0 12rpx;
   width: 56rpx;
   height: 6rpx;
   /* background: red; */
   background: rgba(255,255,255,.2);
}
.index-slider  .index-slider-doc .item-doc.active{
  background:#61CDB6;
}

.index-title{
  text-align: center;
  padding: 50rpx 0;
}

.index-title .title{
  font-size:36rpx;
  font-family:Noto Sans S Chinese;
  color:rgba(22,22,22,1);
  line-height:44rpx
}

.index-title .sub-title{
  font-size:22rpx;
  font-family:DengXian;
  color:rgba(22,22,22,1);
  line-height:44rpx
}

.exhibition-list{
  display: flex;
  padding:0 30rpx;
}
.exhibition-list>view{
  flex: 1;
  overflow: hidden;
}

.exhibition-list .item-bg{
  position: relative;
  height: 220rpx;
  background: rgba(1,1,1,.5);
  margin: 0 15rpx;
}
.exhibition-list .item-bg .img-bg{
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.exhibition-list .item-bg .item-icon{
  position: relative;
  height: 63rpx;
  padding-top: 40rpx;
  margin-bottom: 20rpx;
  z-index: 2;
}
.exhibition-list .item-bg .item-icon>image{
  display: block;
  margin: 0 auto;
}

.exhibition-list .item-bg .icon-01{
  width: 64rpx;
  height: 63rpx;
}

.exhibition-list .item-bg .icon-02{
  width: 64rpx;
  height: 63rpx;
}
.exhibition-list .item-bg .item-content{
  position: relative;
  z-index: 2;
}

.exhibition-list .item-bg .name{
  color:rgba(255,255,255,1);
  line-height:44rpx;
  font-size:32rpx;
  color: #fff;
  text-align: center;
}

.exhibition-list .item-bg .text{
  font-size:20rpx;
  color:rgba(255,255,255,1);
  line-height:36rpx;
  text-align: center;
}

.exhibition-list .item{
  display: flex;
  margin: 0 15rpx;
  height:190rpx;
  background:rgba(28,183,150,1);
  align-items: center;
  padding: 0 0 0 20rpx;
}
.exhibition-list .item .icon-01{
  width: 49rpx;
  height: 77rpx;
  margin-top: -10rpx;
}
.exhibition-list .item .icon-02{
  width: 64rpx;
  height: 71rpx;
}

.exhibition-list .item .item-content{
  position: relative;
  z-index: 2;
  white-space: nowrap;
  padding-left: 15rpx;
}
.exhibition-list .item .name{
  color:rgba(255,255,255,1);
  line-height:44rpx;
  font-size:32rpx;
  color: #fff;
}

.exhibition-list .item .text{
  font-size:20rpx;
  color:rgba(255,255,255,1);
  line-height:36rpx;
  text-align: center;
}

.serve-list-box{
  display: flex;
  flex-wrap:wrap;
  margin-bottom: 20rpx;
  margin-right: -3rpx;
}


.serve-list{
  width: 50%;
  display: flex;
  align-items: center;
  padding:30rpx;
  border:1rpx solid rgba(204,209,219,1);
  box-sizing: border-box;
  margin-top: -1rpx;
  margin-left: -1rpx;
}
.serve-list .item-media{
  width: 68rpx;
  height: 68rpx;
  margin-right: 30rpx;
}
/* .serve-list .item-content{

} */

.serve-list .item-content .name{
  font-size:32rpx;
  color: #161616;
  margin-bottom: 10rpx;
}

.serve-list .item-content .text{
  color: #B3B3C1;
  font-size:20rpx;
  white-space: nowrap;
}


.footer-box{
  padding:40rpx 30rpx;
  text-align: center;
}
.footer-box .footer-logo{
  display: block;
  margin: 0 auto 40rpx auto;
  width: 189rpx;
  height: 140rpx;
}
.footer-box .link-a{
  display: inline-block;
  font-size: 28rpx;
  text-decoration: underline;
  color: #C2C2C2;
}