@charset "UTF-8";
/**
 * 下方引入的为Tuniao UI的集成样式文件，为scss预处理器，其中包含了一些"tn-"开头的自定义变量
 * 使用的时候，请将下面的一行复制到您的uniapp项目根目录的uni.scss中即可
 * Tuniao UI自定义的css类名和scss变量，均以"tn-"开头，不会造成冲突，请放心使用 
 */
.tn-steps.data-v-e96e5408 {
  display: flex;
  flex-direction: row;
}
.tn-steps__item.data-v-e96e5408 {
  flex: 1;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  min-width: 100rpx;
  font-size: 28rpx;
  text-align: center;
}
.tn-steps__item__number.data-v-e96e5408 {
  position: relative;
  width: 44rpx;
  height: 44rpx;
  line-height: calc(44rpx - 2rpx);
  border: 1px solid #AAAAAA;
  border-radius: 50%;
  overflow: hidden;
  transition: all 0.3s linear;
}
.tn-steps__item__number__text.data-v-e96e5408 {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  transition: inherit;
  -webkit-transform: translateY(-44rpx);
          transform: translateY(-44rpx);
}
.tn-steps__item__number__text--visible.data-v-e96e5408 {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.tn-steps__item__number__icon.data-v-e96e5408 {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  color: #FFFFFF;
  transition: all 0.3s linear;
  -webkit-transform: translateY(44rpx);
          transform: translateY(44rpx);
}
.tn-steps__item__number__icon--visible.data-v-e96e5408 {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.tn-steps__item__dot.data-v-e96e5408 {
  width: 20rpx;
  height: 20rpx;
  display: flex;
  flex-direction: row;
  border-radius: 50%;
  transition: all 0.3s linear;
}
.tn-steps__item__dot--icon.data-v-e96e5408 {
  width: 44rpx;
  height: 44rpx;
}
.tn-steps__item__icon.data-v-e96e5408 {
  width: 44rpx;
  height: 44rpx;
  font-size: 44rpx;
  transition: all 0.3s linear;
}
.tn-steps__item__dot-icon.data-v-e96e5408 {
  width: 44rpx;
  height: 44rpx;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  transition: all 0.3s linear;
}
.tn-steps__item__dot-icon--dot.data-v-e96e5408 {
  width: 20rpx;
  height: 20rpx;
  border-radius: 50%;
  transition: inherit;
}
.tn-steps__item__dot-icon--icon.data-v-e96e5408 {
  width: 44rpx;
  height: 44rpx;
  font-size: 44rpx;
  transition: inherit;
}
.tn-steps__item__text.data-v-e96e5408 {
  transition: all 0.3s linear;
}
.tn-steps__item__text--row.data-v-e96e5408 {
  margin-top: 14rpx;
}
.tn-steps__item__text--column.data-v-e96e5408 {
  margin-left: 14rpx;
}
.tn-steps__item__line.data-v-e96e5408 {
  position: absolute;
  z-index: 0;
  vertical-align: middle;
  transition: all 0.3s linear;
}
.tn-steps__item--row.data-v-e96e5408 {
  display: flex;
  flex-direction: column;
}
.tn-steps__item--row .tn-steps__item__line.data-v-e96e5408 {
  border-bottom-width: 1px;
  border-bottom-style: solid;
  width: 50%;
  left: 75%;
}
.tn-steps__item--row .tn-steps__item__line--dot.data-v-e96e5408 {
  top: calc(20rpx / 2);
}
.tn-steps__item--row .tn-steps__item__line--number.data-v-e96e5408, .tn-steps__item--row .tn-steps__item__line--icon.data-v-e96e5408, .tn-steps__item--row .tn-steps__item__line--dotIcon.data-v-e96e5408 {
  top: calc(44rpx / 2);
}
.tn-steps__item--column.data-v-e96e5408 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  min-height: 120rpx;
}
.tn-steps__item--column .tn-steps__item__line.data-v-e96e5408 {
  border-left-width: 1px;
  border-left-style: solid;
  height: 50%;
  top: 75%;
}
.tn-steps__item--column .tn-steps__item__line--dot.data-v-e96e5408 {
  left: calc(20rpx / 2);
}
.tn-steps__item--column .tn-steps__item__line--number.data-v-e96e5408, .tn-steps__item--column .tn-steps__item__line--icon.data-v-e96e5408, .tn-steps__item--column .tn-steps__item__line--dotIcon.data-v-e96e5408 {
  left: calc(44rpx / 2);
}