/*見出しを重ねたボックス*/
.caption_box{
  position: relative;
  padding: 1em;
  border: 2px solid var(--color-mos-green);
}

.caption_box .caption {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 1em;
  padding: 0 1em;
  margin: 0;
  transform: translate(1em, -50%);
}

.caption_box .lh-xl {
  line-height: 3;
}

/* スマホのみ */
@media (max-width: 768px) {
  .text-justify {
    text-align: justify;
  }
}

/* PCのみ */
@media (min-width: 768px) {
  .caption_box {
    padding: 1em 2em;
  }

  .ratio-md-21x9::before {
    padding-top: calc(9 / 21 * 100%);
  }
}


body.message {
  background-image: url(/assets/images/common/message-header.jpg);
  background-repeat: no-repeat;
  background-position: -55vw -62vw;
  background-size: 200vw;
}

body.message hr {
  background-color: var(--color-mos-green);
  opacity: 1;
}

.message [id] {
  scroll-margin-top: 65px;
}

@media (min-width: 768px) {
  body.message {
    background-position: -5vw -30vw;
    background-size: 104vw;
  }

  .message [id] {
    scroll-margin-top: 120px;
  }
}

@media (min-width: 1124px) {
  body.message {
    background-position: -5vw -35vw;
    background-size: 104vw;
  }
}