@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700;800&display=swap');
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  line-height: 1.7;
}

img {
  width: 100%;
  max-width: 100%;
  vertical-align: middle;
}

a {
  text-decoration: none;
  color: inherit;
}

a:hover,
a:focus,
a:visited {
  text-decoration: none;
  color: inherit;
}

.pc-only {
  display: none;
}

@media screen and (min-width:768px) {
  .pc-only {
    display: block;
  }

  .sp-only {
    display: none;
  }
}

.c5-main {
  width: 100%;
  margin: 0 auto;
  font-family:"Noto Sans JP", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, Osaka, "ＭＳ Ｐゴシック", sans-serif;
  font-weight: normal;
}

.c5-main__container {
  margin: 0 auto;
  padding: 0 calc(40 / 750 * 100vw) 60px;
}

@media screen and (min-width:768px) {
  .c5-main {
    max-width: 1260px;
    margin: 0 auto;
  }

  .c5-main__container {
    padding: 0 9.6%;
  }
}


.c5-lead__inner {
  margin-top: 5.3%;
}

.c5-lead dl dt {
  display: flex;
  font-size: calc(18 / 750 * 100vw);
  font-weight: 700;
  text-transform: uppercase;
}

.c5-lead dl dt::before {
  content: "";
  display: block;
  width: calc(30 / 750 * 100vw);
  height: calc(30 / 750 * 100vw);
  margin-right: 1.6%;
  border-radius: 50%;
}

.c5-lead dl dd {
  margin-top: 3.8%;
  font-size: calc(32 / 750 * 100vw);
  font-weight: 700;
}

@media screen and (min-width:768px) {

  .c5-lead__inner {
    margin-top: 20px;
  }

  .c5-lead dl dt {
    display: flex;
    font-size: 14px;
  }

  .c5-lead dl dt::before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    margin-right: 8px;
    border-radius: 50%;
  }

  .c5-lead dl dd {
    margin-top: 10px;
    font-size: min(calc(28 / 1260 * 100vw), 28px);
  }

}



.c5-article__inner {
  margin-top: calc(120 / 750 * 100vw);
}

.c5-article__inner .c5-article__content,
.c5-kv__container {
  display: block;
}
/* ここのマージンを消す？ */
.c5-article__inner .c5-article__content:not(:first-child) {
  margin-top: calc(80 / 750 * 100vw);
}

.c5-article__content dl dt {
  display: flex;
  margin-top: 5.3%;
  font-size: calc(18 / 750 * 100vw);
  font-weight: 700;
  text-transform: uppercase;
}

.c5-article__content dl dt::before {
  content: "";
  display: block;
  width: calc(30 / 750 * 100vw);
  height: calc(30 / 750 * 100vw);
  margin-right: 1.6%;
  border-radius: 50%;
}

.c5-article__content dl dd {
  margin-top: 3%;
  font-size: calc(28 / 750 * 100vw);
  font-weight: 700;
}

@media screen and (min-width:768px) {
  .c5-article__inner {
    margin-top: 40px;
  }

  .c5-article__inner .c5-article__content {
    display: flex;
    gap: 30px;
  }

  .c5-article__inner .c5-article__content:not(:first-child) {
    margin-top: 40px;
  }

  .c5-article__content figure {
    width: 32%;
  }

  .c5-article__content dl {
    width: 64%;
  }

  .c5-article__content dl dt {
    display: flex;
    margin-top: 0;
    font-size: 14px;
  }
  .c5-article__content dl dt::before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    margin-right: 8px;
  }

  .c5-article__content dl dd {
    margin-top: 8px;
    font-size: min(calc(24 / 1260 * 100vw), 24px);
    line-height: 1.7;
  }
}


@media (any-hover: hover) and (any-pointer: fine) {
  .c5-article__content:hover,
  .c5-kv__container:hover {
    color: #000;
    opacity: 0.7;
  }
}

dl dt.blue::before {
  background-color: #3ECBFF;
}

dl dt.purple::before {
  background-color: #793EFF;
}

dl dt.orange::before {
  background-color: #FF883E;
}

dl dt.green::before {
  background-color: #26EF3D;
}

dl dt.yellow::before {
  background-color: #FFF618;
}
.c5-lead__inner dl dt span {
  color: #fff;
  padding: 4px  20px;
  line-height: 1;
}
.c5-article__content dl dt span {
  color: #fff;
  padding: 4px  20px;
  line-height: 1;
}