@define-mixin guideStepListCheckbox {
  background-repeat: no-repeat;
  background-size: 100%;
  background-position-y: 1px;
  display: inline-block;
  width: var(--fontSize);
  height: var(--fontSize);
  margin-right: 0.5em;
}

@define-mixin guideNextButton {
  display: inline-block;
  margin: var(--verticalSpaceElement) var(--gutter) 0 0;
  border: 1px;
  border-radius: 5px;
  font-size: var(--fontSize);
  font-weight: 600;
  text-decoration: none;
  color: var(--colorButtonText);
  background-color: var(--colorButton);
  padding: var(--paddingButtonVertical) var(--paddingButtonHorizontal);

  &:hover {
    background-color: var(--colorButtonHover);
    color: var(--colorButtonText);
  }
}

@define-mixin guideSloganImageContainer {
  margin: var(--verticalSpaceElement) 0;
  display: block;
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
  padding: 40.3% 0 0 0; /* 40.30% = 100 / (w / h) = 100 / (732 / 295) */
}