/* packageE/others/skin/skin.wxss */
#skin_home {
  padding-top: 1.25rem;
  min-height: 100vh;
  background-color: #fff;
}

#skin_home .main {
  font-size: 32rpx;
}

#skin_home .main .main-top {
  width: 90%;
  margin: 60rpx auto;
  background-color: #fff;
  box-shadow: 0 0.0313rem 0.375rem 0.0313rem rgba(226, 226, 226, 0.95);
  border-radius: 12rpx;
  color: #fe5a73;
  text-align: center;
}

#skin_home .main .main-top image {
  width: 252rpx;
  height: 252rpx;
  margin: 40rpx auto;
}

#skin_home .main .main-top .h1 {
  font-size: 48rpx;
  font-weight: bold;
  line-height: 60rpx;
}

#skin_home .main .main-top .h3 {
  line-height: 48rpx;
  padding-bottom: 16rpx;
}

#skin_home .main .main-warn {
  text-align: center;
}

#skin_home .main .main-warn .warn-text {
  color: #333;
  line-height: 48rpx;
}

#skin_home .main .main-warn .warn-example {
  color: #fe5a73;
  font-size: 24rpx;
  margin: 24rpx 0 96rpx;
}

#skin_home .main .main-bottom {
  color: #fff;
}

#skin_home .main .main-bottom .bottom-child {
  margin: 32rpx auto 0;
  height: 76rpx;
  line-height: 76rpx;
  width: 408rpx;
  border-radius: 64rpx;
  overflow: hidden;
  background-color: #fe5a73;
  box-shadow: 0rpx 0.0313rem 0.0938rem 0 #fe5a73;
  text-align: center;
}

#skin_home .main .main-bottom .color2 {
  background-color: #fe9d56;
  box-shadow: 0 0.0313rem 0.0938rem 0 #e78740;
}

#skin_home .main .main-agreement {
  text-align: center;
  margin-top: 64rpx;
  display: flex;
  justify-content: center;
  color: #999;
  align-items: center;
}

#skin_home .main .example-popup {
  text-align: center;
}

#skin_home .main .example-popup .example-title {
  color: #333;
  margin-top: 32rpx;
  text-align: left;
  margin-left: 42rpx;
  font-size: 32rpx;
}

#skin_home .main .example-popup image {
  width: 172rpx;
  height: 172rpx;
  margin-top: 32rpx;
}

#skin_home .main .example-popup .example-text {
  font-size: 24rpx;
  color: #666;
  margin: 32rpx 0;
}

#skin_home .main .agreement-popup {
  padding: 32rpx;
}

#skin_home .main .agreement-popup image {
  width: 220rpx;
  height: 180rpx;
  margin-top: 30rpx;
}

#skin_home .main .agreement-popup .h2 {
  font-size: 32rpx;
  color: #161615;
  margin: 28rpx 0;
}

#skin_home .main .agreement-popup .agreement-popup-text {
  text-align: left;
  color: #6e6e6e;
  font-size: 24rpx;
  line-height: 40rpx;
  max-height: 320rpx;
  overflow-y: scroll;
  padding: 10rpx 40rpx 53rpx 42rpx;
}

#skin_home .main .tips-popup {
  color: #fff;
  padding: 0 28rpx;
}

#skin_home .main .tips-popup .h2 {
  font-size: 32rpx;
  padding: 64rpx 0 32rpx;
}

#skin_home .main .tips-popup .tips-popup-text1 {
  font-size: 28rpx;
  line-height: 32rpx;
  margin-bottom: 30rpx;
}

#skin_home .main .tips-popup .tips-popup-text2 {
  font-size: 24rpx;
  padding: 28rpx 0;
}

#skin_home .main .tips-popup .tips-popup-btn {
  width: 240rpx;
  height: 60rpx;
  line-height: 60rpx;
  background-image: linear-gradient(#fe5a73, #fe5a73), linear-gradient(#ec8094, #ec8094);
  box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(165, 79, 25, 0.43);
  border-radius: 32rpx;
  margin: 0 auto;
  text-align: center;
  margin-bottom: 30rpx;
}

#skin_home .main .upload-popup .image-animation {
  width: 300rpx;
  height: 300rpx;
  position: relative;
  margin: 148rpx auto 52rpx;
}

#skin_home .main .upload-popup .image-animation .whirl {
  width: 300rpx;
  height: 300rpx;
  -webkit-animation: haha1 3s linear infinite;
}

#skin_home .main .upload-popup .image-animation .upload-image {
  position: absolute;
  width: 236rpx;
  height: 236rpx;
  top: 50%;
  left: 50%;
  margin-top: -118rpx;
  margin-left: -118rpx;
  border-radius: 100%;
  overflow: hidden;
}

@-webkit-keyframes haha1 {
  0% {
    -webkit-transform: rotate(0deg);
  }

  25% {
    -webkit-transform: rotate(90deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
  }

  75% {
    -webkit-transform: rotate(270deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
  }
}

#skin_home .main .upload-popup .upload-popup-text {
  color: #666;
  font-size: 28rpx;
  line-height: 60rpx;
}

.posicon {
  position: absolute;
  top: 19rpx;
  right: 17rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: solid 2rpx #c7c7c7;
  width: 37rpx;
  height: 37rpx;
}

.posicon van-icon {
  margin-top: 8rpx;
  color: #c7c7c7;
}

.posicon_a {
  position: absolute;
  bottom: -90rpx;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.posicon_b {
  border: solid 2rpx #fff;
  width: 57rpx;
  height: 57rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.posicon_b van-icon {
  color: #fff;
  margin-top: 8rpx;
}

.upload-popup .img-animation {
  width: 300rpx;
  height: 300rpx;
  position: relative;
  margin: 148rpx auto 52rpx;
}

.upload-popup .img-animation .whirl {
  width: 300rpx;
  height: 300rpx;
  -webkit-animation: haha1 3s linear infinite;
}

.upload-popup .img-animation .upload-img {
  position: absolute;
  width: 236rpx;
  height: 236rpx;
  top: 50%;
  left: 50%;
  margin-top: -118rpx;
  margin-left: -118rpx;
  border-radius: 100%;
  overflow: hidden;
}

@-webkit-keyframes haha1 {
  0% {
    -webkit-transform: rotate(0deg);
  }

  25% {
    -webkit-transform: rotate(90deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
  }

  75% {
    -webkit-transform: rotate(270deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
  }
}

.upload-popup .upload-popup-text {
  color: #666;
  font-size: 28rpx;
  line-height: 60rpx;
  text-align: center;
}
