@media screen and (min-width: 768px) {
  .main {
    padding-top: 50px;
    .title {
      font-size: 28px;
    }
    .date {
      font-size: 18px;
      color: #b2b2b2;
      margin-top: 16px;
    }
    .line {
      width: 100%;
      margin: 40px 0 70px;
      position: relative;
      height: 1px;
      background-color: #d8d8d8;
      &::after {
        content: '';
        display: block;
        width: 24px;
        height: 2px;
        background: #0688d2;
      }
    }
    .detail {
      p {
        line-height: 34px;
        margin: 32px 0;
      }
    }
  }
}

@media screen and (max-width: 768px) {
  .main {
    padding: 0.8rem 0.32rem;
    .title {
      font-size: 0.34rem;
    }

    .date {
      font-size: 0.24rem;
      color: #b2b2b2;
      margin-top: 0.16rem;
    }

    .line {
      width: 100%;
      margin: 0.34rem 0 0.5rem;
      position: relative;
      height: 0.01rem;
      background-color: #d8d8d8;
      &::after {
        content: '';
        display: block;
        width: 0.4rem;
        height: 0.03rem;
        background: #0688d2;
      }
    }
    .detail {
      p {
        line-height: 0.48rem;
        margin: 0.32rem 0;
        font-size: 0.26rem;
        color: #404040;
      }

      img {
        max-width: 100%;
      }
    }
  }
}