
/* base */

html, body {
  height: 100%;
  margin: 0;
  background-color: #FFFFFF;
}

/* reset */

h4 {
  font-weight: normal;
}

ul {
  margin: 0;
  list-style: none;
}


body {
  padding-bottom: 5.2rem /* 240/75 */;
}

/* customer */

.tq-g-header {
  width: 100%;
  padding-bottom: 26.66666667%;
  background-image: url("../img/answer_question/bg_anwser@2x.png");
  background-size: cover;
  background-position: right;
  border-radius: 0 0 0.5rem 0.5rem;
  -webkit-border-radius: 0 0 0.5rem 0.5rem;
  font-weight: bold;
  position: relative;
}

.tq-m-question-count {
  position: absolute;
  top: 50%;
  left: .8rem/* 60/75 */
;
  transform: translateY(-50%);
}

.tq-m-question-count strong {
  font-size: 1.333333rem/* 100/75 */
;
  color: #121212;
}

.tq-m-question-count span {
  font-size: .533333rem/* 40/75 */
;
}

.tq-m-question {
  padding-top: .746667rem/* 56/75 */
;
  padding-left: .613333rem/* 46/75 */
;
  padding-right: .613333rem/* 46/75 */
;
  position: relative;
}

.tq-m-question h4 {
  color: #121212;
  font-size: .426667rem/* 32/75 */
;
}

.question-type {
  font-size: .32rem/* 24/75 */
;
  color: #999999;
  margin-left: .2rem/* 5/75 */
;
}

.tq-m-question-content {
  color: #333333;
  font-size: .373333rem/* 28/75 */
;
  background: rgba(255, 255, 255, 1);
  border-radius: .266667rem/* 20/75 */
;
  box-shadow: 0 0.133333rem 0.33333rem 0 rgba(56, 54, 33, 0.07);
  -webkit-box-shadow: 0 0.133333rem 0.33333rem 0 rgba(56, 54, 33, 0.07);
  padding-bottom: 1.866667rem/* 140/75 */
;
  padding-top: .76rem/* 57/75 */
;
}

.tq-m-question-content li {
  margin-bottom: .1rem/* 56/75 */
;
  padding: .4rem/* 30/75 */
;
}

.tq-m-question-content li.active {
  background-color: #ffd86d;
  font-weight: 700;
}

.tq-m-question-content .next-btn {
  position: absolute;
  color: #FFFFFF;
  font-size: .426667rem/* 32/75 */
;
  bottom: 0;
  left: 50%;
  text-align: center;
  margin-left: -1.6rem;
  margin-bottom: -0.5555rem;
  width: 3.2rem/* 240/75 */
;
  line-height: 1.066667rem;
  height: 1.066667rem/* 80/75 */
;
  background-color: #eeeeee;
  border-radius: .533333rem/* 40/75 */
;
  box-shadow: 0px 10px 25px 0px rgba(56, 54, 33, 0.07);
}

.next-btn.active {
  background: linear-gradient(-90deg, rgba(57, 106, 252, 1), rgba(19, 132, 255, 1));
}

/*  */

.pop-up {
  position: fixed;
  left: .666667rem/* 50/75 */;
  right: .666667rem/* 50/75 */;
  top: 6.813333rem/* 511/75 */;
  min-height: 4.16rem/* 312/75 */;
  border-radius: .213333rem/* 16/75 */;
  background-color: rgba(255, 255, 255, 1);
  z-index: 9999;
  display: none;
}

.pop-up header {
  min-height: 2.826667rem/* 212/75 */
;
  font-size: .426667rem/* 32/75 */
;
  color: #333333;
}

.pop-up header p {
  margin-left: .56rem/* 42/75 */
;
}

.pop-up header p:first-child {
  padding-top: .746667rem/* 56/75 */
;
  padding-bottom: .466667rem/* 35/75 */
;
}

.pop-up header .em-txt {
  margin-bottom: .786667rem/* 59/75 */
;
}

