@charset "UTF-8";
/**
 * Colors
==================== */
/**
 * Breakpoints
 ==================== */
/**
 * Design Sizes
==================== */
/**
 * Spacing Units
==================== */
/**
 * Font sizes
==================== */
/**
 * Font Families
==================== */
/**
 * vw変換
==================== */
/**
 * em変換
==================== */
/**
 * mixins
==================== */
.top__mv {
  position: relative;
}
.top__mv-catch {
  position: absolute;
  top: 4.6527777778vw;
  left: 4.9305555556vw;
  max-width: 34.8611111111vw;
  z-index: 1;
}
@media (max-width: 1020px) {
  .top__mv-catch {
    top: 6.4vw;
    left: 0;
    max-width: 100%;
    padding: 0 6.4vw;
  }
}
.top__mv-img {
  position: relative;
  display: block;
}
.top__mv-img img {
  display: block;
}
.top__mv-message {
  color: var(--clr-text-white);
  background: url("/wp-content/themes/dpops-ab-children/assets/img/top/mv/top-mv-bg-pc.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom;
  padding: 5.5555555556vw 0 9.0277777778vw;
  display: flex;
  gap: 2.7777777778vw;
  flex-direction: column;
  align-items: center;
}
@media (max-width: 1020px) {
  .top__mv-message {
    background: url("/wp-content/themes/dpops-ab-children/assets/img/top/mv/top-mv-bg-sp.webp");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom 2.6666666667vw center;
    padding: 5.3333333333vw 0 23.2vw;
    gap: 4.2666666667vw;
  }
}
.top__mv-message h1 {
  text-align: center;
  font-size: 2.5vw;
  font-weight: 700;
  line-height: 150%;
  letter-spacing: 0.05vw;
}
@media (max-width: 1020px) {
  .top__mv-message h1 {
    font-size: 7.4666666667vw;
    letter-spacing: 0.1493333333vw;
    padding: 0 6.4vw;
  }
}
.top__mv-message p {
  text-align: center;
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__mv-message p {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
    padding: 0 7.4666666667vw;
  }
}
.top__section-title {
  width: 100%;
  display: flex;
  gap: 2.2222222222vw;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__section-title {
    gap: 6.4vw;
  }
}
.top__section-title:has(p.-bg) {
  gap: 0;
}
@media (max-width: 1020px) {
  .top__section-title:has(p.-bg) {
    gap: 6.4vw;
  }
}
.top__section-title h2 {
  display: flex;
  flex-direction: column;
  text-align: center;
  font-family: "Zalando Sans", sans-serif;
  font-size: 3.6111111111vw;
  font-weight: 900;
  line-height: 150%;
  letter-spacing: 0.1444444444vw;
}
@media (max-width: 1020px) {
  .top__section-title h2 {
    font-size: 11.7333333333vw;
    line-height: 125%;
    letter-spacing: 0.2346666667vw;
  }
}
.top__section-title h2 span {
  color: var(--clr-light-black);
  text-align: center;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__section-title h2 span {
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__section-title p {
  text-align: center;
  font-size: 1.6666666667vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0333333333vw;
}
@media (max-width: 1020px) {
  .top__section-title p {
    font-size: 5.3333333333vw;
    letter-spacing: 0.1066666667vw;
  }
}
.top__section-title p.-bg {
  width: 100%;
  max-width: 62.1527777778vw;
  padding: 1.1805555556vw 0;
  background: url("/wp-content/themes/dpops-ab-children/assets/img/top/donation/donation-title-bg.webp");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  margin-top: 1.0416666667vw;
}
@media (max-width: 1020px) {
  .top__section-title p.-bg {
    max-width: calc(100% - 12.8vw);
    padding: 0 0 6.6666666667vw;
    background-position: bottom;
    background-size: contain;
    margin-top: unset;
  }
}
.top__mission {
  padding: 4.4444444444vw 0 6.6666666667vw;
  display: flex;
  gap: 5.5555555556vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__mission {
    padding: 8.5333333333vw 6.4vw 10.6666666667vw;
    gap: 10.6666666667vw;
  }
}
.top__mission-upper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4.4444444444vw;
}
@media (max-width: 1020px) {
  .top__mission-upper {
    gap: 10.6666666667vw;
  }
}
.top__mission-upper-point {
  display: grid;
  gap: 1.9444444444vw;
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 1020px) {
  .top__mission-upper-point {
    gap: 5.3333333333vw;
    grid-template-columns: repeat(1, 1fr);
  }
}
.top__mission-upper-point-block {
  display: flex;
  gap: 1.1111111111vw;
  align-items: center;
  flex-direction: column;
  padding: 2.2222222222vw;
}
@media (max-width: 1020px) {
  .top__mission-upper-point-block {
    gap: 1.8666666667vw;
    padding: 6.4vw;
  }
}
.top__mission-upper-heart {
  max-width: 5vw;
  margin: 0 auto;
}
@media (max-width: 1020px) {
  .top__mission-upper-heart {
    max-width: 17.0666666667vw;
  }
}
.top__mission-upper-point-detail {
  display: flex;
  gap: 0.8333333333vw;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__mission-upper-point-detail {
    gap: 2.1333333333vw;
  }
}
.top__mission-upper-point-detail h3 {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 4.5833333333vw;
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__mission-upper-point-detail h3 {
    min-height: unset;
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__mission-upper-point-detail p {
  font-size: 0.9722222222vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__mission-upper-point-detail p {
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__mission-bottom {
  position: relative;
  display: flex;
  gap: 4.4444444444vw;
  align-items: flex-end;
  border-radius: 0.2777777778vw;
  padding: 5.5555555556vw 5.5555555556vw 4.4444444444vw;
  border: 1px solid var(--clr-border-gray-3);
}
@media (max-width: 1020px) {
  .top__mission-bottom {
    flex-direction: column;
    align-items: center;
    gap: 5.3333333333vw;
    border-radius: 1.0666666667vw;
    padding: 17.0666666667vw 5.3333333333vw 6.4vw;
  }
}
.top__mission-bottom-message {
  max-width: 11.5972222222vw;
  position: absolute;
  top: 2.7777777778vw;
  right: 2.7083333333vw;
}
@media (max-width: 1020px) {
  .top__mission-bottom-message {
    max-width: 27.7333333333vw;
    top: 5.3333333333vw;
    right: 5.3333333333vw;
  }
}
.top__mission-bottom-detail {
  width: 100%;
  max-width: 51.25vw;
  display: flex;
  gap: 1.1111111111vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__mission-bottom-detail {
    max-width: 100%;
    gap: 4.2666666667vw;
  }
}
.top__mission-bottom-detail h3 {
  font-size: 1.6666666667vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0333333333vw;
}
@media (max-width: 1020px) {
  .top__mission-bottom-detail h3 {
    font-size: 5.3333333333vw;
    letter-spacing: 0.1066666667vw;
  }
}
.top__mission-bottom-sentence {
  display: flex;
  gap: 1.6666666667vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__mission-bottom-sentence {
    gap: 6.4vw;
  }
}
.top__mission-bottom-sentence p {
  flex: 1 0 0;
  text-indent: 1em;
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__mission-bottom-sentence p {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__mission-bottom-senmoto {
  display: flex;
  gap: 1.1111111111vw;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__mission-bottom-senmoto {
    gap: 4.2666666667vw;
  }
}
.top__mission-bottom-senmoto img {
  max-width: 13.75vw;
}
@media (max-width: 1020px) {
  .top__mission-bottom-senmoto img {
    max-width: 52.8vw;
  }
}
.top__mission-bottom-senmoto-profile {
  align-self: stretch;
  display: flex;
  align-items: center;
  flex-direction: column;
  text-align: center;
  font-size: 1.25vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.025vw;
}
@media (max-width: 1020px) {
  .top__mission-bottom-senmoto-profile {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__mission-bottom-senmoto-profile span {
  font-size: 0.9722222222vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__mission-bottom-senmoto-profile span {
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__donation {
  padding: 4.4444444444vw 0 5.5555555556vw;
  display: flex;
  gap: 6.6666666667vw;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__donation {
    padding: 8.5333333333vw 0 10.6666666667vw;
    gap: 17.0666666667vw;
  }
}
.top__donation-upper {
  width: 100%;
  display: flex;
  gap: 3.8194444444vw;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__donation-upper {
    gap: 12.5333333333vw;
  }
}
.top__donation-data {
  width: 100%;
  max-width: 66.875vw;
  padding: 2.2222222222vw 1.3888888889vw;
  display: flex;
  gap: 1.6666666667vw;
  flex-direction: column;
  background: url("/wp-content/themes/dpops-ab-children/assets/img/top/donation/donation-data-bg.webp");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  box-shadow: 2px 2px 8px 0 rgba(0, 0, 0, 0.1);
}
@media (max-width: 1020px) {
  .top__donation-data {
    max-width: 100%;
    padding: 8.5333333333vw 5.3333333333vw;
    gap: 6.4vw;
    background: url("/wp-content/themes/dpops-ab-children/assets/img/top/donation/donation-data-bg-sp.webp");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
}
.top__donation-data-title {
  text-align: center;
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__donation-data-title {
    flex: 1 0 0;
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__donation-data-detail {
  display: flex;
  align-items: center;
  gap: 2.2222222222vw;
  align-self: stretch;
  justify-content: center;
}
@media (max-width: 1020px) {
  .top__donation-data-detail {
    gap: 4.2666666667vw;
    flex-direction: column;
  }
}
.top__donation-data-main {
  display: flex;
  align-items: flex-end;
  gap: 1.6666666667vw;
}
@media (max-width: 1020px) {
  .top__donation-data-main {
    align-items: center;
    gap: 4.2666666667vw;
    flex-direction: column;
  }
}
.top__donation-data-description-1 {
  font-size: 0.9722222222vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__donation-data-description-1 {
    text-align: center;
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__donation-data-description-1 strong {
  color: var(--clr-text-blue);
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__donation-data-description-1 strong {
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__donation-data-description-1 span {
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__donation-data-description-1 span {
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__donation-data-description-2 {
  display: flex;
  gap: 0.5555555556vw;
  align-items: flex-end;
  color: var(--clr-text-blue);
}
@media (max-width: 1020px) {
  .top__donation-data-description-2 {
    gap: 2.1333333333vw;
  }
}
.top__donation-data-description-2 p {
  font-family: "Zalando Sans", sans-serif;
  font-size: 4.4444444444vw;
  font-weight: 700;
  line-height: 125%;
  letter-spacing: 0.0888888889vw;
}
@media (max-width: 1020px) {
  .top__donation-data-description-2 p {
    font-size: 11.7333333333vw;
    letter-spacing: 0.2346666667vw;
  }
}
.top__donation-data-description-2 span {
  font-size: 1.9444444444vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0388888889vw;
}
@media (max-width: 1020px) {
  .top__donation-data-description-2 span {
    font-size: 6.4vw;
    letter-spacing: 0.128vw;
  }
}
.top__donation-data-description-3 {
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__donation-data-description-3 {
    text-align: center;
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__donation-data-description-3 strong {
  font-size: 1.3888888889vw;
  font-weight: 700;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__donation-data-description-3 strong {
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__donation-problem {
  display: flex;
  gap: 1.3888888889vw;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__donation-problem {
    gap: 5.3333333333vw;
  }
}
.top__donation-problem-main {
  width: 100%;
  max-width: 57.9166666667vw;
  display: flex;
  gap: 0.5555555556vw;
  flex-direction: column;
  align-items: center;
  padding: 1.6666666667vw 4.4444444444vw 0.8333333333vw;
  border-radius: 0.2777777778vw;
  border: 1px solid var(--clr-border-green);
}
@media (max-width: 1020px) {
  .top__donation-problem-main {
    max-width: 100%;
    gap: 2.1333333333vw;
    padding: 6.4vw 2.5333333333vw 3.2vw;
    border-radius: 1.0666666667vw;
  }
}
.top__donation-problem-main h4 {
  text-align: center;
  font-size: 1.25vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.025vw;
}
@media (max-width: 1020px) {
  .top__donation-problem-main h4 {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__donation-problem-main small {
  text-align: center;
  font-size: 0.8333333333vw;
  font-weight: 500;
  line-height: 150%;
}
@media (max-width: 1020px) {
  .top__donation-problem-main small {
    text-align: left;
    font-size: 3.2vw;
  }
}
.top__donation-problem-data {
  display: flex;
  gap: 1.1111111111vw;
  align-items: center;
  justify-content: center;
}
@media (max-width: 1020px) {
  .top__donation-problem-data {
    gap: 1.0666666667vw;
    flex-direction: column;
  }
}
.top__donation-problem-icon {
  width: 1.6666666667vw;
  height: 1.6666666667vw;
}
@media (max-width: 1020px) {
  .top__donation-problem-icon {
    width: 6.4vw;
    height: 6.4vw;
  }
}
@media (max-width: 1020px) {
  .top__donation-problem-icon.-arrow {
    transform: rotate(90deg);
  }
}
.top__donation-problem-compare {
  display: flex;
  align-items: center;
  gap: 0.5555555556vw;
}
@media (max-width: 1020px) {
  .top__donation-problem-compare {
    gap: 2.1333333333vw;
  }
}
.top__donation-problem-year {
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__donation-problem-year {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__donation-problem-cases {
  display: flex;
  align-items: flex-end;
  gap: 0.5555555556vw;
  color: var(--clr-text-blue);
}
@media (max-width: 1020px) {
  .top__donation-problem-cases {
    gap: 2.1333333333vw;
  }
}
.top__donation-problem-cases strong {
  font-family: "Zalando Sans", sans-serif;
  font-size: 2.5vw;
  font-weight: 900;
  line-height: 150%;
  letter-spacing: w(0.72, "pc");
}
@media (max-width: 1020px) {
  .top__donation-problem-cases strong {
    font-size: 9.6vw;
    letter-spacing: w(0.72, "sp");
  }
}
.top__donation-problem-cases span {
  font-size: 1.25vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.025vw;
  padding-bottom: 0.5555555556vw;
}
@media (max-width: 1020px) {
  .top__donation-problem-cases span {
    font-size: 4.2666666667vw;
    letter-spacing: w(0.32, "sp");
    padding-bottom: 2.1333333333vw;
  }
}
.top__donation-problem-supplement {
  display: flex;
  gap: 0.2777777778vw;
  align-items: center;
}
@media (max-width: 1020px) {
  .top__donation-problem-supplement {
    gap: 1.0666666667vw;
  }
}
.top__donation-problem-supplement span {
  font-size: 1.25vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.025vw;
}
@media (max-width: 1020px) {
  .top__donation-problem-supplement span {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__donation-problem-supplement-factor {
  display: flex;
  gap: 0.5555555556vw;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__donation-problem-supplement-factor {
    gap: 2.1333333333vw;
    padding: 0 5.3333333333vw;
  }
}
.top__donation-problem-supplement-factor p {
  text-align: center;
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__donation-problem-supplement-factor p {
    flex: 1 0 0;
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__donation-problem-supplement-factor ul {
  display: flex;
  gap: 1.3888888889vw;
  align-items: center;
  flex-direction: row;
  font-size: 0.9722222222vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__donation-problem-supplement-factor ul {
    gap: 2.1333333333vw;
    align-items: flex-start;
    flex-direction: column;
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__donation-bottom {
  display: flex;
  gap: 2.2222222222vw;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__donation-bottom {
    gap: 6.4vw;
    padding: 0 6.4vw;
  }
}
.top__donation-bottom-title {
  display: flex;
  padding-bottom: 0.5555555556vw;
  flex-direction: column;
  align-items: center;
  gap: 0.8333333333vw;
  align-self: stretch;
  text-align: center;
  color: var(--clr-light-black);
  font-size: 1.9444444444vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0388888889vw;
}
@media (max-width: 1020px) {
  .top__donation-bottom-title {
    padding-bottom: 2.1333333333vw;
    gap: 3.2vw;
    font-size: 6.4vw;
    letter-spacing: 0.128vw;
  }
}
.top__donation-bottom-title span {
  color: var(--clr-text-blue);
  font-size: 1.3888888889vw;
  line-height: normal;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__donation-bottom-title span {
    align-self: stretch;
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__donation-description {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1.1111111111vw;
  align-self: stretch;
}
@media (max-width: 1020px) {
  .top__donation-description {
    gap: 4.2666666667vw;
  }
}
.top__donation-description-main {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1.1111111111vw;
  align-self: stretch;
}
@media (max-width: 1020px) {
  .top__donation-description-main {
    gap: 4.2666666667vw;
  }
}
.top__donation-description-main p {
  text-align: center;
  font-size: 1.1111111111vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__donation-description-main p {
    text-align: left;
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__donation-description-main p a {
  text-decoration: underline;
}
.top__donation-description-sub {
  text-align: center;
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__donation-description-sub {
    text-align: left;
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__donation-description-sub span {
  font-size: 0.9722222222vw;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__donation-description-sub span {
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__donation-method {
  display: flex;
  gap: 1.6666666667vw;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__donation-method {
    gap: 5.3333333333vw;
  }
}
.top__donation-method-title {
  text-align: center;
  font-size: 1.6666666667vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0333333333vw;
}
@media (max-width: 1020px) {
  .top__donation-method-title {
    font-size: 5.3333333333vw;
    letter-spacing: 0.1066666667vw;
  }
}
.top__donation-method-detail {
  display: grid;
  gap: 2.7777777778vw;
  align-items: center;
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 1020px) {
  .top__donation-method-detail {
    gap: 5.3333333333vw;
    grid-template-columns: repeat(1, 1fr);
    margin-bottom: 1.0666666667vw;
  }
}
.top__donation-method-bock {
  display: inline-flex;
  gap: 0.6944444444vw;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 18.75vw;
  height: 16.6666666667vw;
  aspect-ratio: 9/8;
}
@media (max-width: 1020px) {
  .top__donation-method-bock {
    gap: 2.6666666667vw;
    width: 72vw;
    height: 64vw;
  }
}
.top__donation-method-bock:first-child {
  background: url("/wp-content/themes/dpops-ab-children/assets/img/top/donation/donation-method-bg-1.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.top__donation-method-bock:nth-child(2) {
  background: url("/wp-content/themes/dpops-ab-children/assets/img/top/donation/donation-method-bg-2.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.top__donation-method-bock:last-child {
  background: url("/wp-content/themes/dpops-ab-children/assets/img/top/donation/donation-method-bg-3.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.top__donation-method-bock h4 {
  text-align: center;
  display: flex;
  align-items: center;
  flex-direction: column;
  font-size: 1.6666666667vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0333333333vw;
}
@media (max-width: 1020px) {
  .top__donation-method-bock h4 {
    font-size: 5.3333333333vw;
    letter-spacing: 0.1066666667vw;
  }
}
.top__donation-method-bock h4 span {
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__donation-method-bock h4 span {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__donation-method-bock p {
  text-align: center;
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__donation-method-bock p {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__activities {
  padding: 5.5555555556vw 0;
  display: flex;
  gap: 4.4444444444vw;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__activities {
    padding: 8.5333333333vw 6.4vw 10.6666666667vw;
    gap: 8.5333333333vw;
  }
}
.top__activities-title-wrapper {
  display: flex;
  gap: 1.3888888889vw;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__activities-title-wrapper {
    gap: 4.8vw;
  }
}
.top__activities-middle {
  display: grid;
  align-items: center;
  gap: 1.9444444444vw;
  grid-template-columns: repeat(4, 1fr);
}
@media (max-width: 1020px) {
  .top__activities-middle {
    gap: 5.3333333333vw;
    grid-template-columns: repeat(1, 1fr);
  }
}
.top__activities-block {
  width: 100%;
  min-width: 18.6805555556vw;
  max-width: 18.6805555556vw;
  display: flex;
  gap: 0.9027777778vw;
  flex-direction: column;
  align-items: center;
  flex: 1 0 0;
  align-self: stretch;
  border-radius: 0.2777777778vw;
  padding: 1.9444444444vw 2.2222222222vw 1.3888888889vw;
  border: 1px solid var(--clr-border-gray-3);
}
@media (max-width: 1020px) {
  .top__activities-block {
    min-width: unset;
    max-width: 100%;
    gap: 3.4666666667vw;
    border-radius: 1.0666666667vw;
    padding: 8.5333333333vw;
  }
}
.top__activities-block:has(.-block-3) {
  padding: 1.9444444444vw 1.3888888889vw 1.3888888889vw;
}
@media (max-width: 1020px) {
  .top__activities-block:has(.-block-3) {
    padding: 8.5333333333vw;
  }
}
.top__activities-block-point {
  display: flex;
  align-items: flex-end;
  gap: 0.5555555556vw;
}
@media (max-width: 1020px) {
  .top__activities-block-point {
    gap: 2.1333333333vw;
  }
}
.top__activities-block-point p {
  font-family: "Zalando Sans", sans-serif;
  font-size: 2.5vw;
  font-weight: 900;
  line-height: 150%;
  letter-spacing: 0.05vw;
}
@media (max-width: 1020px) {
  .top__activities-block-point p {
    font-size: 9.6vw;
    letter-spacing: 0.192vw;
  }
}
.top__activities-block-point span {
  align-self: stretch;
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__activities-block-point span {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__activities-block-point span.-yen {
  margin-top: auto;
  margin-bottom: 0.7638888889vw;
}
@media (max-width: 1020px) {
  .top__activities-block-point span.-yen {
    letter-spacing: 2.9333333333vw;
  }
}
.top__activities-block-detail {
  display: flex;
  gap: 1.1111111111vw;
  flex-direction: column;
  align-items: center;
}
@media (max-width: 1020px) {
  .top__activities-block-detail {
    gap: 4.2666666667vw;
  }
}
.top__activities-block-detail:has(.-block-1), .top__activities-block-detail:has(.-block-4) {
  gap: 0.6944444444vw;
}
@media (max-width: 1020px) {
  .top__activities-block-detail:has(.-block-1), .top__activities-block-detail:has(.-block-4) {
    gap: 2.6666666667vw;
  }
}
.top__activities-block-detail:has(.-block-3) p {
  padding: 0 0.8333333333vw;
}
@media (max-width: 1020px) {
  .top__activities-block-detail:has(.-block-3) p {
    padding: 0;
  }
}
.top__activities-block-detail h3 {
  color: var(--clr-text-green);
  text-align: center;
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__activities-block-detail h3 {
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__activities-block-detail h3 small {
  white-space: nowrap;
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__activities-block-detail h3 small {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__activities-block-detail h3.-block-1, .top__activities-block-detail h3.-block-4 {
  font-size: 1.9444444444vw;
  letter-spacing: 0.0388888889vw;
  padding: 0.4861111111vw 0;
}
@media (max-width: 1020px) {
  .top__activities-block-detail h3.-block-1, .top__activities-block-detail h3.-block-4 {
    font-size: 6.4vw;
    letter-spacing: 0.128vw;
    padding: 2.6666666667vw 0;
  }
}
.top__activities-block-detail p {
  flex: 1 0 0;
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__activities-block-detail p {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__activities-bottom {
  display: flex;
  gap: 5.5555555556vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__activities-bottom {
    gap: 10.6666666667vw;
  }
}
.top__activities-apply {
  display: flex;
  gap: 1.6666666667vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__activities-apply {
    gap: 6.4vw;
  }
}
.top__activities-apply h3 {
  color: var(--clr-light-black);
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__activities-apply h3 {
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__activities-apply-detail {
  display: grid;
  gap: 2.7777777778vw 4.4444444444vw;
  align-items: flex-start;
  grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 1020px) {
  .top__activities-apply-detail {
    gap: 6.4vw;
    grid-template-columns: repeat(1, 1fr);
  }
}
.top__activities-apply-detail-block {
  display: flex;
  gap: 0.8333333333vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__activities-apply-detail-block {
    gap: 2.1333333333vw;
  }
}
.top__activities-apply-detail-block h4 {
  color: var(--clr-text-white);
  font-size: 1.25vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.025vw;
  display: flex;
  gap: 0.5555555556vw;
  align-items: center;
  padding: 0.2777777778vw 0.5555555556vw;
  align-self: stretch;
  border-radius: 0.2777777778vw;
  background: var(--clr-text-green);
}
@media (max-width: 1020px) {
  .top__activities-apply-detail-block h4 {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
    gap: 2.1333333333vw;
    padding: 1.0666666667vw 2.1333333333vw;
    border-radius: 1.0666666667vw;
  }
}
.top__activities-apply-detail-block h4 span {
  min-width: 1.6666666667vw;
  height: 1.6666666667vw;
  margin: auto 0;
  text-align: center;
  align-self: stretch;
  color: var(--clr-text-green);
  font-family: "Zalando Sans", sans-serif;
  font-size: 1.25vw;
  font-weight: 700;
  line-height: 100%;
  letter-spacing: 0.025vw;
  padding: 0.2083333333vw 0;
  border-radius: 0.2777777778vw;
  background: var(--clr-text-white);
}
@media (max-width: 1020px) {
  .top__activities-apply-detail-block h4 span {
    min-width: 5.3333333333vw;
    height: 5.3333333333vw;
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
    padding: 0.5333333333vw 0;
    border-radius: 1.0666666667vw;
  }
}
.top__activities-apply-description {
  display: flex;
  gap: 5.7638888889vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__activities-apply-description {
    gap: 4.8vw;
  }
}
.top__activities-apply-description p {
  flex: 1 0 0;
  font-size: 0.9722222222vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__activities-apply-description p {
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__activities-thanks {
  display: flex;
  gap: 2.7777777778vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__activities-thanks {
    gap: 6.4vw;
  }
}
.top__activities-thanks-inner {
  display: flex;
  gap: 4.4444444444vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__activities-thanks-inner {
    gap: 10.6666666667vw;
  }
}
.top__activities-thanks-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.6666666667vw;
  align-self: stretch;
}
@media (max-width: 1020px) {
  .top__activities-thanks-main {
    gap: 6.4vw;
  }
}
.top__activities-thanks-title {
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__activities-thanks-title {
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__activities-thanks-grid {
  display: grid;
  gap: 1.9444444444vw;
  grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 1020px) {
  .top__activities-thanks-grid {
    gap: 6.4vw;
    grid-template-columns: repeat(1, 1fr);
  }
}
.top__activities-thanks-block {
  width: 100%;
  max-width: 52.8472222222vw;
  display: flex;
  gap: 2.2222222222vw;
  flex-direction: column;
  padding: 2.2222222222vw 2.7777777778vw;
  border-radius: 0.2777777778vw;
  background: url("/wp-content/themes/dpops-ab-children/assets/img/top/activities/activities-thanks-bg.webp");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
@media (max-width: 1020px) {
  .top__activities-thanks-block {
    max-width: 100%;
    gap: 8.5333333333vw;
    padding: 8.5333333333vw 5.3333333333vw;
    border-radius: 1.0666666667vw;
  }
}
.top__activities-thanks-sentence {
  display: flex;
  gap: 1.1111111111vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__activities-thanks-sentence {
    gap: 4.2666666667vw;
  }
}
.top__activities-thanks-sentence.-gap-10 {
  gap: 0.6944444444vw;
}
@media (max-width: 1020px) {
  .top__activities-thanks-sentence.-gap-10 {
    gap: 2.6666666667vw;
  }
}
.top__activities-thanks-sentence p {
  font-size: 0.9722222222vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__activities-thanks-sentence p {
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__activities-thanks-signature {
  display: flex;
  gap: 0.5555555556vw;
  align-items: flex-end;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__activities-thanks-signature {
    gap: 2.1333333333vw;
  }
}
.top__activities-thanks-signature p {
  text-align: right;
  font-size: 0.9722222222vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__activities-thanks-signature p {
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__board {
  display: flex;
  padding: 6.6666666667vw 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 4.4444444444vw;
  align-self: stretch;
}
@media (max-width: 1020px) {
  .top__board {
    padding: 8.5333333333vw 6.4vw 10.6666666667vw;
    gap: 17.0666666667vw;
  }
}
.top__board-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2.7777777778vw;
  align-self: stretch;
}
@media (max-width: 1020px) {
  .top__board-main {
    gap: 10.6666666667vw;
  }
}
.top__board-representative {
  display: grid;
  gap: 4.4444444444vw;
  align-items: flex-start;
  align-self: stretch;
  grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 1020px) {
  .top__board-representative {
    gap: 8.5333333333vw;
    grid-template-columns: repeat(1, 1fr);
  }
}
.top__board-representative-block {
  display: flex;
  padding: 1.1111111111vw 1.3888888889vw 1.1111111111vw 0;
  align-items: center;
  gap: 1.6666666667vw;
  flex: 1 0 0;
}
@media (max-width: 1020px) {
  .top__board-representative-block {
    padding: 0;
    gap: 6.4vw;
  }
}
.top__board-representative-block img {
  max-width: 8.3333333333vw;
}
@media (max-width: 1020px) {
  .top__board-representative-block img {
    max-width: 32vw;
  }
}
.top__board-representative-detail {
  display: flex;
  align-items: flex-start;
  gap: 0.5555555556vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__board-representative-detail {
    gap: 2.1333333333vw;
  }
}
.top__board-representative-name {
  color: var(--clr-light-black);
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__board-representative-name {
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__board-representative-profile-1 {
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__board-representative-profile-1 {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__board-representative-profile-2 {
  font-size: 0.9722222222vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__board-representative-profile-2 {
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__board-members {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5555555556vw;
  align-self: stretch;
}
@media (max-width: 1020px) {
  .top__board-members {
    gap: 2.1333333333vw;
  }
}
.top__board-members h3 {
  color: var(--clr-light-black);
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__board-members h3 {
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__board-members-grid {
  width: 100%;
  display: grid;
  gap: 1.1111111111vw;
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 1020px) {
  .top__board-members-grid {
    gap: 4.2666666667vw;
    grid-template-columns: repeat(2, 1fr);
  }
}
.top__board-members-block {
  display: flex;
  gap: 0.2777777778vw;
  flex-direction: column;
  align-items: flex-start;
  padding: 0.8333333333vw 1.1111111111vw;
  border-left: 1px solid var(--clr-border-gray-4);
}
@media (max-width: 1020px) {
  .top__board-members-block {
    gap: 1.0666666667vw;
    padding: 2.1333333333vw;
    border: 1px solid var(--clr-border-gray-4);
  }
}
.top__board-members-name {
  display: flex;
  gap: 0.2777777778vw;
  align-items: center;
}
@media (max-width: 1020px) {
  .top__board-members-name {
    gap: 0.5333333333vw;
  }
}
.top__board-members-name p {
  min-width: 6.25vw;
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__board-members-name p {
    min-width: 21.3333333333vw;
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__board-members-name span {
  text-align: center;
  min-width: 3.9583333333vw;
  font-size: 0.8333333333vw;
  font-weight: 500;
  line-height: 150%;
  padding: 0.1388888889vw 0.2777777778vw;
  border-radius: 0.2777777778vw;
  background: var(--clr-border-y-green);
}
@media (max-width: 1020px) {
  .top__board-members-name span {
    min-width: 15.2vw;
    font-size: 3.2vw;
    padding: 0.5333333333vw 1.0666666667vw;
    border-radius: 1.0666666667vw;
  }
}
.top__board-members-name span.-mint {
  background: var(--clr-bg-mint);
}
.top__board-members-name span.-light-mint {
  background: rgba(193, 230, 221, 0.7);
}
.top__board-members-name span.-p-green {
  background: var(--clr-bg-p-green);
}
.top__board-members-name span.-light-yellow {
  background: var(--clr-bg-light-yellow);
}
.top__board-members-profile {
  flex: 1 0 0;
  font-size: 0.9722222222vw;
  font-weight: 400;
  line-height: 150%;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__board-members-profile {
    font-size: 3.2vw;
    letter-spacing: 0.064vw;
  }
}
.top__board-bottom {
  display: grid;
  gap: 2.2222222222vw;
  align-self: stretch;
  grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 1020px) {
  .top__board-bottom {
    gap: 4.2666666667vw;
  }
}
.top__foundation {
  display: flex;
  padding: 4.4444444444vw 0 5.5555555556vw;
  flex-direction: column;
  gap: 8.3333333333vw;
  align-self: stretch;
}
@media (max-width: 1020px) {
  .top__foundation {
    padding: 8.5333333333vw 6.4vw 10.6666666667vw;
    gap: 10.6666666667vw;
  }
}
.top__foundation-upper {
  display: flex;
  flex-direction: column;
  gap: 4.4444444444vw;
}
@media (max-width: 1020px) {
  .top__foundation-upper {
    gap: 8.5333333333vw;
  }
}
.top__foundation-info {
  width: 100%;
  max-width: 53.0555555556vw;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__foundation-info {
    max-width: 100%;
  }
}
.top__foundation-info-block {
  display: flex;
  gap: 3.6805555556vw;
  align-items: center;
  padding: 0.8333333333vw 0 0.4166666667vw;
}
@media (max-width: 1020px) {
  .top__foundation-info-block {
    gap: 3.4666666667vw;
    align-items: flex-start;
    padding: 0;
  }
}
.top__foundation-info-title {
  min-width: 8.1944444444vw;
  padding: 0.625vw 0 0.625vw 2.2916666667vw;
  background: url("/wp-content/themes/dpops-ab-children/assets/img/top/foundation/foundation-info-bg.webp");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
@media (max-width: 1020px) {
  .top__foundation-info-title {
    min-width: 18.1333333333vw;
    padding: 2.1333333333vw 0 2.1333333333vw 3.4666666667vw;
  }
}
.top__foundation-info-title span {
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__foundation-info-title span {
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__foundation-info-detail {
  padding: 0.5555555556vw 0;
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__foundation-info-detail {
    padding: 2.1333333333vw 0;
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__foundation-info-detail.-p-0 {
  padding: 0;
}
.top__foundation-info-detail small {
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__foundation-info-detail small {
    font-size: 3.2vw;
    line-height: 150%;
    letter-spacing: normal;
  }
}
.top__foundation-bottom {
  width: 100%;
  max-width: 66.8055555556vw;
  margin: 0 auto;
  display: flex;
  gap: 1.6666666667vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__foundation-bottom {
    max-width: 100%;
    gap: 6.4vw;
  }
}
.top__foundation-bottom h3 {
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__foundation-bottom h3 {
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__foundation-history {
  display: flex;
  gap: 3.3333333333vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__foundation-history {
    gap: 12.8vw;
  }
}
.top__foundation-history-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.6666666667vw;
  align-self: stretch;
}
@media (max-width: 1020px) {
  .top__foundation-history-block {
    gap: 6.4vw;
  }
}
.top__foundation-history-year {
  display: flex;
  padding-bottom: 0.2777777778vw;
  align-items: center;
  gap: 0.2777777778vw;
  align-self: stretch;
  border-bottom: 2px solid var(--clr-border-green-2);
}
@media (max-width: 1020px) {
  .top__foundation-history-year {
    padding-bottom: 1.0666666667vw;
    gap: 1.0666666667vw;
  }
}
.top__foundation-history-year h4 {
  font-family: "Zalando Sans", sans-serif;
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 150%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__foundation-history-year h4 {
    font-size: 5.3333333333vw;
    letter-spacing: 0.1066666667vw;
  }
}
.top__foundation-history-year span {
  font-size: 1.1111111111vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
}
@media (max-width: 1020px) {
  .top__foundation-history-year span {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
  }
}
.top__foundation-history-list {
  padding-left: 6.875vw;
  display: flex;
  gap: 1.6666666667vw;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__foundation-history-list {
    padding-left: 0;
    gap: 6.4vw;
  }
}
.top__foundation-history-list-inner {
  display: flex;
  align-items: flex-start;
}
@media (max-width: 1020px) {
  .top__foundation-history-list-inner {
    gap: 0.5333333333vw;
    flex-direction: column;
  }
}
.top__foundation-history-list-inner * {
  font-size: 0.9722222222vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0194444444vw;
}
@media (max-width: 1020px) {
  .top__foundation-history-list-inner * {
    font-size: 3.7333333333vw;
    letter-spacing: 0.0746666667vw;
  }
}
.top__foundation-history-list-inner span {
  min-width: 6.875vw;
}
@media (max-width: 1020px) {
  .top__foundation-history-list-inner span {
    min-width: auto;
  }
}
.top__foundation-history-list-inner p {
  flex: 1 0 0;
}
.top__news {
  display: flex;
  padding-top: 2.7777777778vw;
  border-top: 1px solid var(--clr-border-gray);
  gap: 2.2222222222vw;
  align-items: flex-start;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__news {
    padding: 8.5333333333vw 6.4vw 0;
    gap: 12.8vw;
  }
}
.top__news-inner {
  display: flex;
  align-items: flex-start;
  gap: 1.9444444444vw;
  align-self: stretch;
  justify-content: space-between;
}
@media (max-width: 1020px) {
  .top__news-inner {
    gap: 7.4666666667vw;
    flex-direction: column;
  }
}
.top__news-title {
  width: 100%;
  max-width: 18.6805555556vw;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
@media (max-width: 1020px) {
  .top__news-title {
    max-width: 100%;
  }
}
.top__news-title h2 {
  font-family: "Zalando Sans", sans-serif;
  font-size: 1.9444444444vw;
  font-weight: 900;
  line-height: 150%;
  letter-spacing: 0.0388888889vw;
}
@media (max-width: 1020px) {
  .top__news-title h2 {
    font-size: 7.4666666667vw;
    letter-spacing: 0.1493333333vw;
  }
}
.top__news-title span {
  font-size: 1.3888888889vw;
  font-weight: 700;
  line-height: 165%;
  letter-spacing: 0.0277777778vw;
}
@media (max-width: 1020px) {
  .top__news-title span {
    font-size: 4.8vw;
    letter-spacing: 0.096vw;
  }
}
.top__news-main {
  display: flex;
  gap: 1.6666666667vw;
  align-items: flex-start;
  flex-direction: column;
  width: 100%;
  max-width: 59.375vw;
  padding-right: 5.4166666667vw;
}
@media (max-width: 1020px) {
  .top__news-main {
    gap: 6.4vw;
    max-width: 100%;
    padding-right: 0;
  }
}
.top__news-link {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.8333333333vw 1.3888888889vw;
  padding-left: 0;
}
@media (max-width: 1020px) {
  .top__news-link {
    padding: 0;
    align-items: flex-end;
  }
}
@media (min-width: 1021px) {
  .top__news-link:hover .top__news-link-date,
  .top__news-link:hover .top__news-link-title {
    color: var(--clr-text-blue);
  }
  .top__news-link:hover .top__news-link-arrow {
    transform: translateX(1.6666666667vw);
  }
}
.top__news-link-inner {
  display: flex;
  gap: 1.6666666667vw;
  align-items: center;
}
@media (max-width: 1020px) {
  .top__news-link-inner {
    gap: 2.1333333333vw;
    align-items: flex-start;
    flex-direction: column;
  }
}
.top__news-link-tag {
  text-align: center;
  min-width: 6.9444444444vw;
  padding: 0.1388888889vw 0.5555555556vw;
  border-radius: 0.2777777778vw;
  background: var(--clr-bg-gray);
  color: var(--clr-text-white);
  font-size: 0.8333333333vw;
  font-weight: 500;
  line-height: 150%;
}
@media (max-width: 1020px) {
  .top__news-link-tag {
    min-width: auto;
    padding: 0.5333333333vw 2.1333333333vw;
    border-radius: 1.0666666667vw;
    font-size: 3.2vw;
  }
}
.top__news-link-detail {
  display: flex;
  align-items: center;
  gap: 0.5555555556vw;
  color: var(--clr-light-gray);
}
@media (max-width: 1020px) {
  .top__news-link-detail {
    gap: 0;
    align-items: flex-start;
    flex-direction: column;
  }
}
.top__news-link-date {
  font-family: "Zalando Sans", sans-serif;
  font-size: 1.1111111111vw;
  font-weight: 400;
  line-height: 150%;
  min-width: 6.25vw;
  transition: color 0.3s;
}
@media (max-width: 1020px) {
  .top__news-link-date {
    font-size: 4.2666666667vw;
    min-width: 24vw;
  }
}
.top__news-link-title {
  font-size: 1.1111111111vw;
  font-weight: 500;
  line-height: 165%;
  letter-spacing: 0.0222222222vw;
  text-decoration: underline;
  width: 100%;
  max-width: 34.7222222222vw;
  transition: color 0.3s;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}
@media (max-width: 1020px) {
  .top__news-link-title {
    font-size: 4.2666666667vw;
    letter-spacing: 0.0853333333vw;
    max-width: 77.0666666667vw;
  }
}
.top__news-link-arrow {
  width: 1.6666666667vw;
  height: 1.6666666667vw;
  transition: transform 0.3s;
}
@media (max-width: 1020px) {
  .top__news-link-arrow {
    width: 4.8vw;
    height: 4.8vw;
  }
}
.top__news-pagination {
  width: auto;
  margin-left: auto;
  padding-right: 5.4166666667vw;
}
@media (max-width: 1020px) {
  .top__news-pagination {
    margin-right: auto;
    padding-right: 0;
  }
}

/*# sourceMappingURL=top.css.map */