PhonicsGame_master/pages/main/list.wxss

.container {
  background-color: #3b3431;
  justify-content: flex-start;
}

.questioncollection_headline_root {
  width: 652rpx;
  height: 89rpx;
  position: absolute;
  top: 10rpx;
  left: 45rpx;
}

.line0 {
  width: 100%;
  height: 56rpx;
  background-color: #9c5043;
}

.line1 {
  width: 100%;
  height: 10rpx;
  background-color: #3d3835;
}

.line2 {
  width: 100%;
  height: 80rpx;
  background-color: #514a47;
}

.line3 {
  width: 100%;
  height: 40rpx;
  background-color: #433d3b;
}

.questioncollection_headline_light {
  width: 100%;
  height: 277rpx;
  position: absolute;
  top: 69rpx;
  z-index: 100;
}

.panelTop {
  margin-top: 10rpx;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
  height: 160rpx;
}

.panelTopLine{
  border-top-left-radius: 8rpx;
}
.panelTopLine1{
  border-top-right-radius: 8rpx;
}

.panelTopCenter{
  width: 630rpx;
  height: 160rpx;
}

.questioncollection_headline_shelf_illus_grade01 {
  width: 520rpx;
  height: 160rpx;
}

.questioncollection_headline_shelf_illus_grade02 {
  width: 545rpx;
  height: 140rpx;
}

.questioncollection_headline_shelf_illus_grade03 {
  width: 580rpx;
  height: 140rpx;
}

.questioncollection_headline_shelf_illus_grade04 {
  width: 529rpx;
  height: 130rpx;
}

.questioncollection_headline_plate01_selected {
  width: 112rpx;
  height: 70rpx;
  position: absolute;
  top: 186rpx;
  left: 0rpx;
  z-index: 100;
}

.questioncollection_headline_plate02_selected {
  width: 112rpx;
  height: 70rpx;
  position: absolute;
  top: 264rpx;
  left: 0rpx;
  z-index: 100;
}

.questioncollection_shelf_board {
  width: 630rpx;
  height: 100rpx;
  z-index: 10;
}

.questioncard {
  width: 100%;
  height: 130rpx;
  margin-top: -40rpx;
}

.cardCenter {
  width: 590rpx;
  height: 130rpx;
  position: relative;
  justify-content: flex-start;
}

.questioncollection_shelf_box {
  width: 580rpx;
  height: 130rpx;
  position: absolute;
}

.boxLeft {
  margin: 0 28rpx 0 12rpx;
}

.boxCenter {
  margin: 0 2rpx 0 38rpx;
}

.boxRight {
  margin: 0 2rpx 0 38rpx;
}

.questioncard_icon {
  width: 86rpx;
  height: 96rpx;
  z-index: 10;
  margin-left: 30rpx;
}

.questioncard .title {
  color: #1e1e1e;
  z-index: 10;
  margin-left: 30rpx;
  align-items: flex-start;
}

.questioncard .title1 {
  font-size: 30rpx;
}

.questioncard .title2 {
  font-size: 20rpx;
  color: #8f4a32;
  margin-top: 10rpx;
}

.questioncard .line {
  background-color: #a7583c;
  width: 3rpx;
  height: 16rpx;
  margin: 0 20rpx;
  border-radius: 2rpx;
}

.questioncollection_shelf_box_tape {
  width: 36rpx;
  height: 48rpx;
  position: absolute;
  left: 474rpx;
  top: 0;
}

.questioncard .title3 {
  width: 80rpx;
  height: 32rpx;
  font-size: 20rpx;
  background-color: #a7583c;
  color: #fff;
  margin-top: 10rpx;
  border-radius: 4rpx;
  text-align: center;
  line-height: 32rpx;
  z-index: 10;
  position: absolute;
  left: 430rpx;
  top: 70rpx;
}

.questioncollection_shelf_here {
  width: 130rpx;
  height: 60rpx;
  position: absolute;
  left: -16rpx;
  bottom: 0rpx;
  z-index: 20;
}

.universalpic_lock_locked_black_size01 {
  width: 32rpx;
  height: 37rpx;
  position: absolute;
  right: 34rpx;
}

.questioncollection_shelf_footer_illus {
  width: 630rpx;
  height: 318rpx;
  margin-top: 0rpx;
  z-index: 10;
  position: relative;
}


.lineLong {
  width: 30rpx;
  height: 190rpx;
  background-color: #4d4d4d;
  margin-top: -60rpx;
}

.lineLeft {
  justify-content: flex-end;
}

.lineRight {
  justify-content: flex-start;
}

.lineLong1 {
  background-color: #6b6b6b;
  height: 100%;
  width: 10rpx;
}

.lineLong2 {
  background-color: #6b6b6b;
  height: 100%;
  width: 10rpx;
  border-top-left-radius: 8rpx;
  border-bottom-left-radius: 8rpx;
}

.universalpic_select_on_black {
  height: 30rpx;
  width: 30rpx;
  position: absolute;
  left: 40rpx;
  top: 40rpx;
}

.panelBottom {
  height: 370rpx;
  align-items: flex-start;

  background-color: #3B3431;
  position: relative;
}

.panelTopLine2{
  border-bottom-left-radius: 8rpx;
  height:410rpx;
  position: relative;
  z-index: 10;
}
.panelTopLine3{
  border-bottom-right-radius: 8rpx;
  height:410rpx;
  position: relative;
  z-index: 10;
}

.line4 {
  width: 100%;
  height: 100rpx;
  position: absolute;
  bottom:0rpx;
  background-color: #433D3B;
}

.line5 {
  width: 100%;
  height: 50rpx;
  background-color: #514a47;
}

.line6 {
  width: 100%;
  height: 550rpx;
  background-color: #514a47;
}