/* ==========================================================================
   layout.css
   コンテナ・セクション・余白など「レイアウト骨格」
   方針：
   - 左の基準点は常に「サイト幅（.l-container 左端）」＝0
   - デフォルトで本文ブロックを勝手にインデントしない
   - インデントは明示クラスのみ
   - レイアウト骨格のみを扱う
   ========================================================================== */

/* ==========================================================================
   01) Main（縦方向の伸び）
   ========================================================================== */

.l-main {
  flex: 1;
  margin-top: var(--main-pad-top);
  margin-bottom: var(--main-pad-bottom);
}

/* ==========================================================================
   02) Container（サイト幅の基準点）
   ========================================================================== */

.l-container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad-x);
}

/* ==========================================================================
   03) Section（共通）
   ========================================================================== */

.c-section {
  padding-block: var(--section-pad-y);
}

.c-section__head {
  margin-bottom: var(--section-head-bottom);
}

/* ==========================================================================
   04) Body Measure（本文ブロック）
   ========================================================================== */

.c-section__body {
  padding-left: 0px;
  padding-right: 0px;
}

.c-section__body.is-indent {
  padding-left: var(--body-indent-x);
  padding-right: var(--body-indent-x);
}

.c-section__body.is-full {
  padding-left: 0px;
  padding-right: 0px;
}

.c-section__body.is-center {
  padding-left: 0px;
  padding-right: 0px;
  width: var(--body-center-width);
  max-width: var(--body-center-max);
  margin-left: auto;
  margin-right: auto;
}

/* ==========================================================================
   05) ページ別／例外
   ========================================================================== */

.c-section--about {
  padding-top: var(--about-pad-top);
  padding-bottom: var(--about-pad-bottom);
}