.q-input {
  width: 100%;
  height: .54rem;
  box-sizing: border-box;
  margin: .1rem 0 .04rem .04rem;
  outline: 0;
  border: none;
  border-bottom: .01rem solid silver;
  font-size: .3rem;
  padding: 0 .4rem 0 .12rem;
  color: #212121;
  transition: .5s all ease-in-out;
  cursor: pointer;
}

.q-input:focus {
  border-color: #fb8ead;
}

.q-radio__item {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: .32rem;
  min-height: .6rem;
  cursor: pointer;
  margin-top: .1rem;
}

.q-radio__item.center {
  justify-content: center;
}

.q-radio__item.fill {
  flex-wrap: wrap;
}

.q-radio__item.fill .q-radio__content {
  width: auto;
}

.q-radio__item .q-radio__input_fill {
  margin-bottom: .26rem;
  flex-grow: 1;
}

.q-radio__item .q-radio__input_fill .q-input__item input {
  height: .4rem;
}

.q-radio__content {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  font-size: .32rem;
  min-height: .6rem;
  cursor: pointer;
  flex-shrink: 0;
}

.q-radio__label {
  position: relative;
  width: .34rem;
  height: .34rem;
  border: .01rem solid silver;
  border-radius: 50%;
  margin-right: .1rem;
  transition: all .15s ease-in;
  flex-shrink: 0;
}

.q-radio__label.q-radio__label__only {
  margin-right: 0;
}

.q-radio__label:after {
  position: absolute;
  content: "";
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  border-radius: 50%;
  transition: all .15s ease-in;
  display: block;
  background: rgba(0,0,0,0);
  transition: .3s all;
}

.q-radio__index {
  font-size: .3rem;
  line-height: .34rem;
  margin-top: .01rem;
}

.q-radio__text {
  font-size: .3rem;
  line-height: .4rem;
  min-height: .34rem;
  vertical-align: middle;
  overflow: hidden;
  margin-left: .04rem;
  margin-top: -0.02rem;
  max-width: 5.7rem;
}

.q-radio__item.q-radio__checked .q-radio__label {
  border-color: #fb7299;
}

.q-radio__item.q-radio__checked .q-radio__label:after {
  width: .19rem;
  height: .19rem;
  background: #fb7299;
}

.q-check-box__item {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: .1rem;
}

.q-check-box__item.center {
  justify-content: center;
}

.q-check-box__item.right {
  justify-content: right;
}

.q-check-box__item.fill {
  flex-wrap: wrap;
}

.q-check-box__item.fill .q-check-box__content {
  width: auto;
}

.q-check-box__item .q-check-box__content {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  font-size: .32rem;
  min-height: .6rem;
  cursor: pointer;
  flex-shrink: 0;
}

.q-check-box__item .q-check-box__content .q-check-box__label {
  position: relative;
  width: .34rem;
  height: .34rem;
  border: .01rem solid silver;
  background-color: #fff;
  margin-right: .1rem;
  transition: all .15s ease-in;
  flex-shrink: 0;
}

.q-check-box__item .q-check-box__content .q-check-box__label:after {
  content: "";
  position: absolute;
  left: .1rem;
  top: .04rem;
  height: .16rem;
  width: .08rem;
  border-width: .03rem;
  box-sizing: content-box;
  border-style: solid;
  border-left: 0;
  border-top: 0;
  transform: rotate(45deg) scaleY(0);
  transition: transform .15s ease-in .05s;
  transform-origin: center;
  border-color: #fff;
}

.q-check-box__item .q-check-box__content .q-check-box__index {
  margin-top: -0.02rem;
}

.q-check-box__item .q-check-box__content .q-check-box__text {
  font-size: .3rem;
  line-height: .38rem;
  min-height: .32rem;
  vertical-align: middle;
  overflow: hidden;
  margin-left: .04rem;
  margin-top: 0;
  max-width: 5.7rem;
}

