.scrollContainer {
  position: relative;
  height: 100%;
  .scrollContent{
    height: 100%;
    overflow: hidden;
    .issueContainer {
      display: flex;
      height: 100%;
      .left {
        width: 90px;
        height: 100%;
        overflow-x: hidden;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
        background: #F6F6F6;
        li {
          position: relative;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
          height: 43px;
          line-height: 43px;
          text-align: center;
        }
        li:before {
          content: "";
          display: block;
          position: absolute;
          left: 22px;
          top: 42px;
          width: 60%;
          // height: 1px;
          background: rgba(220, 220, 220, 0.4);
        }
  
        li.actived {
          background-color: #fff;
          color: #F16A5D;
        }
        li.actived:after {
          content: "";
          position: absolute;
          left: 0;
          top: 0;
          bottom: 0;
          right: 0;
          width: 4px;
          height: 50%;
          font-size: 0;
          background-color: #F16A5D;
          margin: auto 0;
        }
      }
      .right {
        width: calc(100% - 90px);
        position: relative;
        background-color: #fff;
        .mask {
          position: fixed;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%;
          background: rgba(0, 0, 0, 0.3);
        }
        .right_header {
          display: flex;
          padding: 0 15px;
          width: 100%;
          height: 44px;
          justify-content: space-between;
          align-items: center;
          color: #333;
          border-bottom: 1px #f5f5f5 solid;
          background-color: #fff;
          overflow-x: hidden;
          overflow-y: scroll;
          -webkit-overflow-scrolling: touch;
          .iconfont {
            color: #666;
            font-size: 10px;
          }
        }
        .select_all {
          position: absolute;
          right: 0;
          top: 0;
          background: #fff;
          width: 100%;
          height: 100%;
          padding: 20px 0 20px 10px;
          z-index: 1000;
          overflow-y: auto;
          ul{
            > li {
              margin-bottom: 10px;
              h5 {
                font-size: 16px;
                font-weight: bold;
                color: #333;
                margin-bottom: 10px;
                display: flex;
                justify-content: space-between;
                padding-right: 10px;
              }
              .optionLists {
                display: flex;
                width: 100%;
                flex-wrap: wrap;
                > div {
                  margin-right: 10px;
                  flex: 1;
                  background: #f6f6f6;
                  height: 38px;
                  line-height: 38px;
                  text-align: center;
                  margin-bottom: 10px;
                  min-width: 29%;
                  max-width: 30%;
                }
                div.selected{
                  color: #fff;
                  background: #F8002E;
                }
              }
            }
          }
          .foot_btn{
            display: flex;
            width: 100%;
            justify-content: space-around;
            text-align: center;
            div{
              width: 48%;
              height: 40px;
              line-height: 40px;
              border-radius: 10px;
            }
            div:nth-child(1){
              border: 2px #F8002E solid;
              color: #F8002E;
            }
            div:nth-child(2){
              background:#F8002E;
              color: #fff;
            }
          }
         
        }
        .productLists {
          background-color: #fff;
          -webkit-box-flex: 1;
          -ms-flex: 1;
          flex: 1;
          height: 100%;
          overflow-x: hidden;
          overflow-y: scroll;
          -webkit-overflow-scrolling: touch;
          padding-bottom: 60px;
          > li {
            padding-left: 16px;
            border-bottom: 1px solid #dcdcdc;
            padding-bottom: 15px;
          }
          li:last-child{
            border-bottom: 0;
          }
          .productInfoContent {
            h3 {
              font-size: 18px;
              color: #444;
              font-weight: bold;
              padding-top: 14px;
              padding-bottom: 8px;
              display: flex;
              justify-content: space-between;
              align-items: baseline;
            }
            .featureContent {
              display: flex;
              margin-bottom: 10px;
              align-items: center;
              > div {
                padding: 6px;
                background: #FCF2F1;
                color: #F16A5D;
                border-radius: 3px;
                margin-right: 6px;
              }
            }
            .insuranceRulesContent {
            }
            .priceContent {
              display: flex;
              justify-content: space-between;
              align-items: baseline;
              padding-right: 10px;
              strong {
                color: #F16A5D;
                font-size: 20px;
                margin-right: 3px;
              }
              span {
                font-size: 12px;
              }
            }
            .tagsContent{
              display: flex;
              flex-wrap: wrap;
              div{
                padding: 0 5px;
                border: 1px #F16A5D solid;
                margin: 5px;
                border-radius: 10px;
              }
            }
          }
          .dataContent {
            display: flex;
            justify-content: space-between;
            padding-right: 15px;
            > div:first-child {
              width: 55px;
              height: 26px;
              text-align: center;
              border: 1px solid #F16A5D;
              border-radius: 10px;
              color: #F16A5D;
              font-size: 15px;
              font-weight: normal;
            }
            // > div:last-child {
            //   background: #FDF5F4;
            //   color: #F16A5D;
            //   font-size: 12px;
            //   border-radius: 3px;
            //   padding: 5px 6px;
            // }
          }
        }
      }
    }
  }
  
}

.slowRight {
  animation: slowRight .3s ease-in-out both;
}

@keyframes slowRight {
  0% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}