.pop-up footer {
  height: 1.333333rem/* 100/75 */
;
  font-size: .48rem/* 36/75 */
;
  line-height: 1.333333rem;
  border-radius: .213333rem/* 16/75 */
;
  overflow: hidden;
  /* 裁掉溢出的部分 */
  background-color: rgba(250, 250, 250, 1);
}

.pop-up a {
  height: 100%;
  text-align: center;
  background-color: rgba(255, 255, 255, 1);
  border: solid 1px #E5E5E5;
}

.pop-up a.disable {
  color: #999999;
}

.pop-up a:first-child {
  width: 50%;
  float: left;
}

.pop-up a:last-child {
  float: right;
  width: 48.77%;
  border-left: 0;
}

.pop-up-with-title {
  background: rgba(255, 255, 255, 1);
  position: fixed;
  left: .266667rem/* 20/75 */;
  right: .266667rem/* 20/75 */;
  top: 2.626667rem/* 197/75 */;
  bottom: 2.36rem/* 177/75 */;
  border-radius: .213333rem/* 16/75 */;
  border: solid 1px #ccc;
  z-index: 9999;
  display: none;
  height: auto;
}

.pop-up-with-title header {
  height: 1.173333rem/* 88/75 */
;
  text-align: center;
  color: #BE4C00;
  font-size: .426667rem/* 32/75 */
;
  line-height: 1.173333rem;
  background: rgba(255, 216, 109, 1);
  border-radius: .213333rem .213333rem 0 0/* 16/75 */
;
}

.pop-up-with-title main {
  position: absolute;
  top: 1.1733333rem;
  /* 清理与style.css重叠样式 */
  margin: 0;
  width: 100%;
  height: auto;
  bottom: 1.173333rem/* 88/75 */
;
}

.pop-up-with-title section {
  margin: .413333rem .44rem .386667rem 0.44rem;
  /* 清理与style.css重叠样式 */
  padding: 0;
  position: relative;
  height: 44%;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
}

.pop-up-with-title section:first-child {
  border-bottom: dashed 1px rgba(204, 204, 204, 1);
}

.pop-up-with-title section h4 {
  font-size: .373333rem/* 28/75 */
;
  margin-bottom: .32rem/* 24/75 */
;
  position: absolute;
  width: 100%;
  z-index: 999;
  background-color: #fff;
}

.pop-up-with-title section h4.pri-title {
  color: #1384FF;
}

.pop-up-with-title section h4.sed-title {
  color: #FF1382;
}

.pop-up-with-title section p {
  font-size: .373333rem/* 28/75 */
;
  margin-bottom: .44rem;
}

.pop-up-with-title footer {
  position: absolute;
  width: 100%;
  bottom: 0;
  height: 1.066667rem/* 80/75 */
;
  font-size: .426667rem/* 32/75 */
;
  color: #333333;
  text-align: center;
  font-weight: bold;
  line-height: 1.066667rem;
  border-top: solid 1px rgba(204, 204, 204, 1);
}

.layer {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 1);
  opacity: 0.6;
  display: none;
  z-index: 999;
}

.tq-m-question-header {
  width: 100%;
  color: #C8124E;
  background-image: url("../img/wrong_answer_list/bg_wrong_question@2x.png");
}

.tq-m-question-header strong {
  color: #C8124E;
}

.tq-m-key-title-wrap {
  text-align: center;
}

.tq-m-question-content {
  padding-bottom: .4rem/* 30/75 */
  ;
}

.tq-m-question h3 {
  display: inline-block;
  font-size: .48rem/* 36/75 */
  ;
  margin-bottom: .48rem/* 36/75 */
  ;
  color: #121212;
  border-bottom: solid 2px #FFD86D;
}

.tq-g-key-item div span {
  margin: 0 .133333rem/* 10/75 */
  ;
}

.tq-g-key-item .your-choice {
  color: #FD1483;
}

.tq-g-key-item .right-choice {
  color: #1384FF;
}