.q-check-box__item.q-check-box__checked .q-check-box__label {
  background-color: #fb7299;
  border-color: #fb7299;
}

.q-check-box__item.q-check-box__checked .q-check-box__label:after {
  transform: rotate(45deg) scaleY(1);
}

.q-check-box__item .q-check-box__input_fill {
  margin-bottom: .26rem;
  flex-grow: 1;
}

.q-check-box__item .q-check-box__input_fill .q-input__item input {
  height: .4rem;
}

.q-textarea {
  width: 100%;
  box-sizing: border-box;
  margin: .1rem 0;
  outline: 0;
  border: .01rem solid silver;
  border-radius: .08rem;
  font-size: .28rem;
  padding: .24rem;
  color: #212121;
  transition: .5s all ease-in-out;
  cursor: pointer;
  overflow: hidden;
  resize: none;
  text-decoration: none;
  font-family: inherit;
}

.q-textarea:focus {
  border-color: #fb8ead;
}

.q-tabel {
  width: 100%;
}

.q-tabel table {
  width: 100%;
  border-collapse: collapse;
}

.q-tabel table thead tr {
  border: .01rem solid #e7e7e7;
}

.q-tabel table thead tr th {
  font-size: .3rem;
  padding: .18rem .05rem;
  font-weight: normal;
  border-left: .01rem solid #e7e7e7;
}

.q-tabel table thead tr thth:first-child {
  border-left: none;
}

.q-tabel table tbody tr {
  border-bottom: .01rem solid #e7e7e7;
  border-right: .01rem solid #e7e7e7;
}

.q-tabel table tbody tr th,
.q-tabel table tbody tr td {
  font-size: .3rem;
  border-left: .01rem solid #e7e7e7;
  padding: .1rem .1rem;
}

.q-tabel table tbody tr th {
  padding: .1rem .05rem;
  font-weight: normal;
  text-align: center;
}

.q-tabel table tbody tr td {
  text-align: center;
}

.q-tabel table tbody tr td .q-radio__item {
  margin-top: 0;
}

.q-tabel table tbody tr td .q-radio__item .q-radio__text {
  line-height: .34rem;
}

.q-end-page-content {
  width: 7rem;
  padding-top: .25rem;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}

.q-end-page-img {
  width: 6rem;
  height: auto;
  background-size: 100% auto;
  background-position: center;
}

.q-end-page-text {
  font-size: .32rem;
  color: #333;
  text-align: center;
}

.q-end-page-button {
  width: 2.4rem;
  height: .9rem;
  line-height: .9rem;
  margin: .8rem auto .2rem auto;
  background-color: #fb7299;
  color: #fff;
  text-align: center;
  border-radius: .16rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: background-color .15s ease;
  font-size: .34rem;
}

.q-end-page-button:hover {
  background-color: #fb8ead;
}

.q-end-page-button:active {
  background-color: #e94b74;
}

.activity-question-dialog-mask {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(0,0,0,.3);
  z-index: 99;
}

