@charset "UTF-8";

/* 最終更新：2022.09.09 */

/*--------------------------------
CSS打ち消し
--------------------------------*/
.cont-static-block h1 {
  font-size: initial;
  font-weight: initial;
  margin: initial;
  color: initial;
}

.cont-static-block h2 {
  margin: initial;
  padding-bottom: initial;
  border-bottom: initial;
  font-size: initial;
}

.cont-static-block h3 {
  margin: initial;
  font-size: initial;
  font-weight: initial;
  color: initial;
  display: initial;
  margin-block-start: initial;
  margin-block-end: initial;
  margin-inline-start: initial;
  margin-inline-end: initial;
}

.cont-static-block h4 {
  display: initial;
  margin-block-start: initial;
  margin-block-end: initial;
  margin-inline-start: initial;
  margin-inline-end: initial;
  font-weight: initial;
  font-size: initial;
}

.cont-static-block h1 span {
  font-size: initial;
  color: initial;
}

.cont-static-block p {
  font-size: initial;
}

.cont-static-block ul {
  display: initial;
  list-style-type: initial;
  margin-block-start: initial;
  margin-block-end: initial;
  margin-inline-start: initial;
  margin-inline-end: initial;
  padding-inline-start: initial;
  font-size: initial;
  font-weight: initial;
}

.cont-static-block ul li {
  margin: initial;
  font-size: initial;
  font-weight: initial;
}

.cont-static-block a {
  font-size: initial;
  font-weight: initial;
}

.cont-static-block img {
    width: 100%;
    height: auto;
    vertical-align: baseline; /* 画像下の謎の余白を消す */
}

