/* change the font families. */
:root {
  --md-text-font: --apple-system, 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Segoe UI', sans-serif;
}

/* メインエリア */
.md-typeset {
  line-height: 1.9em;
  letter-spacing: .02em;

  h1 {
    font-weight: bold;
    line-height: 1.6;
    letter-spacing: .01em;
  }

  h2,
  h3,
  h4,
  h5,
  h6 {
    margin-block-start: 2.2em;
    font-weight: bold;
    letter-spacing: .01em;
  }

  h5,
  h6 {
    margin-block-start: 2em;
    letter-spacing: .01em;
  }

  p,
  /* ネストされたものは除外 */
  :not(li) :where(ul, ol),
  dl,
  blockquote {
    margin-block: 1.3em;
  }

  table {
    margin-block: 1.3em;

    &:not([class]) {
      font-size: 100%;
    }
  }

  pre {
    margin-block: 1.3em;
    line-height: 1.75em;
  }

  code {
    font-size: 100%;
    padding: .3em .4em;
    border-radius: .2em;
  }

  /* Admonitions */
  .admonition {
    font-size: 90%;
  }

  .admonition-title {

    /* アイコン */
    &:before {
      top: .92em;
    }

    /* タイトルのあとのすべての要素 */
    ~* {
      margin-top: .6rem;
    }
  }

  /* YouTube iframe 用 16:9 */
  .ar-16-9 {
    max-width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
  }
}

/* サイドバー */
.md-nav {
  letter-spacing: .02em;
}

/* サイドバーのリンク */
.md-nav__link {
  margin-top: 1em;
}

/* Custom elements */
#breadcrumbs {
  margin-block-end: 1.3em;

  /* サイドバーと共通のサイズに設定する */
  font-size: .7rem;

  ol {
    margin: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    list-style-type: none;
  }

  li {
    margin: 0;

    &+& {
      margin-left: .4em;

      &:before {
        content: ">";
        margin-right: .4em;
      }
    }
  }
}