/* ----------------------- */
/* コンテンツヘッダー
/* -----------------------
/* 画像付きh1 */
.h1-img-container {
  display: flex;
  gap: 32px;
  margin-top: 56px;

  > div:not([class]) {
    width: 40%;
  }
  > figure {
    position: relative;
    z-index: 1;
    width: 60%;
    max-width: 660px;
    height: fit-content;
    border-radius: 15px;
    overflow: hidden;
  }
  > figure {
    img {width: 100%;}
  }
  > div:not([class]) > div:not([class]) {
    display: flex;
    gap: 24px;

    > img {
      width: 45px; 
    }
    > span {
      color: var(--Umios-White, #FFF);
      font-size: 3rem;
    }
  }
  h1 {
    margin-top: 24px;
  }
  p {
    color: var(--Umios-White, #FFF);
  }
  &:not(:has(p)) > figure {
    margin-bottom: -100px;
  }
  /* 動画コンテンツ */
  .movie-container {
    position: relative;
    z-index: 1;
    width: 60%;
    /* max-width: 660px; */
  }
  .movie-content {
    /* max-width: 660px; */
  }
}
.content-header:has(.h1-img-container):not(:has(.h1-img-container p))::after {
  margin-bottom: 80px;
}
.content-header:has(.h1-img-container p) .h1-basis {
  margin-top: 0;
  min-height: auto;
}
@media screen and (max-width: 979px) {
  .h1-img-container {
    flex-direction: column;
    margin-top: 21px;

    > div:not([class]),
    > figure,
    .movie-container {
      width: 100%;
      max-width: 100%;
    }
    > div:not([class]) > div:not([class]) {
      gap: 10px;

      > img {
        width: 34px;
      }
      > span {
        font-size: 1.6rem;
      }
    }
    h1 {
      min-height: fit-content!important;
      margin-top: 16px;
    }
    &:not(:has(p)) > figure {
      margin-bottom: -16vw;
    }
    .movie-container {
      padding-bottom: 16px;
    }
  }
  .content-header:has(.h1-img-container):not(:has(.h1-img-container p))::after {
    margin-bottom: 16vw;
  }
}

/* ----------------------- */
/* フォント
/* -----------------------*/
/* H2_記事 */
.h2-article {
  color: var(--Umios-text_Red, #DE0012);
  font-size: 3rem;
  font-weight: 800;
  line-height: 120%;
}
@media screen and (max-width: 979px) {
  .h2-article {
    font-size: 24px;
  }
}

/* bold */
.strong {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 170%;
}


/* ----------------------- */
/* commonになる可能性高
/* ----------------------- */

/* Sampei Salmon Soupで使用 */
/* 国説明コンテンツ */
.country-container {
  display: grid;
  grid-template-columns: 38% 1fr;
  align-items: center;
  margin-top: 101px;
  border-radius: 15px;
  overflow: hidden;
  background: var(--bg-Bg_B2, #F2F6FC);

  > figure img {
    object-fit: cover;
    object-position: center;
    height: 100%;
  }

  > div {
    padding: 37px 47px 37px 20px;

    div {
      display: flex;
      gap: 10px;
    }
    img {
      width: 40px;
    }
    span {
      font-size: 2rem;
      font-weight: 700;
    }
    p {
      margin-top: 20px;
    }
  }
}
@media screen and (max-width: 979px) {
  .country-container {
    grid-template-columns: 1fr;
    margin-top: 48px;

    > figure img {
      object-fit: cover;
      object-position: center;
      width: 100%;
      height: auto;
      max-height: 175px;
    }
    
    > div {
      padding: 30px 20px 20px;
    }
  }
}

/* Sliderで使用 */
.splide__slide .caption img {
  width: 20px;
}