/* 数字で見る */

.data-intro__text > p,
.data-stat-card > p:not(.data-card-note) {
  text-indent: 0;
}

.data-intro {
  background:#fff;
}

.data-intro__text {
  padding-top:0;
}

.data-intro__text p {
  margin:0 0 2rem;
  font-size:1.8rem;
  line-height:2.05;
}

.data-block {
  position:relative;
}

.data-block--training {
  background:#f5fbfe;
}

.data-block--work {
  background:#e8f7fe;
}

.data-section-head {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:4rem;
  margin-bottom:6rem;
}

.data-section-head h2 {
  margin: 0;
}

.data-section-head__note {
  margin:0 0 .6rem;
  font-size:1.6rem;
  line-height:1.7;
  text-align:right;
}

.data-stat-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:2.4rem;
}

.data-stat-card {
  position:relative;
  overflow:hidden;
  min-height:34rem;
  padding:4rem;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(15,95,152,.08);
  border-radius:1rem;
  box-shadow:0 1.2rem 3.5rem rgba(45,104,142,.08);
}

.data-stat-card--wide {
  grid-column:1/-1;
}

.data-stat-card::after {
  content:"";
  position:absolute;
  right:-6rem;
  bottom:-8rem;
  width:20rem;
  aspect-ratio:1;
  border-radius:50%;
  background:#edf8fd;
}

.data-stat-card > * {
  position:relative;
  z-index:1;
}

.data-stat-card__icon,
.data-mini-card__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:6rem;
  height:6rem;
  margin-bottom:2rem;
  border-radius:50%;
  background:#edf8fd;
  color:var(--blue);
  font-size:2.4rem;
}

.data-stat-card h3,
.data-mini-card h3 {
  margin:0;
  font-size:2rem;
  font-weight:600;
  line-height:1.6;
  color: var(--blue);
}

.data-compare {
  display:grid;
  grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr);
  gap:3rem;
  align-items:center;
  margin-top:3rem;
}

.data-compare__divider {
  width:1px;
  height:8rem;
  background:#a9d5fd;
}

.data-compare__col small {
  display:block;
  margin-bottom:.8rem;
  color:var(--blue);
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.6rem;
  letter-spacing:.08em;
}

.data-compare__col strong {
  display:block;
  color:var(--blue);
  font-family:var(--serif);
  font-size:clamp(4.6rem,5vw,7rem);
  font-weight:500;
  line-height:1;
  letter-spacing:-.03em;
  white-space:nowrap;
  text-align: center;
}

.data-compare__col strong span {
  margin-left:.15em;
  font-size:.38em;
  letter-spacing:0;
}

.data-compare__col--jiam small,
.data-compare__col--jiam strong {
  color:var(--blue);
}

.data-work-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:2.4rem;
}

.data-mini-card {
  position:relative;
  padding:3.6rem;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(15,95,152,.08);
  border-radius:1rem;
  box-shadow:0 1.2rem 3.5rem rgba(45,104,142,.08);
}

.data-mini-card__top {
  display:flex;
  align-items:center;
  gap:1.8rem;
  margin-bottom:2.8rem;
}

.data-mini-card__top .data-mini-card__icon {
  flex:0 0 5.4rem;
  width:5.4rem;
  height:5.4rem;
  margin:0;
  font-size:2.1rem;
}

.data-compare--compact {
  margin-top:2rem;
}

.data-card-note {
  margin:2.2rem 0 0;
  color:#74818a;
  font-size:1.6rem;
  line-height:1.7;
}

.ratio-set + .ratio-set {
  margin-top:2.4rem;
}

.ratio-set__head {
  display:flex;
  justify-content:space-between;
  gap:2rem;
  margin-bottom:1rem;
}

.ratio-set__head span {
  color:var(--blue);
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.4rem;
}

.ratio-bar {
  display:flex;
  width:100%;
  height:5rem;
  overflow:hidden;
  background:#edf3f6;
}

.ratio-bar > span {
  flex-direction:column;
  gap:.3rem;
  line-height:1.2;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#243744;
  font-family: var(--serif);
  font-size:1.8rem;
  font-weight:600;
  text-shadow:none;
}

.ratio-bar__male {
  background: #73bfe3;
}

.ratio-bar__label {
  font-family: var(--sans);
  font-size: 1.4rem;
  font-weight: inherit;
  min-width: 0;
  white-space: normal;
}

