<template>
  <view class="bg">
    <view class="intro">
      <!-- <image
        class="intro-bg"
        mode="widthFx"
        src="https://ndata.zzxcx.net/ctjk/mp-wx/courseCatalog/descBg.png"
      ></image> -->
      <!-- <view class="intro-title"> 课程介绍 </view> -->
      <view class="intro-desc">
        <image
          class="intro-desc-title1"
          mode="widthFix"
          src="https://ndata.zzxcx.net/jklsj/xcx/courseCatalog/kecheng@2x.png"
        ></image>
        <text>
          所有科三考场路线，有资深教练顾问团，结合当地考场科三考试规则，并有诸多当地资深教练共同协助拍摄制作的真实考试路线，视频清晰，各个项目点有文字和语音讲解仔细。让学员能在考前清楚了解考试路线项目点位，能消除学员考前很多疑虑和焦急的心态，是提高通过率，顺利过关！</text
        >
      </view>
    </view>
    <view class="problem">
      <!-- <image
        class="intro-bg"
        mode="widthFx"
        src="https://ndata.zzxcx.net/ctjk/mp-wx/courseCatalog/descBg.png"
      ></image> -->

      <view class="intro-question">
        <image
          class="intro-question-title1"
          mode="widthFix"
          src="https://ndata.zzxcx.net/jklsj/xcx/courseCatalog/changjian.png"
        ></image>
        <view class="intro-question-title2">
          <!-- <image src="" class=""></image> -->
          <image
            class="intro-question-wen"
            src="https://ndata.zzxcx.net/jklsj/xcx/courseCatalog/wen.png"
          ></image>
          <text>视频线路和考试线路完全一样吗？</text>
        </view>
        <view class="intro-question-answer"
          >模拟真实考场拍摄，考试内容与实际考试一致，请放心观看。因考试线路存在多条，请确认好考场线路。
        </view>
        <view
          style="
            width: 100%;
            height: 3rpx;
            background: #e8e8e8;
            margin-top: 30rpx;
          "
        ></view>
        <view class="intro-question-title2"
          ><image
            class="intro-question-wen"
            src="https://ndata.zzxcx.net/jklsj/xcx/courseCatalog/wen.png"
          ></image
          ><text>考场视频有效期是多久？</text></view
        >
        <view class="intro-question-answer">
         <text
            >本产品有效期为自购买之日起6个月内有效，在有效期内，可反复观看。</text
          >
        </view>
        <view class="intro-question-title2">
          <image
            class="intro-question-wen"
            src="https://ndata.zzxcx.net/jklsj/xcx/courseCatalog/wen.png"
          ></image
          ><text>购买后可退款吗？</text></view
        >
        <view class="intro-question-answer">
          <text>虚拟产品，不支持退款哦。 (购买前请仔细咨询清楚考场路线)。</text>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {};
</script>

<style lang="less" scoped>
.bg {
  padding-top: 50rpx;
  padding-left: 30rpx;
  padding-right: 30rpx;
  white-space: normal;

  .intro {
    width: 690rpx;
    height: 476rpx;
    background: #e6ffef;
    border-radius: 20rpx 20rpx 20rpx 20rpx;
    opacity: 1;
    position: relative;
    margin-bottom: 40rpx;
    .intro-bg {
      width: 100%;
    }
    .intro-title {
      position: absolute;
      font-size: 38rpx;
      width: 100%;
      top: 0;
      color: #fff;
      text-align: center;
      height: 80rpx;
      line-height: 80rpx;
    }
    .intro-desc {
      position: absolute;
      width: 100%;
      top: 40rpx;
      padding: 0 30rpx;
      left: 10rpx;
      color: #5c6066;
      .intro-desc-title1 {
        width: 178rpx;
        display: block;
        margin-bottom: 26rpx;
      }
    }
  }
  .problem {
    position: relative;
    width: 690rpx;
    height: 756rpx;
    background: #e6ffef;
    border-radius: 20rpx 20rpx 20rpx 20rpx;
    opacity: 1;
    .intro-bg {
      width: 100%;
    }
    .intro-title {
      position: absolute;
      font-size: 38rpx;
      width: 100%;
      top: 0;
      color: #fff;
      text-align: center;
      height: 80rpx;
      line-height: 80rpx;
    }
    .intro-question {
      position: absolute;
      top: 40rpx;
      left: 10rpx;
      padding: 0 30rpx;
      color: #5c6066;
    }
    .intro-question-title1 {
      width: 178rpx;
      display: block;
    }
    .intro-question-title2 {
      font-size: 34rpx;
      color: #0c1c12;
      padding-top: 30rpx;
    }
    .intro-question-wen {
      width: 45rpx;
      height: 45rpx;
      display: inline-block;
      margin-right: 14rpx;
      vertical-align: bottom;
    }
    .intro-question-answer {
      font-size: 30rpx;
      color: #5c6066;
    }
  }
}
</style>