main {
  padding-bottom: 0;
}

.sp {
  display: none;
}

#ci-mainvisual-bg {
  background-image:
    url(../img/bg.png),
    linear-gradient(339deg, #74E0D1 10.38%, #2671C6 55.95%, #0E61C0 86.32%);
  background-repeat: no-repeat, no-repeat;
  background-position: right top, center;
  background-size: auto 100%, cover;
  overflow: hidden;
  padding: 80px 0 120px 0;
  position: relative;
}

#ci-mainvisual-bg:before,
#ci-mainvisual-bg:after {
  background-repeat: no-repeat;
  background-size: auto 100%;
  content: "";
  position: absolute;
  z-index: 1;
}

#ci-mainvisual-bg:before {
  background-image: url(../img/bg_left_w820.png);
  background-position: left center;
  top: 0;
  left: 0;
  max-width: 171px;
  width: 100%;
  aspect-ratio: 171/1750;
}

#ci-mainvisual-bg:after {
  background-image: url(../img/bg_right_w820.png);
  background-position: top right;
  top: 0;
  right: 0;
  max-width: 721px;
  width: 100%;
  aspect-ratio: 721/1181;
}

.ci-mainvisual-title-area {
  padding: 0 120px;
  margin-bottom: 140px;
  position: relative;
  z-index: 10;
}

.ci-mainvisual-date {
  display: inline-block;
  padding: 12px 24px;
  border-radius: 4px;
  border: 1px solid #FFF;
  margin-bottom: 36px;
  color: #FFF;
  font-family: var(--rur-font-family-ja);
  font-size: 28px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 2.8px;
}

.ci-mainvisual-title {
  margin-bottom: 80px;
  color: #FFF;
  font-family: var(--rur-font-family-ja);
  font-size: 28px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 2.8px;
}

.ci-mainvisual-logo {
  width: 100%;
  max-width: 701px;
  margin-bottom: 100px;
}

.ci-mainvisual-description {
  color: #FFF;
  font-family: var(--rur-font-family-ja);
  font-size: 20px;
  font-style: normal;
  font-weight: 300;
  line-height: 170%;
  letter-spacing: 1px;
}

.ci-mainvisual-info-area {
  padding: 0 120px;
  position: relative;
  z-index: 10;
}

.ci-mainvisual-info-container {
  border-radius: 20px;
  background: #FFF;
  padding: var(--rur-spacing-3xl) 20px;
}

.ci-mainvisual-info-list {
  gap: 0;
  max-width: 900px;
  width: 100%;
}

.ci-mainvisual-info-list-layout {
  flex-direction: row;
  gap: var(--rur-spacing-3xl);
}

.ci-mainvisual-info-list-title {
  color: var(--ren-color-text-secondary);
  font-family: var(--rur-font-family-ja);
  font-size: 20px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  letter-spacing: 1px;
  width: 188px;
  padding-right: var(--rur-spacing-md);
  box-sizing: border-box;
  border-right: 1px solid var(--rur-color-border-primary);
}

.ci-mainvisual-info-list-data {
  padding-bottom: 24px;
}

.ci-mainvisual-info-list-text {
  color: var(--ren-color-text-secondary);
  font-family: var(--rur-font-family-ja);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 1px;
}

.ci-mainvisual-info-list-subtext {
  color: var(--ren-color-text-secondary);
  font-family: var(--rur-font-family-ja);
  font-size: 16px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  letter-spacing: 0.8px;
}

.ci-mainvisual-anchor-link-area {
  width: 100%;
  max-width: 900px;
}

.ci-contents {
  background: #FFF;
  padding: var(--rur-spacing-3xl) 0;
}

.ci-contents-section {
  padding: 0 20px;
  width: 100%;
  max-width: 900px;
}

.ci-contents .rur-divider {
  width: 100%;
}

.ci-contents-section-text {
  color: var(--rur-color-text-primary);
  font-family: var(--rur-typography-ja-text-md-font-family);
  font-size: var(--rur-typography-ja-text-md-font-size);
  font-weight: var(--rur-typography-ja-text-md-font-weight);
  letter-spacing: var(--rur-typography-ja-text-md-letter-spacing);
  line-height: var(--rur-typography-ja-text-md-line-height);
}

.ci-contents-faq-title {
  display: inline-block;
  flex: 1;
  font-family: var(--rur-typography-ja-heading-default-h5-font-family);
  font-size: var(--rur-typography-ja-heading-default-h5-font-size);
  font-weight: var(--rur-typography-ja-heading-default-h5-font-weight);
  letter-spacing: var(--rur-typography-ja-heading-default-h5-letter-spacing);
  line-height: var(--rur-typography-ja-heading-default-h5-line-height);
  color: var(--rur-color-text-state-normal);
}

.rur-accordion summary:hover .ci-contents-faq-title {
  color: var(--rur-color-accordion-font-hover);
}

.rur-accordion summary:active .ci-contents-faq-title {
  color: var(--rur-color-text-state-active);
}

.rur-accordion summary:focus-visible .ci-contents-faq-title {
  color: var(--rur-color-text-state-focus);
}


@media screen and (min-width: 1440px) {
  #ci-mainvisual-bg {
    background-size: cover;
  }
}

@media screen and (max-width: 819px) {
  .sp {
    display: block;
  }

  #ci-mainvisual-bg {
    padding: 80px 0 32px 0;
  }

  #ci-mainvisual-bg:before {
    content: none;
  }

  #ci-mainvisual-bg:after {
    aspect-ratio: 299/843;
    background-image: url(../img/bg_right_w819.png);
    max-width: 299px;
  }

  .ci-mainvisual-title-area {
    padding: 0 28px;
    margin-bottom: 120px;
  }

  .ci-mainvisual-date {
    font-size: 18px;
    margin-bottom: 16px;
    letter-spacing: 1.8px;
  }

  .ci-mainvisual-title {
    font-size: 18px;
    letter-spacing: 1.8px;
    margin-bottom: 36px;
  }

  .ci-mainvisual-logo {
    margin-bottom: 60px;
    max-width: 400px;
  }

  .ci-mainvisual-description {
    font-size: 16px;
    letter-spacing: 0.8px;
  }

  .ci-mainvisual-info-area {
    padding: 0;
  }

  .ci-mainvisual-info-container {
    border-radius: 0;
    padding: var(--rur-spacing-3xl) 20px;
  }

  .ci-mainvisual-info-list {
    gap: var(--rur-spacing-lg);
  }

  .ci-mainvisual-info-list-layout {
    flex-direction: column;
    gap: var(--rur-spacing-sm);
  }

  .ci-mainvisual-info-list-title {
    padding-right: 0;
    padding-bottom: var(--rur-spacing-sm);
    border-right: none;
    border-bottom: 1px solid var(--rur-color-border-primary);
    width: auto;
  }

  .ci-mainvisual-info-list-link-title {
    border-bottom: none;
    padding-bottom: 0;
  }

  .ci-mainvisual-info-list-data {
    padding-bottom: 12px;
  }

  .ci-mainvisual-info-list-title,
  .ci-mainvisual-info-list-text {
    font-size: 18px;
    letter-spacing: 0.9px;
  }

  .ci-mainvisual-info-list-subtext {
    font-size: 14px;
    letter-spacing: 0.7px;
  }
}