.ratio-bar__caption {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: .6rem;
  max-width: calc(100% - .8rem);
  padding: .3rem .6rem;
  border-radius: .4rem;
  background: rgba(255, 255, 255, .88);
}

.ratio-bar__value {
  flex-shrink: 0;
  white-space: nowrap;
}

@media (max-width: 1024px) {
  .ratio-bar__label { font-size: 1.2rem; }
}

@media (max-width: 767px) {
  .ratio-bar__label { font-size: clamp(1rem, 2.8vw, 1.2rem); }
}

.ratio-bar__female {
  background: #f6c76b;
}

.ratio-bar__regular {
  background: #6fa9d8;
}

.ratio-bar__dispatch {
  background: #91d6a0;
}

.age-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:3rem;
}

.data-age-card .age-grid {
  position:relative;
  gap:6rem;
}

.data-age-card::after {
  content:none;
}

.data-age-card .age-grid::before {
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  width:1px;
  background:#a9d5fd;
}

.data-age-card .age-card {
  min-width:0;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
}

.data-age-card .age-card__head h4 {
  margin:0;
  color:#34434d;
  font-size:1.8rem;
  font-weight:600;
}

.age-card {
  padding:4rem;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(15,95,152,.08);
  border-top:3px solid var(--blue);
  border-radius:1rem;
  box-shadow:0 1.2rem 3.5rem rgba(45,104,142,.08);
}

.age-card--jiam {
  border-top-color:var(--blue);
}

.age-card__head {
  margin-bottom:3.4rem;
}

.age-card__head span {
  display:block;
  margin-bottom:.8rem;
  color:var(--blue);
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.5rem;
  letter-spacing:.1em;
}

.age-card__head h3 {
  margin:0;
  color:#34434d;
  font-size:1.8rem;
  font-weight:600;
}

.age-chart {
  display:grid;
  gap:1.6rem;
}

.age-row {
  display:grid;
  grid-template-columns:7rem minmax(0,1fr) 4.5rem;
  gap:1.4rem;
  align-items:center;
}

.age-row > span {
  color:#56636d;
  font-size:1.4rem;
}

.age-row__track {
  height:1.3rem;
  background:#edf3f6;
}

.age-row__track b {
  display:block;
  width:var(--bar);
  height:100%;
  background:linear-gradient(90deg,#0f5f98,#73bfe3);
}

.age-card--jiam .age-row__track b {
  background:linear-gradient(90deg,#0f5f98,#73bfe3);
}

.age-row strong {
  color:var(--blue);
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.4rem;
  text-align:right;
}

@media (max-width:1024px) {
  .data-work-grid {
    grid-template-columns:1fr;
  }
}

@media (max-width:767px) {
  .data-intro__text p {
    font-size:1.6rem;
    line-height:1.95;
  }

  .data-section-head {
    display:block;
    margin-bottom:4rem;
  }

  .data-section-head__note {
    margin-top:1.5rem;
    text-align:left;
  }

  .data-stat-grid {
    grid-template-columns:1fr;
  }

  .data-stat-card--wide {
    grid-column:auto;
  }

  .data-stat-card {
    min-height:0;
    padding:2.6rem 2rem;
  }

  .data-compare {
    gap:1.6rem;
  }

  .data-compare__divider {
    height:6rem;
  }

  .data-compare__col strong {
    font-size:clamp(3.2rem,10vw,4.8rem);
  }

  .data-mini-card {
    padding:2.5rem 2rem;
  }

  .ratio-set__head {
    display:block;
  }

  .ratio-bar {
    height:4.4rem;
  }

  .ratio-bar > span {
    font-size:1.2rem;
  }

  .age-grid {
    grid-template-columns:1fr;
  }

  .data-age-card .age-grid {
    gap:3rem;
  }

  .data-age-card .age-grid::before {
    display:none;
  }

  .age-card {
    padding:2.8rem 2rem;
  }

  .age-row {
    grid-template-columns:6rem 1fr 4rem;
    gap:1rem;
  }
}

@media (max-width:520px) {
  .data-compare {
    gap:1rem;
  }

  .data-compare__col small {
    font-size:1.1rem;
  }

  .data-compare__col strong {
    font-size:3.1rem;
  }

  .age-row {
    grid-template-columns:5.8rem 1fr 3.8rem;
  }
}