html.is-application
  font-family: $sans-serif
  color: var(--default-text)
  +media-breakpoint-up(md)
    scroll-padding-top: var(--header-height__md-up)

body.is-application
  background-color: var(--background)

body.is-no-scroll
  overflow-y: hidden
  .header
    position: static
  .wrapper
    padding-top: 0

body.is-piyo-background
  &::before
    content: ''
    +position(fixed, left 0, top 0, right 0, bottom 0)
    +size(100%)
    background-image: url(https://bootcamp.fjord.jp/images/background/background.svg)
    background-repeat: repeat
    overflow-y: auto
    opacity: .04
    +media-breakpoint-up(md)
      background-size: 20rem
    +media-breakpoint-down(sm)
      background-size: 4.5rem
  .wrapper
    +position(relative, 1)

.wrapper
  &.is-application
    +media-breakpoint-up(md)
      margin-left: 5rem
      padding-top: var(--header-height__md-up)
  body.no-global-nav &
    margin-left: 0
  body.no-header &
    padding-top: 0
  body.is-error-page &
    padding-top: 4rem
    overflow-y: auto
  body.is-thanks-page &
    padding-block: 4rem
