@charset "utf-8";
/* CSS Document */

/* 2025-2026年モダンリセット例（抜粋） */
body {
  margin: 0;
  line-height: 1.6; /* 文字の読みやすさを確保 */
  /* font-size: 1rem;  */
}
/* フォーム要素も親から継承 */
button, input, textarea, select {
  font: inherit;
}

a {
  color: inherit;
}


/**
 * uaplus.css version 0.3.0
 */
@layer {

/**
 * 異なるボックスモデル
 * ボックスモデルは従来のものを使用します。このモデルは要素のpaddingとborderは指定されて幅と高さの内側に描画され、外側には描画されません。
 * そのため<code>inline-size</code>や<code>block-size</code>のようなプロパティで相対単位と絶対単位を組み合わせることが簡単になります。
 */
  *, *::after, *::before {
    box-sizing: border-box;
  }


  /**
 * フォーカススタイルを改善する
 * コンテンツとフォーカス時のアウトラインの間にスペースを追加します。
 */
  :focus-visible {
    outline-offset: 3px
  }
  /* ユーザー設定を尊重 */

  /**
 * テキストのサイズ調整を無効にする
 * スマホに最適化されていないWebサイトでの読みやすさを改善するために、モバイルSafariなどのブラウザはWebサイトを縦から横に切り替えたときにデフォルトのフォントサイズを大きくします。最適化されたWebサイトではどの動作を望んでいません。
 */
  html {
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
  }
  /**
 * 行間を広げる
 * 長い段落は行間を広くすると読みやすくなります。
 */
  html {
    line-height: 1.5;
  }

  /**
 * スクロールバーのガターを追加する
 * 長いページから短いページに切り替える際に、ページがジャンプするのを防ぎます。
 */
  html {
    scrollbar-gutter: stable;
  }


  /**
 * セクショニングコンテンツ内にあるh1要素のUAスタイルを削除します。
 * sectionやarticleなどでh1要素をネストしてもセマンティックには影響しないため、見出しのスタイルには影響しません。
 */
  h1 {
    font-size: 2em;
    margin-block: .67em;
  }
  abbr[title] {
    cursor: help;
    text-decoration-line: underline;
    text-decoration-style: dotted;
  }
  @media (forced-colors:active) {
    mark {
      color: HighlightText;
      background-color: Highlight;
    }
  }
  audio, iframe, img, svg, video {
    max-block-size: 100%;
    max-inline-size: 100%;
  }
  fieldset {
    min-inline-size: 0;
  }
  label:has(+input:not([type="radio"], [type="checkbox"]), select, textarea) {
    display: block;
  }
  textarea:not([rows]) {
    min-block-size: 6em;
  }
  button, input, select, textarea {
    font-family: inherit;
    font-size: inherit;
  }
  [type="search"] {
    -webkit-appearance: textfield;
  }
  @supports (-webkit-touch-callout:none) {
    [type="search"] {
      border: 1px solid -apple-system-secondary-label;
      background-color: canvas;
    }
  }
  input:where([type="tel"], [type="url"], [type="email"], [type="number"]):not(:placeholder-shown) {
    direction: ltr;
  }
  table {
    border-collapse: collapse;
    border: 1px solid;
  }
  th, td {
    border: 1px solid;
    padding: .25em .5em;
    vertical-align: top;
  }
  dialog::backdrop {
    background: oklch(0% 0 0 / .3);
  }
  dialog, [popover], dialog::backdrop {
    opacity: 0;
    transition: opacity 150ms ease-out, display 150ms allow-discrete, overlay 150ms allow-discrete;
  }
  dialog[open], :popover-open, dialog[open]::backdrop {
    opacity: 1;
  }
  @starting-style {
    dialog[open], :popover-open, dialog[open]::backdrop {
      opacity: 0;
    }
  }
  [hidden]:not([hidden="until-found"]) {
    display: none !important;
  }
  img {
    display: block;
  max-width: 100%; /* 親要素からはみ出さない */
  height: auto;    /* アスペクト比を維持 */
  vertical-align: middle; /* 下部の余分な隙間を消す（これは現在も定番） */
}


  summary {
    cursor: default;
  }
  iframe {
    border: none;
  }
  @supports(position-area:block-end span-inline-end) {
    [popover] {
      margin: 0;
      position-area: block-end span-inline-end;
    }
  }

