.l_cover
  height: 100vh
  text-align: center
  display: flex
  flex-direction: column
  justify-content: center
  align-items: center
  position: relative
  &.post
    height: inherit


.l_cover .cover-wrap
  margin-bottom: 0
  display: flex
  flex-direction: column
  justify-content: center
  align-items: center
  .cover-title
    font-weight: 700
    font-size: 1.5rem
    margin: 1rem 0
    line-height: 1.2
  .description
    margin: 1rem 0
  .start-wrap
    margin: 2rem 0
    flex-shrink: 0
    a.start
      display: inline-block

.l_cover.post
  .cover
    z-index: -1
    width: 100%
    height: 30vh
    max-width: $device-2k
    min-height: 150px
    max-height: 400px
    @media screen and (max-width: $device-tablet)
      height: 25vh
    @media screen and (max-width: $device-mobile)
      height: 20vh
    @media screen and (min-width: $device-2k)
      margin-top: 4rem
      .img
        border-radius: 2rem


.l_cover.post .cover-wrap
  z-index: 1
  .article-title
    text-align: center
    padding: 1rem
    margin: 1em 0 0 0
    @media screen and (min-width: $device-2k)
      font-size: 3rem


.l_cover.wiki .cover-wrap
  max-width: $device-mobile
  .preview
    margin-bottom: 2rem
    img
      object-fit: contain
      max-height: 35vh
      max-width: 100%
      @media screen and (max-width: $device-mobile)
        max-width: 60%
  .cover-title
    &:first-child
      font-size: 3rem