@charset "UTF-8";

/* --------------------------------------------------
 ::Data
-------------------------------------------------- */
.p-recruit-content {
  background: var(--color-sub);
}
.p-data-block-wrap {
  display: flex;
}
.p-data-block {
  position: relative;
}
.p-data-block__main {
  position: relative;
  background: #fff;
}
.p-data-block__ttl {
  position: absolute;
  top: -1.3em;
  left: -.8em;
  content: 'data.'counter(count, decimal-leading-zero);
  font-weight: bold;
  line-height: 1.5;
}
.p-data-block__ttl::before {
  content: attr(data-en);
  display: block;
  font-family: 'Inter';
  line-height: 1.2;
}
.p-data-block__txt {
  line-height: 1.75;
}
.p-data-block__note {
  position: absolute;
  top: 1em;
  right: 1em;
  color: #999;
}
.p-data-block__sub dt {
  position: relative;
  width: fit-content;
  padding: .538461em .923076em;
  color: #fff;
  background: var(--color-main);
  font-weight: bold;
  line-height: 1.5;
}
.p-data-block__sub dt::after {
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  background: var(--color-main);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  transform: translateX(-50%);
}

/* SP */
@media screen and (max-width: 767px) {
  .p-data-block-wrap {
    flex-direction: column;
    gap: 17.0666666666667vw;
    margin-top: calc(48 / 315 * 100%);
  }
  .p-data-block__main {
    padding: calc(40 / 325 * 100%) calc(10 / 325 * 100%) calc(38 / 325 * 100%);
  }
  .p-data-block__ttl {
    font-size: 0.866666em;
  }
  .p-data-block__ttl::before {
    font-size: 2.153846em;
  }
  .p-data-block__img {
    margin-bottom: .533333em;
  }
  .p-data-block__txt {
    padding: 0 calc(10 / 325 * 100%);
  }
  .p-data-block__note {
    font-size: .666666em;
  }
  .p-data-block__sub {
    padding: 0 calc(20 / 325 * 100%);
  }
  .p-data-block__sub dt {
    font-size: .866666em;
    margin-top: -1.25em;
    margin-bottom: 0.615384em;
  }
  .p-data-block__sub dt::after {
    top: 100%;
    width: .45em;
    height: .35em;
  }
}

/* PC */
@media screen and (min-width: 768px) {
  .p-data-block-wrap {
    flex-wrap: wrap;
    gap: max(56px, calc(128 / 1366 * 100vw)) 0;
    justify-content: space-between;
    padding: calc(32 / 1200 * 100%);
    margin-top: calc(48 / 315 * 100%);
  }
  .p-data-block{
    width: 46.478873%;
    min-height: 27.625em;
  }
  .p-data-block__main {
    padding: calc(48 / 528 * 100%) calc(32 / 528 * 100%) calc(42 / 528 * 100%);
  }
  .p-data-block__ttl {
    left: -2em;
    top: -2.333333em;
    font-size: .9375em;
  }
  .p-data-block__ttl::before {
    font-size: 3.066666em;
  }
  .p-data-block__img {
    margin-bottom: 1.5em;
  }
  .p-data-block__txt {
    font-size: .9375em;
  }
  .p-data-block__note {
    top: 1.363636em;
    right: 1.363636em;
    font-size: .6875em;
  }
  .p-data-block__sub {
    position: absolute;
    padding: 0 calc(20 / 325 * 100%);
  }
  .p-data-block__sub dt {
    font-size: .875em;
    margin-top: -1.25em;
    margin-bottom: .571428em;
  }
  .p-data-block__sub dt::after {
    top: 100%;
    width: .5em;
    height: .4em;
  }

}