.activity-question-dialog-content {
  width: 6rem;
  min-height: 2.6rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-self: center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 99;
  background: #fff;
  transform-origin: 0 0;
  border-radius: .12rem;
  margin: 0 auto;
  overflow: auto;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.activity-question-dialog-content .activity-question-dialog-content-img {
  width: 3.9rem;
  height: 3.38rem;
  display: block;
  margin: 0 auto;
  max-width: 100%;
  border: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.activity-question-dialog-content .activity-question-dialog-content-message {
  margin: 0;
  text-align: center;
  display: block;
  color: #333;
  font-size: .3rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  padding: 0 .2rem;
}

.activity-question-dialog-footer {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  padding: 0;
  margin-top: .3rem;
  color: #212121;
  border-top: .01rem solid #ccc;
}

.activity-question-dialog-footer .activity-question-dialog-footer-button {
  width: 100%;
  min-width: 1.28rem;
  height: .8rem;
  line-height: .8rem;
  font-size: .32rem;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  color: #f25d8e;
}

.dialog-enter,
.dialog-leave-active {
  opacity: 0;
}

.dialog-enter-active,
.dialog-leave-active {
  transition: opacity .5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.dialog-enter-active .activity-dialog-content {
  animation: activity-dialog-open .5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.dialog-leave-active .activity-dialog-content {
  animation: activity-dialog-close .5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

@keyframes activity-dialog-open {
  0% {
    transform: scale(0.5) translate(-50%, -50%);
  }

  75% {
    transform: scale(1.08) translate(-50%, -50%);
  }

  100% {
    transform: scale(1) translate(-50%, -50%);
  }
}

@keyframes activity-dialog-close {
  0% {
    transform: scale(1) translate(-50%, -50%);
  }

  25% {
    transform: scale(1.08) translate(-50%, -50%);
  }

  100% {
    transform: scale(0) translate(-50%, -50%);
  }
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  font-size: .24rem;
  background: #fff;
}

.activity-questions-list-wrap {
  padding-bottom: .4rem;
}

.activity-questions-list-wrap .activity-questions-list {
  padding: 0 .4rem;
}

.activity-questions-list-wrap .question-custom-style {
  color: #fb7299;
  font-weight: bold;
}

.activity-questions-list-wrap .activity-questions-item {
  padding: .2rem 0;
  margin-top: .3rem;
  color: #212121;
}

.activity-questions-list-wrap .activity-questions-item:first-child {
  margin-top: 0;
}

.activity-questions-list-wrap .activity-questions-item .activity-questions-item-required {
  color: #f04c49;
  margin-right: .05rem;
}

.activity-questions-list-wrap .activity-questions-item .activity-questions-item-title {
  padding: .05rem 0;
  margin-bottom: .22rem;
  font-size: .32rem;
}

.activity-questions-list-wrap .activity-questions-item .activity-questions-item-title .title {
  margin-left: .06rem;
}

.activity-questions-list-wrap .activity-questions-item .activity-questions-item-content {
  padding: 0 .1rem;
}

.activity-questions-list-wrap .submit-button-default {
  width: 2.4rem;
  height: .9rem;
  line-height: .9rem;
  margin: .8rem auto .2rem auto;
  background-color: #fb7299;
  color: #fff;
  text-align: center;
  border-radius: .16rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: background-color .15s ease;
  letter-spacing: .08rem;
  text-indent: .08rem;
  font-size: .34rem;
}

.activity-questions-list-wrap .submit-button-default:hover {
  background-color: #fb8ead;
}

.activity-questions-list-wrap .submit-button-default:active {
  background-color: #e94b74;
}

.activity-questions-list-wrap .bottom-button {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 .4rem;
}

.activity-questions-list-wrap .bottom-button .next-page-button,
.activity-questions-list-wrap .bottom-button .prev-page-button {
  width: 2.4rem;
  height: .9rem;
  line-height: .9rem;
  margin: .8rem auto .2rem auto;
  background-color: #fb7299;
  color: #fff;
  text-align: center;
  border-radius: .16rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: background-color .15s ease;
  letter-spacing: .08rem;
  text-indent: .08rem;
  font-size: .34rem;
}

.activity-questions-list-wrap .bottom-button .next-page-button:hover,
.activity-questions-list-wrap .bottom-button .prev-page-button:hover {
  background-color: #fb8ead;
}

.activity-questions-list-wrap .bottom-button .next-page-button:active,
.activity-questions-list-wrap .bottom-button .prev-page-button:active {
  background-color: #e94b74;
}

.activity-questions-list-wrap .page-counter {
  width: 2rem;
  font-size: .3rem;
  color: #333;
  text-align: center;
  margin: .2rem auto .2rem auto;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.activity-questions-list-wrap .submit-button-custom {
  margin: .8rem auto .2rem auto;
  text-align: center;
}

.activity-questions-list-wrap .submit-button-custom img {
  vertical-align: middle;
  border: 0;
}
