/**************************************
* Media
***************************************/
.only-sp {
  display: none !important;
}

@media screen and (max-width: 640px) {
  .only-sp {
    display: block !important;
  }
  .only-pc {
    display: none !important;
  }
}

/**************************************
* font
***************************************/
.fw-400 {font-weight: 400;}
.fw-500 {font-weight: 500;}
.fw-600 {font-weight: 600;}
.fw-700 {font-weight: 700;}

.fs-200 {font-size: 2.0em;}
.fs-175 {font-size: 1.75em;}
.fs-150 {font-size: 1.5em;}
.fs-125 {font-size: 1.25em;}
.fs-085 {font-size: 0.85em;}
.fs-075 {font-size: 0.75em;}
.fs-050 {font-size: 0.5em;}

.lh-100 {line-height: 1;}
.lh-125 {line-height: 1.25;}
.lh-150 {line-height: 1.5;}
.lh-175 {line-height: 1.75;}
.lh-200 {line-height: 2;}

.txt-center {text-align: center;}
.txt-right {text-align: right;}
.txt-left {text-align: left;}

.ff-oswald {font-family: 'Oswald';}

/**************************************
* margin
***************************************/
.mt-0 {margin-top: 0;}
.mt-20 {margin-top: 20px;}
.mt-30 {margin-top: 30px;}
.mt-40 {margin-top: 40px;}
.mt-50 {margin-top: 50px;}
.mt-60 {margin-top: 60px;}
.mt-70 {margin-top: 70px;}
.mt-80 {margin-top: 80px;}
.mt-90 {margin-top: 90px;}
.mt-100 {margin-top: 100px;}
.mt-120 {margin-top: 120px;}
.mt-140 {margin-top: 140px;}
.mt-160 {margin-top: 160px;}
.mt-180 {margin-top: 180px;}
.mt-200 {margin-top: 200px;}

.mb-0 {margin-bottom: 0;}
.mb-20 {margin-bottom: 20px;}
.mb-30 {margin-bottom: 30px;}
.mb-40 {margin-bottom: 40px;}
.mb-50 {margin-bottom: 50px;}
.mb-60 {margin-bottom: 60px;}
.mb-70 {margin-bottom: 70px;}
.mb-80 {margin-bottom: 80px;}
.mb-90 {margin-bottom: 90px;}
.mb-100 {margin-bottom: 100px;}
.mb-120 {margin-bottom: 120px;}
.mb-140 {margin-bottom: 140px;}
.mb-160 {margin-bottom: 160px;}
.mb-180 {margin-bottom: 180px;}
.mb-200 {margin-bottom: 200px;}

/**************************************
* Grid
***************************************/
.grid__container {
  display: grid;
  grid-template-columns: 1fr;
  grid-row: auto;
  gap: 1rem;
}
.grid__container.__2col {
  grid-template-columns: 1fr 1fr;
}
.grid__container.__2col__right-L {
  grid-template-columns: auto 58%;
}
.grid__container.__2col__left-L {
  grid-template-columns: 58% auto;
}
.grid__container.__3col {
  grid-template-columns: 1fr 1fr 1fr;
}
.grid__container.__4col {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
@media screen and (max-width: 640px) {
  .grid__container.__sp__1col {
    grid-template-columns: 1fr;
  }
  .grid__container.__sp__2col {
    grid-template-columns: 1fr 1fr;
  }
  .grid__container.__sp__3col {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .grid__container.__sp__4col {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}
.grid__container.__gap-10 {
  gap: 10px;
}
.grid__container.__gap-20 {
  gap: 20px;
}
.grid__container.__gap-30 {
  gap: 30px;
}
.grid__container.__gap-40 {
  gap: 40px;
}
.grid__container.__gap-60 {
  gap: 60px;
}
.grid__container.__gap-80 {
  gap: 80px;
}
.grid__container.__gap-100 {
  gap: clamp(50px, 8vw, 100px);
}
.grid__container .grid__item {
  width: 100%;
}

/**************************************
* Flex
***************************************/
.flex__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: start;
      align-content: flex-start;
}
.flex__container.__justify-between {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.flex__container.__justify-center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.flex__container.__justify-end {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.flex__container.__align-end {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.flex__container.__align-start {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.flex__container.__align-center {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.flex__container.__wrap {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.flex__container.__column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.flex__container.__gap-10 {
  gap: 10px;
}
.flex__container.__gap-20 {
  gap: 20px;
}
.flex__container.__gap-30 {
  gap: 30px;
}
.flex__container.__gap-40 {
  gap: 40px;
}
.flex__container.__gap-60 {
  gap: 60px;
}
.flex__container.__gap-80 {
  gap: 80px;
}
.flex__container.__gap-100 {
  gap: clamp(50px, 8vw, 100px);
}
@media screen and (max-width: 640px) {
  .flex__container.__sp__justify-center {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .flex__container.__sp__column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media screen and (max-width: 640px) {
  .flex__container.__sp__column-reverse {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
}