@charset "UTF-8";

.inner {
  padding: 0 2rem;
}

.inner.inner--pr-0 {
  padding-right: 0;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.text-center {
  text-align: center;
}

/* ----- font-size ----- */

.fs-18 {
  font-size: 1.8rem;
}

.fs-19 {
  font-size: 1.9rem;
}

.fs-20 {
  font-size: 2rem;
}

.fs-21 {
  font-size: 2.1rem;
}

.fs-22 {
  font-size: 2.2rem;
}

.fs-23 {
  font-size: 2.3rem;
}

.fs-24 {
  font-size: 2.4rem;
}

.fs-25 {
  font-size: 2.5rem;
}

.fs-26 {
  font-size: 2.6rem;
}

.fs-27 {
  font-size: 2.7rem;
}

.fs-28 {
  font-size: 2.8rem;
}

.fs-29 {
  font-size: 2.9rem;
}

.fs-30 {
  font-size: 3rem;
}

.fs-31 {
  font-size: 3.1rem;
}

.fs-32 {
  font-size: 3.2rem;
}

.fs-33 {
  font-size: 3.3rem;
}

.fs-34 {
  font-size: 3.4rem;
}

.fs-35 {
  font-size: 3.5rem;
}

.fs-36 {
  font-size: 3.6rem;
}

.fs-37 {
  font-size: 3.7rem;
}

.fs-38 {
  font-size: 3.8rem;
}

.fs-39 {
  font-size: 3.9rem;
}

.fs-40 {
  font-size: 4rem;
}

.fs-41 {
  font-size: 4.1rem;
}

.fs-42 {
  font-size: 4.2rem;
}

.fs-43 {
  font-size: 4.3rem;
}

.fs-44 {
  font-size: 4.4rem;
}

.fs-45 {
  font-size: 4.5rem;
}

.fs-46 {
  font-size: 4.6rem;
}

.fs-47 {
  font-size: 4.7rem;
}

.fs-48 {
  font-size: 4.8rem;
}

.fs-49 {
  font-size: 4.9rem;
}

.fs-50 {
  font-size: 5rem;
}

.fs-51 {
  font-size: 5.1rem;
}

.fs-52 {
  font-size: 5.2rem;
}

.fs-53 {
  font-size: 5.3rem;
}

.fs-54 {
  font-size: 5.4rem;
}

.fs-55 {
  font-size: 5.5rem;
}

.fs-56 {
  font-size: 5.6rem;
}

.fs-57 {
  font-size: 5.7rem;
}

.fs-58 {
  font-size: 5.8rem;
}

.fs-59 {
  font-size: 5.9rem;
}

.fs-65 {
  font-size: 6.5rem;
}

.fs-73 {
  font-size: 7.3rem;
}

/* ----- margin ----- */

.mt--1 {
  margin-top: -1px;
}

.mt-10 {
  margin-top: 1rem;
}

.mt-20 {
  margin-top: 2rem;
}

.mt-30 {
  margin-top: 3rem;
}

.mt-40 {
  margin-top: 4rem;
}

.mt-50 {
  margin-top: 5rem;
}

.mt-60 {
  margin-top: 6rem;
}

.mt-70 {
  margin-top: 7rem;
}

.mt-80 {
  margin-top: 8rem;
}

.mt-90 {
  margin-top: 9rem;
}

.mt-100 {
  margin-top: 10rem;
}

.mr-10 {
  margin-right: 1rem;
}

.mr-20 {
  margin-right: 2rem;
}

.mr-30 {
  margin-right: 3rem;
}

.mr-40 {
  margin-right: 4rem;
}

.mr-50 {
  margin-right: 5rem;
}

.mr-60 {
  margin-right: 6rem;
}

.mr-70 {
  margin-right: 7rem;
}

.mr-80 {
  margin-right: 8rem;
}

.mr-90 {
  margin-right: 9rem;
}

.mr-100 {
  margin-right: 10rem;
}

.mb-10 {
  margin-bottom: 1rem;
}

.mb-20 {
  margin-bottom: 2rem;
}

.mb-30 {
  margin-bottom: 3rem;
}

.mb-40 {
  margin-bottom: 4rem;
}

.mb-50 {
  margin-bottom: 5rem;
}

.mb-60 {
  margin-bottom: 6rem;
}

.mb-70 {
  margin-bottom: 7rem;
}

.mb-80 {
  margin-bottom: 8rem;
}

.mb-90 {
  margin-bottom: 9rem;
}

.mb-100 {
  margin-bottom: 10rem;
}

.ml-10 {
  margin-left: 1rem;
}

.ml-20 {
  margin-left: 2rem;
}

.ml-30 {
  margin-left: 3rem;
}

.ml-40 {
  margin-left: 4rem;
}

.ml-50 {
  margin-left: 5rem;
}

.ml-60 {
  margin-left: 6rem;
}

.ml-70 {
  margin-left: 7rem;
}

.ml-80 {
  margin-left: 8rem;
}

.ml-90 {
  margin-left: 9rem;
}

.ml-100 {
  margin-left: 10rem;
}

/* ----- padding ----- */

.pt-10 {
  padding-top: 1rem;
}

.pt-20 {
  padding-top: 2rem;
}

.pt-30 {
  padding-top: 3rem;
}

.pt-40 {
  padding-top: 4rem;
}

.pt-50 {
  padding-top: 5rem;
}

.pt-60 {
  padding-top: 6rem;
}

.pt-70 {
  padding-top: 7rem;
}

.pt-80 {
  padding-top: 8rem;
}

.pt-90 {
  padding-top: 9rem;
}

.pt-100 {
  padding-top: 10rem;
}

.pr-10 {
  padding-right: 1rem;
}

.pr-20 {
  padding-right: 2rem;
}

.pr-30 {
  padding-right: 3rem;
}

.pr-40 {
  padding-right: 4rem;
}

.pr-50 {
  padding-right: 5rem;
}

.pr-60 {
  padding-right: 6rem;
}

.pr-70 {
  padding-right: 7rem;
}

.pr-80 {
  padding-right: 8rem;
}

.pr-90 {
  padding-right: 9rem;
}

.pr-100 {
  padding-right: 10rem;
}

.pb-10 {
  padding-bottom: 1rem;
}

.pb-20 {
  padding-bottom: 2rem;
}

.pb-30 {
  padding-bottom: 3rem;
}

.pb-40 {
  padding-bottom: 4rem;
}

.pb-50 {
  padding-bottom: 5rem;
}

.pb-60 {
  padding-bottom: 6rem;
}

.pb-70 {
  padding-bottom: 7rem;
}

.pb-80 {
  padding-bottom: 8rem;
}

.pb-90 {
  padding-bottom: 9rem;
}

.pb-100 {
  padding-bottom: 10rem;
}

.pl-10 {
  padding-left: 1rem;
}

.pl-20 {
  padding-left: 2rem;
}

.pl-30 {
  padding-left: 3rem;
}

.pl-40 {
  padding-left: 4rem;
}

.pl-50 {
  padding-left: 5rem;
}

.pl-60 {
  padding-left: 6rem;
}

.pl-70 {
  padding-left: 7rem;
}

.pl-80 {
  padding-left: 8rem;
}

.pl-90 {
  padding-left: 9rem;
}

.pl-100 {
  padding-left: 10rem;
}

.py-10 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.py-15 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.py-20 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.py-25 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

.py-30 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.py-35 {
  padding-top: 3.5rem;
  padding-bottom: 3.5rem;
}

.py-40 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.py-45 {
  padding-top: 4.5rem;
  padding-bottom: 4.5rem;
}

.py-50 {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.px-10 {
  padding-right: 1rem;
  padding-left: 1rem;
}

.px-15 {
  padding-right: 1.5rem;
  padding-left: 1.5rem;
}

.px-20 {
  padding-right: 2rem;
  padding-left: 2rem;
}

.px-25 {
  padding-right: 2.5rem;
  padding-left: 2.5rem;
}

.px-30 {
  padding-right: 3rem;
  padding-left: 3rem;
}

.px-35 {
  padding-right: 3.5rem;
  padding-left: 3.5rem;
}

.px-40 {
  padding-right: 4rem;
  padding-left: 4rem;
}

.px-45 {
  padding-right: 4.5rem;
  padding-left: 4.5rem;
}

.px-50 {
  padding-right: 5rem;
  padding-left: 5rem;
}

/* ----- font-weight ----- */

.fw-400 {
  font-weight: 500;
}

.fw-500 {
  font-weight: 500;
}

.fw-600 {
  font-weight: 600;
}

.fw-700 {
  font-weight: 700;
}

.fw-900 {
  font-weight: 900;
}

/* ----- line-height----- */

.lh-12 {
  line-height: 1.2;
}

.lh-14 {
  line-height: 1.4;
}

.lh-16 {
  line-height: 1.6;
}

.lh-18 {
  line-height: 1.8;
}

.lh-20 {
  line-height: 2;
}

/* ----- letter-spacing ----- */

.ls-002 {
  letter-spacing: 0.02em;
}

.ls-004 {
  letter-spacing: 0.04em;
}

.ls-006 {
  letter-spacing: 0.06em;
}

.ls-008 {
  letter-spacing: 0.08em;
}

.ls-010 {
  letter-spacing: 0.1em;
}

.ls--002 {
  letter-spacing: -0.02em;
}

.ls--004 {
  letter-spacing: -0.04em;
}

.ls--006 {
  letter-spacing: -0.06em;
}

.ls--008 {
  letter-spacing: -0.08em;
}

.ls--010 {
  letter-spacing: -0.1em;
}

/* ----- flex-box ----- */

.flex {
  display: flex;
}

.justify-content-space-between {
  justify-content: space-between;
}

.align-items-center {
  align-items: center;
}

/* ----- decoration ----- */

.under-line {
  text-decoration: underline;
}

.line-yellow {
  background: linear-gradient(transparent 55%, #ffea00 55%);
}

.line-yellow-sml {
  background: linear-gradient(transparent 75%, #ffea00 75%);
}

/* ----- border ----- */

.bb-black-1 {
  border-bottom: 1px solid #000;
}

.bb-black-2 {
  border-bottom: 2px solid #000;
}

.bb-black-3 {
  border-bottom: 3px solid #000;
}

/* ----- color ----- */

/* .white {
  color: white;
} */

/* .green {
  color: #3bc4b7;
} */

/* .blue {
  color: #0086d2;
} */

/* .d-blue {
  color: #0e4085;
} */

/* .red {
  color: #ff5b5b;
} */

/* .pink {
  color: #ff6186;
} */

/* ----- background-color ----- */

/* .bg-green {
  background-color: #81d8d0;
} */

/* .bg-light-green {
  background-color: #f3feff;
} */

/* .bg-yellow {
  background-color: #fffbdd;
} */

/* .bg-white {
  background-color: #fff;
} */

/* ----- border-radius ----- */

.border-radius-05 {
  border-radius: 0.5rem;
}

/* ----- position ----- */

.relative {
  position: relative;
}

/* ----- hasen-box----- */

.hasen-box {
  padding: 3.5rem 2rem;
  background-image: linear-gradient(to right, #ff006c, #ff006c 0.9rem, transparent 0.9rem, transparent 1.2rem),
    /* 上の線 */ linear-gradient(to bottom, #ff006c, #ff006c 0.9rem, transparent 0.9rem, transparent 1.2rem),
    /* 右の線 */ linear-gradient(to left, #ff006c, #ff006c 0.9rem, transparent 0.9rem, transparent 1.2rem),
    /* 下の線 */ linear-gradient(to top, #ff006c, #ff006c 0.9rem, transparent 0.9rem, transparent 1.2rem); /* 左の線 */
  background-size: 1.2rem 0.3rem, /* 上の線 */ 0.3rem 1.2rem, /* 右の線 */ 1.2rem 0.3rem, /* 下の線 */ 0.3rem 1.2rem; /* 左の線 */
  background-position: left top, /* 上の線 */ right top, /* 右の線 */ right bottom, /* 下の線 */ left bottom; /* 左の線 */
  background-repeat: repeat-x, /* 上の線 */ repeat-y, /* 右の線 */ repeat-x, /* 下の線 */ repeat-y; /* 左の線 */
}
