:root {
  --color-black: #222;
  --color-red: #FA0C0F;
  --color-red2: #cc0000;
  --color-red3: #7D0008;
  --color-blue: #2D5686;
  --color-gray: #F4F4F4;
  --color-gray2: #D9D9D9;
  --color-gray3: #B3B3B3;
  --color-gray4: #737373;
  --color-gray5: #4D4D4D;
  --color-gray6: #222;
  --color-yellowTag: #F0A632;
  --headerH: 105px;
  --contW-max: 1275px;
  --transVals: 0.3s ease;
}
@media screen and (max-width: 767px) {
  .JS #Contents {
    padding-bottom: 0;
  }
}

@media not all and (max-width: 767px), print {
  .Section {
    padding-bottom: 60px;
  }
}
@media screen and (max-width: 767px) {
  .Section {
    padding-bottom: 30px;
  }
}
@media not all and (max-width: 767px), print {
  .Section > * {
    margin-bottom: 45px;
  }
}
@media screen and (max-width: 767px) {
  .Section > * {
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  .Section > h2 {
    margin-bottom: 30px;
  }
}
.Section .ImgOnlyStyle img {
  margin-bottom: 0;
}
@media not all and (max-width: 767px), print {
  .Section:has(.bl_relatedLinkList) {
    padding-bottom: 38px;
  }
}
@media screen and (max-width: 767px) {
  .Section:has(.bl_horLinkCardList) > h2 {
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 767px) {
  .Section .TextStyle1 {
    letter-spacing: 0.02em;
    line-height: 1.75;
  }
}

@media screen and (max-width: 767px) {
  .PageTitleStyle1 + .Section .TextStyle1 {
    font-size: 81.25% !important;
  }
}

@media not all and (max-width: 767px), print {
  .bl_btnBox__sm {
    padding-block: 47px;
  }
}
@media screen and (max-width: 767px) {
  .bl_btnBox__sm {
    padding-bottom: 25px;
  }
}
@media not all and (max-width: 767px), print {
  .bl_btnBox__sm .el_circleChevronBtn {
    margin-top: -3px;
  }
}

@media not all and (max-width: 767px), print {
  .BoxPatternB {
    margin-bottom: 30px;
    padding-block: 30px;
  }
}
.BoxPatternB h3 {
  display: flex;
  -moz-column-gap: 6px;
  column-gap: 6px;
  margin-bottom: 16px;
  padding-inline: 32px;
  padding-bottom: 0;
  line-height: 1.2;
}
@media not all and (max-width: 767px), print {
  .BoxPatternB h3 {
    font-size: 125%;
  }
}
@media screen and (max-width: 767px) {
  .BoxPatternB h3 {
    font-size: 93.75%;
  }
}
.BoxPatternB h3::before {
  content: "";
  display: block;
  position: relative;
  flex-shrink: 0;
  height: 100%;
  min-height: 24px;
}
.BoxPatternB .TextStyle2 {
  padding-inline: 32px;
  letter-spacing: 0.02em;
  line-height: 1.75;
}
@media not all and (max-width: 767px), print {
  .BoxPatternB .TextStyle2 {
    font-size: 87.5%;
  }
}

.bl_relatedLinkList > li {
  padding-block: 20px;
}
@media screen and (max-width: 767px) {
  .bl_relatedLinkList > li > a {
    font-size: 100%;
  }
}