.c-container {
    box-sizing: border-box;
    line-height: 34px;
    height: 34px;
    font-size: 13px;
    white-space: nowrap;
}
.view.common{
  color: dimgray;
  text-align: center;
  display: inline-block;
  height: 34px;
  line-height: 34px;
}
.view.c-nav {
  box-sizing: border-box;
  border-bottom: 2px solid transparent;
  transition: all 0.26s ease;
}
.view.c-nav.active{
    color: #0080f0;
    font-size: 15px;
    border-bottom: 2px solid #0080f0;
}
.view.c-plain{
  transition: all 0.26s ease;
}
.view.c-plain.active{
  color: #0080f0;
  font-size: 15px;
}
.view.c-cap{
border-radius: 36px;
background: #dbdbdb;
padding: 0 14px
}
.view.c-cap.active{
  background: #00a0f0;
  color: white;
}

.view.c-line{
  position: relative;
}
.text.c-line{
  display: flex;
  justify-content: center;
  transition: all 0.26s ease;
}
.text.c-line.active{
  font-size: 15px;
  color: #0080f0;
}
.text.c-line::after{
 transition: all 0.26s ease;
 width: 0px;
 height: 3.2px;
 position: absolute;
 content: "";
 bottom: 0;
 border-radius: 10px;
}
.text.c-line.active::after{
  width: 22px;
  background: #00a0f0;
}