@charset "UTF-8";

/* ==========================================
  1. 基本設定（スマホ・全デバイス共通）
========================================== */
.l-scope.l-page .l-section,
.l-scope.l-page .l-section.l-section--bkColor{
    padding: 4.0rem 0; /* スマホ用の64px */
    margin-bottom:0;
  }

.l-scope.l-page .l-container--l {
  padding: 3.0rem 0;  /* スマホ用の48px */
  margin-bottom:0;
 }

.l-scope.l-page .l-container--m {
  padding: 1.5rem 0;  /* スマホ用の24px */
  margin-bottom:0;
 }
 
 
.l-scope.l-page .l-container--s {
  padding: 0.5rem 0;  /* スマホ用の8px */
  margin-bottom:0;
 }


/* ==========================================
  2. 基本設定（タブレット）
========================================== */
@media screen and (min-width:768px) {

    .l-scope.l-page .l-section,
    .l-scope.l-page .l-section.l-section--bkColor{
      padding: 6.0rem 0; /* タブレット用の96px */
    }

    .l-scope.l-page .l-container--l {
      padding-block: 4.0rem 0;  /* タブレット用の64px */
    }

    .l-scope.l-page .l-container--m {
      padding: 2.0rem 0;  /* タブレット用の32px */
    }

    .l-scope.l-page .l-container--s {
      padding: 0.75rem 0;  /* タブレット用の12px */
    }
}

/* ==========================================
  3. 基本設定（PC）
========================================== */
@media screen and (min-width:1025px)  {

    .l-scope.l-page.l-section,
    .l-scope.l-page .l-section.l-section--bkColor{
      padding: 7.5rem 0;/* PC用の120px */
    }

    .l-scope.l-page .l-container--l {
      padding: 5.0rem 0;  /* PC用の80px */
    }

    .l-scope.l-page .l-container--m {
      padding: 3.0rem 0;  /* PC用の48px */
    }

    .l-scope.l-page .l-container--s {
      padding: 1.0rem 0;  /* PC用の16px */
    }
}
 
/* ==========================================
  4. インナーコンテナの設定（全デバイス共通）
========================================== */

.l-scope.l-page .l-section .l-container--inner {
  width:100%;
  max-width: 1008px;
  margin-inline: auto; 
  padding-block: 0;
  padding-inline: 1.5rem;
}


/* ==========================================
  5. 入れ子にしたコンテナの余白調整（全デバイス共通）
========================================== */
/*.l-section内の最初のl-sectionの上パディングを0*/
 .l-scope.l-page .l-section:first-of-type{
  padding-top: 0;
 }

 /*.l-section内の最後のl-section--mの下パディングを0*/
 /* .l-scope.l-page .l-section:last-of-type{
  padding-bottom: 0;
 } */

/*.l-section内の最初のl-container--mの上パディングを0*/
 .l-scope.l-page .l-section .l-container--m:first-of-type{
  padding-top: 0;
 }

 /*.l-section内の最後のl-container--mの下パディングを0*/
 .l-scope.l-page .l-section .l-container--m:last-of-type{
  padding-bottom: 0;
 }