/*--------------------------------
全体
--------------------------------*/
/* 一部のモバイル端末で使われる、
テキストの自動拡大アルゴリズムを制御 */
body {
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* 改行 */
br {
  display: block;
  content: "";
  margin: 8px auto;/* 高さはここで変更 */
}

.l-br {
  display: block;
  content: "";
  margin: 8px auto;
}

/* コンテンツの左右の余白(左右各20pxずつ) */
.w-container {
  max-width: min(98%, 1120px);
  height: auto;
  margin: 0;
}


/*--------------------------------
レイアウト用 margin 余白セット　→要素の外
--------------------------------*/
/* margin-top & bottom (上下に余白) */
.margin-topBottom-08 {
  margin: 0.5rem 0;
}
.margin-topBottom-16 {
  margin: 1.6rem 0;
}
.margin-topBottom-32 {
  margin: 3.2rem 0;
}
.margin-topBottom-48 {
  margin: 4.8rem 0;
}
.margin-topBottom-50 {
  margin-top: 5.0rem;
}
.margin-topBottom-64 {
  margin: 6.4rem 0;
}


/* margin-top (上に余白) */
.margin-top-08 {
  margin-top: 0.5rem;
}
.margin-top-16 {
  margin-top: 1.6rem;
}
.margin-top-24 {
  margin-top: 2.4rem;
}
.margin-top-32 {
  margin-top: 3.2rem;
}
.margin-top-48 {
  margin-top: 4.8rem;
}
.margin-top-50 {
  margin-top: 5.0rem;
}
.margin-top-64 {
  margin-top: 6.4rem;
}
.margin-top-80 {
  margin-top: 8.0rem;
}
.margin-top-100 {
  margin-top: 10rem;
}
.margin-top-200 {
  margin-top: 20rem;
}

/* margin-bottom (下に余白) */
.margin-bottom-08 {
  margin-bottom: 0.5rem;
}
.margin-bottom-16 {
  margin-bottom: 1.6rem;
}
.margin-bottom-32 {
  margin-bottom: 3.2rem;
}
.margin-bottom-48 {
  margin-bottom: 4.8rem;
}
.margin-bottom-50 {
  margin-bottom: 5.0rem;
}
.margin-bottom-64 {
  margin-bottom: 6.4rem;
}

/* margin-left & right (左右に余白) */
.margin-leftRight-08 {
  margin: 0 0.5rem;
}
.margin-leftRight-16 {
  margin: 0 1.6rem;
}
.margin-leftRight-32 {
  margin: 0 3.2rem;
}
.margin-leftRight-48 {
  margin: 0 4.8rem;
}
.margin-leftRight-64 {
  margin: 0 6.4rem;
}

/* margin-left (左に余白) */
.margin-left-08 {
  margin-left: 0.5rem;
}
.margin-left-16 {
  margin-left: 1.6rem;
}
.margin-left-24 {
  margin-left: 2.4rem;
}
.margin-left-32 {
  margin-left: 3.2rem;
}
.margin-left-48 {
  margin-left: 4.8rem;
}
.margin-left-64 {
  margin-left: 6.4rem;
}

/* margin-right (右に余白) */
.margin-right-08 {
  margin-right: 0.5rem;
}
.margin-right-16 {
  margin-right: 1.6rem;
}
.margin-right-32 {
  margin-right: 3.2rem;
}
.margin-right-48 {
  margin-right: 4.8rem;
}
.margin-right-64 {
  margin-right: 6.4rem;
}



/*--------------------------------
レイアウト用 padding 余白セット　→要素の中
--------------------------------*/
/* padding-top (上に余白) */
.padding-top-08 {
  padding-top: 0.8rem;
}
.padding-top-16 {
  padding-top: 1.6rem;
}
.padding-top-20 {
  padding-top: 2.0rem;
}
.padding-top-24 {
  padding-top: 2.4rem;
}
.padding-top-32 {
  padding-top: 3.2rem;
}
.padding-top-50 {
  padding-top: 5.0rem;
}

/* padding-bottom (下に余白) */
.padding-bottom-16 {
  padding-bottom: 1.6rem;
}
.padding-bottom-32 {
  padding-bottom: 3.2rem;
}
.padding-bottom-50 {
  padding-bottom: 5.0rem;
}

/* padding-topBottom (上下に余白) */
.padding-topBottom-32 {
  padding: 3.2rem 0;
}


/*--------------------------------
文章と文章の間の余白用　margin・padding
--------------------------------*/
/* margin */
.margin-top__BetweenSentences-005 {
  margin-top: 0.5em;
}

.margin-top__BetweenSentences-01 {
  margin-top: 1em;
}

.margin-top__BetweenSentences-02 {
  padding-top: 2em;
}


.margin-top__BetweenSentences-03 {
  margin-top: 3em;
}

/* 推奨　文章間 */
.margin-top__BetweenSentences-05 {
  margin-top: 5em;
}



/* padding */
.padding-top__BetweenSentences-005 {
  padding-top: 0.5em;
}

.padding-top__BetweenSentences-01 {
  padding-top: 1em;
}

.padding-top__BetweenSentences-02 {
  padding-top: 2em;
}

.padding-top__BetweenSentences-03 {
  padding-top: 3em;
}


.padding-right__BetweenSentences-01{
  padding-right: 1em;
}


/* 推奨　文章間 */
.padding-top__BetweenSentences-05 {
  padding-top: 5em;
}



/*--------------------------------
レイアウト用 border セット
--------------------------------*/
.border-simple__a3a6a7 {
  border: 0.5px solid #a3a6a7;
}
/* premium-hour.html で使用 */



/*--------------------------------
レイアウト用 背景色セット
--------------------------------*/
/* 背景色 */
.bgColor__white {
  background-color: #ffffff;
}

/*--------------------------------
レイアウト用 文字の太さセット
--------------------------------*/
.m-font__bolder {
  font-weight: bolder;
}

/*--------------------------------
レイアウト用 フォントカラー セット
--------------------------------*/
/* レイアウト用フォントカラー */
.l-fontColor__white {
  color: #ffffff;
}

/*--------------------------------
レイアウト用 アイテムの配置 セット
--------------------------------*/
/* text-align セット */
  /* 中央寄せ */
.l-text-align__center {
  text-align: center;
}
  /* 左へ */
.l-text-align__left {
  text-align: left;
}
  /* 右へ */
.l-text-align__right {
  text-align: right;
}


/* float セット */
  /* 左へ */
.l-float__left {
  float: left;
}
  /* 右へ */
.l-float__right {
  float: right;
}

/*--------------------------------
flexbox セット
--------------------------------*/
  /* アイテム横並び(中央寄せ) */
.flexbox__center {
  display: flex;
  justify-content: center;
}

  /* アイテム横並び(左寄せ) */
.flexbox__left {
  display: flex;
  justify-content: flex-start;
}

  /* アイテム横並び(右寄せ) */
.flexbox__right {
  display: flex;
  justify-content: end;
}

  /* アイテム横並び(両端揃え) */
.flexbox__space-between {
  display: flex;
  justify-content: space-between;
}

.flexbox__space-around {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

  /* アイテム縦並び(中央寄せ) */
.flexbox__column-center {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

  /* アイテム折り返し */
.flexbox__wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

  /* flexbox各アイテム(子要素) */
.flexbox-item__shrink1 {
  flex-shrink: 1;
}
.flexbox-item__shrink2 {
  flex-shrink: 2;
}


/*--------------------------------
Grid セット
--------------------------------*/
  /* Grid(1列) */
  .grid_1columns {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 60px;
  }

  /* Grid(2列) */
  .grid_2columns {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 80px 50px;
  }

  /* Grid(3列) */
.grid_3columns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 60px 30px;
}

  /* 真ん中 (アイテム垂直方向に) */
.align-self__center {
  align-self: center;
}


/*--------------------------------
画像トリミング セット
--------------------------------*/
  /* 画像のトリミングについて */
    /* 縮小して全体表示 */
    .object-fit__contain {
        object-fit: contain;
      }
          /* 中央位置でトリミング */
      .object-fit__cover {
        object-fit: cover;
      }

        /* 画像の表示位置 */
          /* 画像の左上 */
      .object-position__lefttop {
        object-position: top left;
      }
          /* 画像の右上 */
      .object-position__righttop {
        object-position: top right;
      }
          /* 画像の左下 */
      .object-position__leftbottom {
        object-position: bottom left;
      }
          /* 画像の右下 */
      .object-position__rightbottom {
        object-position: bottom right;
      }





/*--------------------------------
「New」マーク
--------------------------------*/
/* newマークを配置する箱 */
/* .new{
  position: relative;
  background-color: aliceblue;
  width: 100%;
  max-width: 384px;
  margin: 60px auto;
  aspect-ratio: 16/9;
} */

/* newマーク */
  /* 箱の中 */
  /* .new::before{
    content: "NEW!";
    background-color: crimson;
    color: #ffffff;
    padding: 5px 25px;
  } */

  /* 箱の外 */
  /* .new::before{
    position: absolute;
    content: "NEW";
    top: -34px;
    left: 0;
    background-color: crimson;
    color: #ffffff;
    padding: 5px 25px;
  } */

  /* 斜め */
  /* .new::before {
    position: absolute;
    content: "NEW";
    top: -7px;
    left: -20px;
    background-color: crimson;
    color: #ffffff;
    padding: 5px 25px;
    transform: rotate(-30deg);
  } */





/* 最終更新：2022.08.29 */