.tq-g-key-item a {
  float: right;
  line-height: 0.9rem;
  padding-left: .36rem/* 27/75 */
  ;
  padding-right: .84rem/* 63/75 */
  ;
  height: .8rem/* 60/75 */
  ;
  background: rgba(255, 216, 109, 1);
  border-radius: .106667rem /* 8/75 */;
  color: #BE4C00;
  font-size: .373333rem/* 28/75 */
  ;
  background-image: url("../icons/icon_anwser_slices/icon_anwser@2x.png");
  background-repeat: no-repeat;
  background-position: 85% 56%;
  background-size: .346667rem/* 26/75 */
  .373333rem/* 28/75 */
  ;
}

.pop-up-with-title {
  background: rgba(255, 255, 255, 1);
  position: fixed;
  left: .266667rem/* 20/75 */
  ;
  right: .266667rem/* 20/75 */
  ;
  top: 2.626667rem/* 197/75 */
  ;
  bottom: 2.36rem/* 177/75 */
  ;
  border-radius: .213333rem/* 16/75 */
  ;
  border: solid 1px #ccc;
  z-index: 9999;
  display: none;
  height: auto;
}

.pop-up-with-title header {
  height: 1.173333rem/* 88/75 */
  ;
  text-align: center;
  color: #fff;
  font-size: .426667rem/* 32/75 */
  ;
  line-height: 1.173333rem;
  background: linear-gradient(-90deg, rgba(255, 31, 104, 1), rgba(255, 91, 68, 1));
  border-radius: .213333rem .213333rem 0 0/* 16/75 */
  ;
  overflow: hidden;
}

.pop-up-with-title main {
  position: absolute;
  top: 1.1733333rem;
  width: 100%;
  bottom: 1.173333rem/* 88/75 */
  ;
}

.pop-up-with-title section {
  height: 46.806%;
  overflow: scroll;
  padding-bottom: .333333rem /* 10/75 */;
  margin: 0;
  padding-left: .413333rem /* 31/75 */;
  -webkit-overflow-scrolling: touch;
}

.pop-up-with-title section:first-child {
  border-bottom: dashed 1px rgba(204, 204, 204, 1);
}

.pop-up-with-title section h4 {
  font-size: .373333rem/* 28/75 */
  ;
  margin-bottom: .32rem/* 24/75 */
  ;
  margin-top: .44rem /* 33/75 */;
  width: 90%;
}

.pop-up-with-title section h4.pri-title {
  color: #1384FF;
}

.pop-up-with-title section h4.sed-title {
  color: #FF1382;
}

.pop-up-with-title section p {
  font-size: .373333rem/* 28/75 */
  ;
  margin-bottom: .44rem;
  margin-top: 1.173333rem /* 88/75 */;
}

.pop-up-with-title footer {
  position: absolute;
  width: 100%;
  bottom: 0;
  height: 1.066667rem/* 80/75 */
  ;
  font-size: .426667rem/* 32/75 */
  ;
  color: #333333;
  text-align: center;
  font-weight: bold;
  line-height: 1.066667rem;
  border-top: solid 1px rgba(204, 204, 204, 1);
}

.layer {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 1);
  opacity: 0.6;
  z-index: 100;
  display: none;
}

/* 答题面板边距调整 */

.tq-m-question-content {
  margin-bottom: 1.066667rem/* 80/75 */
  ;
}

.tq-m-question-content li {
  padding: 0 .4rem/* 30/75 */
  ;
  margin-bottom: .24rem/* 18/75 */
  ;
}

.tq-g-key-item {
  display: flex;
  display: -webkit-flex;
  justify-content: space-between;
  align-items: center;
}

.answer_wrap {
  display: flex;
  display: -webkit-flex;
  justify-content: space-between;
  flex-direction: column;
}

.answer_wrap-ctn div {
  height: .8rem/* 60/75 */
  ;
  line-height: 0.8rem;
  color: #666666;
  font-size: .32rem/* 24/75 */
  ;
}