@charset "UTF-8";
/* ============================================================= *

Index

* ============================================================= */
/* p-index-title
============================== */
.p-index-title {
  display: grid;
  grid-template-columns: 100%;
  margin-block: var(--leading-trim);
  font-weight: 700;
  font-size: calc(30px + var(--slope-1px) * 15);
  font-family: var(--point-font-family);
  line-height: 1.5;
}

.p-index-title[data-en] {
  gap: calc(12px + var(--slope-1px) * 8);
  margin-top: 0;
}

.p-index-title[data-en]:before {
  content: attr(data-en);
  color: var(--key-color-dark);
  font-size: calc(18px + var(--slope-1px) * 7);
  font-family: var(--en-font-family);
  line-height: .7;
}

/* p-index-line
============================== */
.p-index-line {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: -1;
  width: calc(var(--vw) * 100);
  transform: translateX(-50%);
}

.p-index-line svg {
  width: 100%;
}

.p-index-line._message {
  margin-top: -10.90909%;
}

@media screen and (max-width: 560px) {
  .p-index-line._message {
    margin-top: 35.8209%;
  }
}

@media screen and (max-width: 560px) {
  .p-index-line._interview {
    margin-top: 29.85075%;
  }
}

.p-index-line._environment {
  margin-top: 32.83582%;
}

.p-index-line._environment svg {
  width: calc(100% / 375 * 90);
}

.p-index-line._footer-top {
  top: unset;
  bottom: 0;
  display: flex;
  align-items: flex-end;
  min-height: calc(var(--vh) * 50);
  margin-bottom: calc(100% / 1366 * -26);
}

@media screen and (max-width: 560px) {
  .p-index-line._footer-top {
    margin-bottom: calc(100% / 375 * -22);
  }
}

.p-index-line._footer-top svg {
  width: 40.19034%;
}

@media screen and (max-width: 560px) {
  .p-index-line._footer-top svg {
    width: 36.53333%;
  }
}

/* p-index-mv
============================== */
.p-index-mv {
  position: relative;
  width: 100%;
  min-height: calc(var(--vh) * 100);
  padding-top: calc(var(--header-height) + 20px);
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 1366 484"><path stroke="%23fff" stroke-linecap="round" stroke-width="3" d="M-125 482.5c60.5-70.333 306.855-257.6 527-170.488 232.5 92 464-62.012 430-136.512s-363.5 47-258 106.5 469.5 11.5 586.5-139 254.91-161.0371 325.41-122.5371" opacity=".5"/></svg>') 50% 50%/100% no-repeat;
}

@media screen and (max-width: 560px) {
  .p-index-mv {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 375 324"><path stroke="%23fff" stroke-linecap="round" stroke-width="3" d="M-28 322.33c5.8191-23.359 36.5-119 128.5-119s153.947-80.38 135.728-117.4555C218.009 48.7989 121.87 99.9448 132.839 148.317 143.808 196.69 270.5 145.33 315 63.3301c44.5-82 107.242-60.8002 138.5-53" opacity=".3"/></svg>');
  }
}

.p-index-mv:before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 100%;
  background: var(--gradation-bg);
  animation: mvGradation 8s infinite;
}

.p-index-mv:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  aspect-ratio: 1366 / 117;
  background: url(../img/mv-wave.svg) bottom center/contain no-repeat;
}

@keyframes mvGradationMove {
  0% {
    background-position: 0% 0%;
  }
  100% {
    background-position: 100% 100%;
  }
}

@keyframes mvGradation {
  0% {
    -webkit-filter: hue-rotate(0deg);
            filter: hue-rotate(0deg);
  }
  25% {
    -webkit-filter: hue-rotate(-50deg);
            filter: hue-rotate(-50deg);
  }
  75% {
    -webkit-filter: hue-rotate(50deg);
            filter: hue-rotate(50deg);
  }
  100% {
    -webkit-filter: hue-rotate(0deg);
            filter: hue-rotate(0deg);
  }
}

/* p-index-mv-lead
============================== */
.p-index-mv-lead {
  position: absolute;
  bottom: 55px;
  left: 55px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: calc(8px + var(--slope-1px) * 2);
  font-weight: 700;
  font-size: calc(60px + var(--slope-vh-1px) * 25);
  font-family: var(--point-font-family);
  pointer-events: none;

  --slope-vh-1px: clamp(0px, -7.11111px + 1.11111vh, 1px);
}

@media screen and (max-width: 900px) {
  .p-index-mv-lead {
    bottom: 70px;
    left: 32px;
    font-size: 50px;
  }
}

.p-index-mv-lead__row {
  display: block;
  width: fit-content;
  padding: calc(10px + var(--slope-1px) * 2) calc(10px + var(--slope-1px) * 4) calc(14px + var(--slope-1px) * 2);
  background: #fff;
  box-shadow: 0 0 10px 0 rgba(28, 44, 67, .2);
  opacity: 0;
  transition: all 1s cubic-bezier(.33, 1, .68, 1) calc(1.8s + .3s * var(--index));
  transform: translateX(-10px);
  pointer-events: auto;

  --index: 1;
}

.p-index-mv-lead__row:nth-child(2) {
  --index: 2;
}

.p-index-mv-lead__row:nth-child(3) {
  --index: 3;
}

body.is-loaded .p-index-mv-lead__row {
  opacity: 1;
  transform: translateX(0px);
}

.p-index-mv-lead__row span {
  display: block;
  margin-block: var(--leading-trim);
  background: var(--gradation-text);
  -webkit-background-clip: text;
          background-clip: text;

  -webkit-text-fill-color: transparent;
}

/* p-index-mv-slider
============================== */
.p-index-mv-slider {
  overflow: hidden;
  width: calc(var(--vw) * 100);
  padding-left: calc(20px + var(--slope-1px) * 30);
  opacity: 0;
  transition: all .8s cubic-bezier(.33, 1, .68, 1) 1.4s;
  transform: translateY(10px);

  --slide-max-width: 608px;
  --slide-gap: 95px;
}

body.is-loaded .p-index-mv-slider {
  opacity: 1;
  transform: translateY(0px);
}

.p-index-mv-slider__list {
  overflow: visible;
  width: calc(var(--slide-max-width) * 2);
}

@media screen and (max-width: 560px) {
  .p-index-mv-slider__list {
    width: calc(100% + var(--slide-gap));
  }
}

.p-index-mv-slider__list .slick-list {
  overflow: visible;
}

.p-index-mv-slider__item {
  width: var(--slide-max-width);
  padding-right: var(--slide-gap);
}

.p-index-mv-slider__item a {
  display: block;
  transition: opacity .2s;
}

.p-index-mv-slider__item a:hover {
  opacity: .8;
}

/* p-index-contents
============================== */
.p-index-contents {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: calc(var(--max-inner-width) + var(--inner-padding) * 2);
  margin-inline: auto;
  padding: calc(100% / 1366 * 126) var(--inner-padding) 100px;
}

@media screen and (max-width: 900px) {
  .p-index-contents {
    padding-block: 61px 75px;
  }
}

/* p-index-message
============================== */
.p-index-message {
  position: relative;
  display: grid;
  align-items: center;
  grid-template-columns: 40.63636% 1fr;
  gap: 35px 64px;
}

.p-index-message:before {
  content: "";
  position: absolute;
  right: calc(10px - var(--inner-overflow));
  bottom: 0;
  display: block;
  width: 246px;
  aspect-ratio: 246 / 229;
  background: url(../img/bg-index-message.svg) 50% 50%/contain no-repeat;
}

@media screen and (max-width: 900px) {
  .p-index-message:before {
    top: 0;
    bottom: unset;
    width: 43.28358%;
    margin-top: -11.9403%;
  }
}

@media screen and (max-width: 900px) {
  .p-index-message {
    grid-template-columns: 100%;
  }
}

.p-index-message__contents {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(35px + var(--slope-1px) * 20);
}

.p-index-message__head {
  display: grid;
  grid-template-columns: 100%;
  margin-block: var(--leading-trim);
  font-weight: 700;
  font-size: calc(24px + var(--slope-1px) * 11);
  font-family: var(--point-font-family);
  line-height: 1.5;
}

.p-index-message__head[data-en] {
  gap: calc(12px + var(--slope-1px) * 8);
  margin-top: 0;
}

.p-index-message__head[data-en]:before {
  content: attr(data-en);
  color: var(--key-color-dark);
  font-size: calc(18px + var(--slope-1px) * 7);
  font-family: var(--en-font-family);
  line-height: .7;
}

.p-index-message__body {
  margin-block: var(--leading-trim);
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 2.5;
}

@media screen and (max-width: 900px) {
  .p-index-message__body {
    line-height: 2.1;
  }
}

.p-index-message__image {
  max-width: 447px;
  margin-inline: auto;
}

@media screen and (min-width: 901px) {
  .p-index-message__image {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
  }
}

/* p-index-section
============================== */
.p-index-section {
  position: relative;
  display: grid;
  grid-template-columns: 100%;
  gap: calc(35px + var(--slope-1px) * 7);
  margin-top: calc(75px + var(--slope-1px) * 55);
}

.p-index-section__head {
  text-align: center;
}

.p-index-section__text {
  margin-block: var(--leading-trim) calc(25px + var(--slope-1px) * 30 + var(--leading-trim));
  text-align: center;
}

@media screen and (max-width: 900px) {
  .p-index-section__text {
    word-break: keep-all;
    overflow-wrap: anywhere;
  }
}

/* p-index-company-grid
============================== */
.p-index-company-grid {
  display: grid;
  grid-template-rows: repeat(2, minmax(255px, 1fr));
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(20px, 13.05211px + 1.24069vw, 30px);
}

@media screen and (max-width: 560px) {
  .p-index-company-grid {
    grid-template-rows: repeat(4, minmax(calc((100 * var(--vw) - var(--inner-padding) * 2) / 335 * 200), 1fr));
    grid-template-columns: 100%;
  }
}

/* p-index-company-nav
============================== */
.p-index-company-nav {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  width: 100%;
  border-radius: 20px;
  color: #fff;
  text-decoration: none;
  font-size: calc(14px + var(--slope-1px) * 2);
}

.p-index-company-nav:first-child {
  grid-row: span 2;
}

.p-index-company-nav__image {
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
}

.p-index-company-nav__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all .3s ease-out;
}

a:hover .p-index-company-nav__image img {
  scale: 1.03;
}

.p-index-company-nav__contents {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(20px + var(--slope-1px) * 5);
  padding: 3em calc(22px + var(--slope-1px) * 7) 25px;
  background: linear-gradient(1800deg, rgba(28, 44, 67, .9) 50%, rgba(28, 44, 67, 0) 100%);
}

.p-index-company-nav:has(.p-index-company-nav__body) .p-index-company-nav__contents {
  padding-bottom: 35px;
}

@media screen and (max-width: 560px) {
  .p-index-company-nav:has(.p-index-company-nav__body) .p-index-company-nav__contents {
    padding-bottom: 25px;
  }
}

.p-index-company-nav__head {
  margin-block: var(--leading-trim);
  font-size: calc(20px + var(--slope-1px) * 5);
}

.p-index-company-nav__body {
  margin-block: var(--leading-trim);
  line-height: 1.5;
}

@media screen and (min-width: 901px) {
  .p-index-company-nav__body {
    word-break: keep-all;
    overflow-wrap: anywhere;
  }
}

/* p-index-interview-slider
============================== */
.p-index-interview-slider {
  position: relative;
  left: 50%;
  overflow: hidden;
  width: calc(100 * var(--vw));
  transform: translateX(-50%);

  --slide-gap: 0px;
}

@media screen and (max-width: 900px) {
  .p-index-interview-slider {
    --slide-gap: calc(var(--inner-padding) * 2);
  }
}

.p-index-interview-slider__list {
  overflow: visible;
  width: calc(675px + var(--slide-gap));
  max-width: 100%;
  margin-inline: auto;
}

.p-index-interview-slider__list .slick-list {
  overflow: visible;
}

.p-index-interview-slider__item {
  padding-inline: calc(var(--slide-gap) * .5);
}

.p-index-interview-slider__control {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 15px;
  width: calc(900px + var(--inner-padding) * 2);
  max-width: 100%;
  margin-inline: auto;
  margin-top: 28px;
  padding-inline: var(--inner-padding);
}

@media screen and (max-width: 900px) {
  .p-index-interview-slider__control {
    justify-content: center;
    margin-top: 35px;
  }
}

.p-index-interview-slider__control .slick-dots {
  position: static;
  width: fit-content;
}

.p-index-interview-slider__control .slick-arrow {
  position: static;
}

@media screen and (min-width: 901px) {
  .p-index-interview-slider__item:not(.slick-current):not(.is-moving) .c-interview-nav {
    pointer-events: none;
  }
  .p-index-interview-slider__item:not(.slick-current):not(.is-moving) .c-interview-nav__head, .p-index-interview-slider__item:not(.slick-current):not(.is-moving) .c-interview-nav__body, .p-index-interview-slider__item:not(.slick-current):not(.is-moving) .c-interview-nav__foot {
    opacity: 0;
    transition: all .4s ease-out;
  }
  .p-index-interview-slider__item:not(.slick-current):not(.is-moving) .c-interview-nav__image img {
    width: 67.72277%;
    transition: all .4s ease-out;
  }
}

/* p-index-environment
============================== */
.p-index-environment {
  position: relative;
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 49.90909%;
  gap: 35px 61px;
  margin-top: calc(75px + var(--slope-1px) * 25);
}

@media screen and (max-width: 900px) {
  .p-index-environment {
    grid-template-columns: 100%;
    text-align: center;
  }
}

.p-index-environment__head {
  margin-bottom: calc(35px + var(--slope-1px) * 7);
}

.p-index-environment__body {
  margin-block: var(--leading-trim);
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 1.5;
}

@media screen and (max-width: 900px) {
  .p-index-environment__body {
    word-break: keep-all;
    overflow-wrap: anywhere;
  }
  .p-index-environment__body br {
    display: none;
  }
}

.p-index-environment__foot {
  margin-top: 45px;
}

.p-index-environment__image {
  max-width: 549px;
  margin-inline: auto;
}

/* p-index-environment-nav
============================== */
.p-index-environment-nav {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1em;
  padding: calc(20px + var(--slope-1px) * 5) calc(12px + var(--slope-1px) * 3);
  border-top: 1px solid var(--base-color);
  text-align: left;
  text-decoration: none;
  font-size: calc(16px + var(--slope-1px) * 2);
}

.p-index-environment-nav:last-child {
  border-bottom: 1px solid var(--base-color);
}

.p-index-environment-nav__arrow {
  display: block;
  width: calc(28px + var(--slope-1px) * 7);
  aspect-ratio: 1 / 1;
}

/* ============================================================= *

message.html

* ============================================================= */
/* p-message-hero
============================== */
.p-message-hero {
  overflow: hidden;
  margin-bottom: 100px;
  border-radius: 20px;
}

@media screen and (max-width: 900px) {
  .p-message-hero {
    aspect-ratio: 335 / 213;
    margin-bottom: 36px;
  }
}

.p-message-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* p-message-contents
============================== */
.p-message-contents {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 50px 75px;
  width: 100%;
  max-width: 980px;
  margin-inline: auto;
}

@media screen and (max-width: 900px) {
  .p-message-contents {
    grid-template-columns: 100%;
  }
}

.p-message-contents__head {
  display: grid;
  align-self: flex-start;
  grid-template-columns: 100%;
  gap: 50px;
  overflow: hidden;
}

@media screen and (max-width: 900px) {
  .p-message-contents__head {
    gap: 30px;
  }
}

.p-message-contents__title {
  display: block;
  width: calc(100% + .5em);
  margin-block: var(--leading-trim);
  background: var(--gradation-text);
  -webkit-background-clip: text;
          background-clip: text;
  letter-spacing: 0;
  font-weight: 700;
  font-size: calc(28px + var(--slope-1px) * 10);
  font-family: var(--point-font-family);
  line-height: calc(46px + var(--slope-1px) * 14);

  -webkit-text-fill-color: transparent;
}

.p-message-contents__sign {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(12px + var(--slope-1px) * 3);
}

.p-message-contents__sign span {
  display: block;
  margin-block: var(--leading-trim);
  font-size: calc(14px + var(--slope-1px) * 3);
}

.p-message-contents__sign em {
  display: block;
  margin-block: var(--leading-trim);
  font-size: calc(18px + var(--slope-1px) * 10);
}

.p-message-contents__text {
  display: grid;
  grid-template-columns: 100%;
  gap: 50px;
  font-size: calc(14px + var(--slope-1px) * 2);
}

@media screen and (max-width: 900px) {
  .p-message-contents__text {
    gap: 35px;
  }
}

.p-message-contents__text > p {
  margin-block: var(--leading-trim);
}

/* ============================================================= *

works

* ============================================================= */
/* p-works-interview-list
============================== */
.p-works-interview-list {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(var(--default-1px) * 40);
}

/* p-works-interview-nav
============================== */
.p-works-interview-nav {
  display: block;
  color: #fff;
  text-decoration: none;
}

.p-works-interview-nav__image {
  overflow: hidden;
  width: 100%;
  aspect-ratio: 342 / 200;
  border: 2px solid var(--base-color);
  background: url(../img/interview/bg-header.jpg) 50% 50%/cover no-repeat;
}

.p-works-interview-nav__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-works-interview-nav__head {
  position: relative;
  top: calc(var(--default-1px) * -17.5);
  display: flex;
  align-items: center;
  gap: calc(var(--default-1px) * 10);
  width: fit-content;
  height: calc(var(--default-1px) * 33);
  max-width: 100%;
  margin-bottom: calc(var(--default-1px) * -17.5);
  margin-left: calc(var(--default-1px) * -5);
  padding: calc(var(--default-1px) * 10);
  background: var(--base-color);
  color: #fff;
  font-weight: 700;
  font-size: calc(var(--default-1px) * 12);
}

.p-works-interview-nav__main {
  font-weight: 700;
  font-size: calc(var(--default-1px) * 18);
}

.p-works-interview-nav__body {
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  padding: calc(var(--default-1px) * 20) calc(var(--default-1px) * 10);
  font-weight: 700;
  font-size: calc(var(--default-1px) * 15);
  line-height: 1.8;
}

.p-works-interview-nav__foot {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1em;
  width: fit-content;
  margin-inline: auto;
  padding-bottom: calc(var(--default-1px) * 10);
  font-weight: 700;
  font-size: calc(var(--default-1px) * 14);
  line-height: 1;
}

.p-works-interview-nav__foot:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 1px;
  background: currentColor;
  transition: all .3s ease-out;
  transform: scaleX(1);
}

.p-works-interview-nav:hover .p-works-interview-nav__foot:before {
  transform: scaleX(0);
}

.p-works-interview-nav__foot:after {
  content: "";
  display: block;
  flex-shrink: 0;
  width: calc(var(--default-1px) * 9);
  height: calc(var(--default-1px) * 9);
  background: url(../img/icon/arrow.svg) 50% 50%/contain no-repeat;
}

/* p-works-schedule
============================== */
.p-works-schedule__head {
  display: flex;
  align-items: center;
  gap: 6px;
  width: calc(100% + var(--inner-padding));
  margin-left: calc(var(--inner-padding) * -1);
}

.p-works-schedule__head span {
  flex-shrink: 0;
  padding: 12px 12px 12px var(--inner-padding);
  background: var(--base-color);
  color: #fff;
  font-weight: 900;
  font-size: calc(var(--default-1px) * 18);
  line-height: 1;
}

.p-works-schedule__head._first span {
  border: 2px solid;
  border-left: 0;
  background: #fff;
  color: var(--base-color);
}

.p-works-schedule__head:after {
  content: "";
  display: block;
  flex-grow: 1;
  height: 12px;
  background: url(../img/pattern-shine.png) right top/12px 12px repeat-x;
}

.p-works-schedule__body {
  padding-block: calc(var(--default-1px) * 25) calc(var(--default-1px) * 30);
  font-weight: 700;
  font-size: calc(var(--default-1px) * 16);
}

.p-works-schedule__body > li {
  position: relative;
  padding-left: 1em;
  line-height: 1.9;
}

.p-works-schedule__body > li:before {
  content: "\30fb";
  position: absolute;
  top: 0;
  left: 0;
}

/* p-works-schedule-sub
============================== */
.p-works-schedule-sub {
  margin-block: .3em .8em;
  font-weight: 400;
  font-size: calc(var(--default-1px) * 14);
  line-height: 1.8;
}

/* ============================================================= *

interview.html

* ============================================================= */
/* ============================================================= *

infographics.html

* ============================================================= */
/* p-infographics-data-grid
============================== */
.p-infographics-data-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: calc(15px + var(--slope-1px) * 5);
}

/* p-infographics-data-block
============================== */
.p-infographics-data-block {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  min-height: calc(230px + var(--slope-1px) * 10);
  padding: 50px 20px 20px;
  border-radius: 20px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--key-color-light) 10%, transparent) 0%, color-mix(in srgb, var(--point-color) 10%, transparent) 100%);
}

a.p-infographics-data-block {
  cursor: pointer;
  transition: all .2s;
}

a.p-infographics-data-block:not(.is-open):hover {
  opacity: .7;
}

.p-infographics-data-block._faq {
  min-height: calc(320px + var(--slope-1px) * 130);
}

.p-infographics-data-block[data-intersection] {
  opacity: 0;
  transition: all .8s cubic-bezier(.25, 1, .5, 1);
  transform: translateY(20px);
}

@media screen and (min-width: 901px) {
  .p-infographics-data-grid .p-infographics-data-block[data-intersection]:nth-child(3n+2) {
    transition-delay: .3s;
  }
  .p-infographics-data-grid .p-infographics-data-block[data-intersection]:nth-child(3n) {
    transition-delay: .6s;
  }
}

.p-infographics-data-block[data-intersecting="true"] {
  opacity: 1;
  transform: translateY(0px);
}

.p-infographics-data-block__head {
  position: absolute;
  top: 20px;
  left: 20px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 15px;
  border-radius: 3em;
  background: var(--gradation-text);
  color: #fff;
  font-weight: 700;
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 1;
}

.p-infographics-data-block__head > i {
  display: block;
  flex-shrink: 0;
  padding: 3px 7px;
  border-radius: 3em;
  background: #fff;
  color: var(--key-color-dark);
  font-weight: 700;
  font-style: normal;
  font-size: calc(12px + var(--slope-1px) * 2);
  font-family: var(--en-font-family);
  line-height: 1;
}

.p-infographics-data-block__body {
  display: grid;
  justify-content: flex-end;
  align-items: baseline;
  grid-template-columns: 100%;
  gap: 15px 0;
}

.p-infographics-data-block__body._grid-3 {
  grid-template-columns: repeat(3, auto);
}

.p-infographics-data-block._faq .p-infographics-data-block__body {
  width: 100%;
}

.p-infographics-data-block__icon {
  position: absolute;
  top: 20px;
  right: 20px;
  width: calc(40px + var(--slope-1px) * 5);
  aspect-ratio: 1 / 1;
}

.p-infographics-data-block__icon :is(img, svg) {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-infographics-data-block__more {
  position: absolute;
  right: 20px;
  bottom: 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0;
  outline: none;
  border: 0;
  background: transparent;
  color: inherit;
  font-weight: 700;
  font-size: calc(14px + var(--slope-1px) * 2);
  appearance: none;
}

.p-infographics-data-block__more:after {
  content: "";
  display: block;
  flex-shrink: 0;
  width: 10px;
  aspect-ratio: 1 / 1;
  background: currentColor;
  mask: var(--icon-plus) 50% 50%/contain no-repeat;
}

.p-infographics-data-block__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  visibility: hidden;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  width: 100%;
  height: 100%;
  padding: calc(20px + var(--slope-1px) * 36);
  color: #fff;
  opacity: 0;
  transition: all .4s ease-out;
  pointer-events: none;
}

.p-infographics-data-block__overlay:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: color-mix(in srgb, var(--point-color) 93%, transparent);
  transition: all .3s ease;
  transform: translate3d(-50%, -50%, 0px) scale(.3);
}

.p-infographics-data-block.is-open .p-infographics-data-block__overlay {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.p-infographics-data-block.is-open .p-infographics-data-block__overlay:before {
  border-radius: 0;
  transform: translate3d(-50%, -50%, 0px) scale(1);
}

/* p-infographics-data-block-overlay
============================== */
.p-infographics-data-block-overlay {
  position: relative;
  font-size: calc(14px + var(--slope-1px) * 2);
}

.p-infographics-data-block-overlay__detail {
  display: grid;
  align-items: flex-start;
  grid-template-columns: auto 1fr;
  gap: 40px 16px;
}

.p-infographics-data-block-overlay__detail > dt {
  padding: 10px 15px;
  border-radius: 3em;
  background: #fff;
  color: var(--base-color);
  text-align: center;
  font-weight: 700;
  line-height: 1;
}

.p-infographics-data-block-overlay__detail > dd {
  align-self: center;
  margin-block: var(--leading-trim);
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.p-infographics-data-block-overlay__list > li {
  display: flex;
}

.p-infographics-data-block-overlay__list > li:before {
  content: "\30fb";
}

/* p-infographics-number
============================== */
.p-infographics-number {
  display: flex;
  justify-content: flex-end;
  align-items: baseline;
  text-align: right;
  font-weight: 700;
  font-size: var(--unit-size);
  line-height: 1;

  --number-size: 74px;
  --unit-size: 24px;
}

.p-infographics-number._medium {
  --number-size: 48px;
  --unit-size: 18px;
}

.p-infographics-number._small {
  --number-size: 24px;
  --unit-size: 18px;
}

._grid-3 .p-infographics-number {
  display: contents;
}

.p-infographics-number._center {
  justify-content: center;
}

.p-infographics-number__head {
  margin-right: 12px;
}

.p-infographics-number__count {
  display: inline-block;
  font-size: var(--number-size);
  font-family: var(--en-font-family);
  line-height: .8;
}

.p-infographics-number__unit {
  margin-left: 5px;
}

.p-infographics-number._small .p-infographics-number__unit {
  margin-left: 0;
}

/* p-infographics-notes
============================== */
.p-infographics-notes {
  margin-block: calc(7px + var(--leading-trim)) var(--leading-trim);
  font-weight: 700;
  font-size: 18px;
}

/* p-infographics-age-ratio
============================== */
.p-infographics-age-ratio {
  position: relative;
  width: 305px;
  max-width: 100%;
  aspect-ratio: 305 / 133;
  background: url(../img/infographics/fig-ageRatio.png) bottom center/contain no-repeat;
}

.p-infographics-age-ratio .p-infographics-number {
  position: absolute;
  bottom: 0;
  transform: translateX(-50%);
}

.p-infographics-age-ratio .p-infographics-number:nth-child(1) {
  left: 7.21311%;
  margin-bottom: 25.90164%;
}

.p-infographics-age-ratio .p-infographics-number:nth-child(2) {
  left: 27.21311%;
  margin-bottom: 25.90164%;
}

.p-infographics-age-ratio .p-infographics-number:nth-child(3) {
  left: 48.19672%;
  margin-bottom: 38.03279%;
}

.p-infographics-age-ratio .p-infographics-number:nth-child(4) {
  left: 69.18033%;
  margin-bottom: 23.93443%;
}

.p-infographics-age-ratio .p-infographics-number:nth-child(5) {
  left: 90.81967%;
  margin-bottom: 20.98361%;
}

/* p-infographics-join-ratio
============================== */
.p-infographics-join-ratio {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: .25em;
  font-weight: 700;
  font-size: 74px;
  line-height: 1;
}

.p-infographics-join-ratio__item {
  display: grid;
  align-self: flex-end;
  grid-template-columns: 100%;
  gap: 12px;
}

.p-infographics-join-ratio__item:nth-child(2) {
  line-height: .9;
}

.p-infographics-join-ratio__item span {
  text-align: center;
  font-size: 18px;
}

/* p-infographics-gender-ratio
============================== */
.p-infographics-gender-ratio {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr auto 1fr;
}

.p-infographics-gender-ratio__item {
  display: grid;
  grid-template-columns: 100%;
  gap: 15px;
  text-align: center;
  font-weight: 700;
  font-size: 18px;
  line-height: 1;
}

.p-infographics-gender-ratio__graph {
  margin-inline: 7px 10px;
}

/* p-infographics-sales
============================== */
.p-infographics-sales {
  position: relative;
  width: 305px;
  max-width: 100%;
  aspect-ratio: 305 / 138;
  background: url(../img/infographics/fig-sales.png) bottom center/contain no-repeat;
  line-height: 1.1;
}

.p-infographics-sales__item {
  position: absolute;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  width: fit-content;
  text-align: center;
  transform: translateX(-50%);
}

.p-infographics-sales__item:nth-child(1) {
  left: 18.03279%;
  margin-bottom: 29.83607%;
}

.p-infographics-sales__item:nth-child(2) {
  left: 50.81967%;
  margin-bottom: 29.83607%;
}

.p-infographics-sales__item:nth-child(3) {
  left: 82.78689%;
  margin-bottom: 32.78689%;
}

.p-infographics-sales__head {
  display: flex;
  margin-block: var(--leading-trim);
  white-space: nowrap;
  font-weight: 700;
  font-size: 18px;
}

.p-infographics-sales__head em {
  display: inline-block;
  font-weight: 700;
  font-size: 22px;
  font-family: var(--en-font-family);
  line-height: .8;
}

.p-infographics-sales__body {
  margin-block: var(--leading-trim);
  white-space: nowrap;
  font-weight: 700;
  font-size: 12px;
}

.p-infographics-sales__body em {
  display: inline-block;
  font-weight: 700;
  font-size: 16px;
  font-family: var(--en-font-family);
  line-height: .8;
}

/* p-infographics-faq-grid
============================== */
.p-infographics-faq-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(460px, 1fr));
  gap: calc(15px + var(--slope-1px) * 5);
}

@media screen and (max-width: 560px) {
  .p-infographics-faq-grid {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  }
}

/* p-infographics-faq-comment
============================== */
.p-infographics-faq-comment {
  width: 480px;
  max-width: 100%;
}

/* p-infographics-faq-place
============================== */
.p-infographics-faq-place {
  position: relative;
  width: 100%;
  max-width: 393px;
  aspect-ratio: 393 / 356;
  margin-inline: auto;
  margin-top: 20px;
  background: url(../img/infographics/fig-place.svg) 65% 50%/contain no-repeat;
}

.p-infographics-faq-place__item {
  position: absolute;
  top: 0;
  display: grid;
  grid-template-columns: 100%;
  gap: 8px;
  margin-top: calc(100% / 393 * (var(--top-positon) - 8));
  text-align: center;
  font-weight: 700;
  font-size: var(--unit-size);

  --head-size: calc(8px + var(--slope-1px) * 4);
  --number-size: calc(20px + var(--slope-1px) * 12);
  --unit-size: calc(11px + var(--slope-1px) * 7);
  --top-positon: 0;
}

.p-infographics-faq-place__item._medium {
  --head-size: calc(10px + var(--slope-1px) * 6);
  --number-size: calc(26px + var(--slope-1px) * 16);
  --unit-size: calc(14px + var(--slope-1px) * 8);
}

.p-infographics-faq-place__item._large {
  gap: calc(7px + var(--slope-1px) * 5);

  --head-size: calc(11px + var(--slope-1px) * 7);
  --number-size: calc(33px + var(--slope-1px) * 19);
  --unit-size: calc(18px + var(--slope-1px) * 10);
}

.p-infographics-faq-place__head {
  margin-block: var(--leading-trim);
  font-size: var(--head-size);
}

.p-infographics-faq-place__body {
  font-family: var(--en-font-family);
  line-height: .8;
}

.p-infographics-faq-place__body em {
  display: inline-block;
  font-weight: 700;
  font-size: var(--number-size);
}

.p-infographics-faq-place__item._kisarazu {
  right: 0;

  --top-positon: 162;
}

.p-infographics-faq-place__item._kimitsu {
  right: 0;
  margin-right: calc(100% / 393 * 59);

  --top-positon: 274;
}

.p-infographics-faq-place__item._chiba {
  left: 0;
  margin-left: calc(100% / 393 * 22);

  --top-positon: 43;
}

.p-infographics-faq-place__item._ichihara {
  left: 0;
  margin-left: calc(100% / 393 * 16);

  --top-positon: 110;
}

.p-infographics-faq-place__item._sodegaura {
  left: 0;
  margin-left: calc(100% / 393 * 22);

  --top-positon: 180;
}

.p-infographics-faq-place__item._futtsu {
  left: 0;

  --top-positon: 251;
}

/* p-infographics-faq-graph
============================== */
.p-infographics-faq-graph {
  position: relative;
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: calc(1px * var(--max-width));
}

.p-infographics-faq-graph._graph-02 {
  aspect-ratio: var(--max-width)/275;
  margin-inline: auto;
  padding-top: calc(100% / var(--max-width) * 26);

  --max-width: 444;
}

.p-infographics-faq-graph._graph-03 {
  aspect-ratio: var(--max-width)/271;
  margin-inline: auto;
  padding-top: calc(100% / var(--max-width) * 24);

  --max-width: 440;
}

.p-infographics-faq-graph._graph-04 {
  aspect-ratio: var(--max-width)/221;
  margin-inline: auto;

  --max-width: 444;
}

.p-infographics-faq-graph._graph-10 {
  aspect-ratio: var(--max-width)/279;
  margin-inline: auto;
  padding-top: calc(100% / var(--max-width) * 26);

  --max-width: 437;
}

.p-infographics-faq-graph._graph-11 {
  aspect-ratio: var(--max-width)/320;
  margin-inline: auto;
  padding-top: calc(100% / var(--max-width) * 26);
  padding-bottom: calc(100% / var(--max-width) * 26);

  --max-width: 409;
}

.p-infographics-faq-graph__image {
  width: 100%;
  height: 100%;
}

.p-infographics-faq-graph__image :is(img, svg) {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-infographics-faq-graph__item {
  position: absolute;
  display: grid;
  grid-template-columns: 100%;
  gap: 8px;
  text-align: center;
  font-size: calc(10px + var(--slope-1px) * 6);
}

.p-infographics-faq-graph._graph-02 .p-infographics-faq-graph__item[data-label="運動部"] {
  top: 0;
  right: 0;
  margin-top: calc(100% / var(--max-width) * 141);
}

.p-infographics-faq-graph._graph-02 .p-infographics-faq-graph__item[data-label="帰宅部"] {
  top: 0;
  left: 0;
  margin-top: calc(100% / var(--max-width) * 178);
}

.p-infographics-faq-graph._graph-02 .p-infographics-faq-graph__item[data-label="文化部"] {
  top: 0;
  left: 0;
  margin-top: calc(100% / var(--max-width) * 57);
  margin-left: calc(100% / var(--max-width) * 31);
}

.p-infographics-faq-graph._graph-02 .p-infographics-faq-graph__item[data-label="どちらも"] {
  top: 0;
  left: 0;
  margin-left: calc(100% / var(--max-width) * 274);
}

.p-infographics-faq-graph._graph-03 .p-infographics-faq-graph__item[data-label="お弁当"] {
  top: 0;
  right: 0;
  margin-top: calc(100% / var(--max-width) * 208);
}

.p-infographics-faq-graph._graph-03 .p-infographics-faq-graph__item[data-label="コンビニ"] {
  top: 0;
  left: 0;
  margin-top: calc(100% / var(--max-width) * 191);
}

.p-infographics-faq-graph._graph-03 .p-infographics-faq-graph__item[data-label="テイクアウト"] {
  top: 0;
  left: 0;
  margin-top: calc(100% / var(--max-width) * 50);
  margin-left: calc(100% / var(--max-width) * 10);
}

.p-infographics-faq-graph._graph-03 .p-infographics-faq-graph__item[data-label="デリバリー"] {
  top: 0;
  left: 0;
  margin-left: calc(100% / var(--max-width) * 285);
}

.p-infographics-faq-graph._graph-04 .p-infographics-faq-graph__item[data-label="アウトドア"] {
  top: 0;
  right: 0;
  margin-top: calc(100% / var(--max-width) * 93);
}

.p-infographics-faq-graph._graph-04 .p-infographics-faq-graph__item[data-label="インドア"] {
  top: 0;
  left: 0;
  margin-top: calc(100% / var(--max-width) * 121);
}

.p-infographics-faq-graph._graph-04 .p-infographics-faq-graph__item[data-label="どちらも"] {
  top: 0;
  left: 0;
  margin-left: calc(100% / var(--max-width) * 41);
}

.p-infographics-faq-graph._graph-10 .p-infographics-faq-graph__item[data-label="よく話す"] {
  top: 0;
  right: 0;
  margin-top: calc(100% / var(--max-width) * 145);
}

.p-infographics-faq-graph._graph-10 .p-infographics-faq-graph__item[data-label="話す"] {
  top: 0;
  left: 0;
  margin-top: calc(100% / var(--max-width) * 182);
}

.p-infographics-faq-graph._graph-10 .p-infographics-faq-graph__item[data-label="どちらかというと話す"] {
  top: 0;
  left: 0;
  margin-top: calc(100% / var(--max-width) * 45);
  margin-left: calc(100% / var(--max-width) * 11);
}

.p-infographics-faq-graph._graph-10 .p-infographics-faq-graph__item[data-label="あまり話さない"] {
  top: 0;
  right: 0;
  margin-right: calc(100% / var(--max-width) * 103);
}

.p-infographics-faq-graph._graph-11 .p-infographics-faq-graph__item[data-label="100"] {
  top: 0;
  right: 0;
  margin-top: calc(100% / var(--max-width) * 51);
}

.p-infographics-faq-graph._graph-11 .p-infographics-faq-graph__item[data-label="90"] {
  top: 0;
  right: 0;
  margin-top: calc(100% / var(--max-width) * 146);
}

.p-infographics-faq-graph._graph-11 .p-infographics-faq-graph__item[data-label="80"] {
  right: 0;
  bottom: 0;
  margin-right: calc(100% / var(--max-width) * 82);
}

.p-infographics-faq-graph._graph-11 .p-infographics-faq-graph__item[data-label="70"] {
  top: 0;
  left: 0;
  margin-top: calc(100% / var(--max-width) * 211);
}

.p-infographics-faq-graph._graph-11 .p-infographics-faq-graph__item[data-label="60"] {
  top: 0;
  left: 0;
  margin-top: calc(100% / var(--max-width) * 51);
  margin-left: calc(100% / var(--max-width) * 14);
}

.p-infographics-faq-graph._graph-11 .p-infographics-faq-graph__item[data-label="50"] {
  top: 0;
  right: 0;
  margin-right: calc(100% / var(--max-width) * 99);
}

.p-infographics-faq-graph__head {
  margin-block: var(--leading-trim);
  font-weight: 700;
  line-height: 1.1;
}

.p-infographics-faq-graph__head em {
  font-size: 1.25em;
  font-family: var(--en-font-family);
}

.p-infographics-faq-graph__body {
  font-weight: 700;
  font-size: calc(14px + var(--slope-1px) * 8);
  font-family: var(--en-font-family);
  line-height: .8;
}

.p-infographics-faq-graph__body em {
  display: inline-block;
  font-size: calc(28px + var(--slope-1px) * 14);
}

/* ============================================================= *

careerup.html

* ============================================================= */
/* p-careerup-training-grid
============================== */
.p-careerup-training-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr) auto;
  gap: 20px clamp(15px, 8.5786px + .83612vw, 20px);
}

@media screen and (max-width: 900px) {
  .p-careerup-training-grid {
    grid-template-columns: 100%;
  }
}

/* p-careerup-skillup-grid
============================== */
.p-careerup-skillup-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

@media screen and (max-width: 900px) {
  .p-careerup-skillup-grid {
    grid-template-columns: 100%;
  }
}

/* p-careerup-block
============================== */
.p-careerup-block {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr;
  grid-auto-columns: 100%;
  gap: 20px;
  padding: 25px 25px 30px;
  border-radius: 20px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--key-color-light) 10%, transparent) 0%, color-mix(in srgb, var(--point-color) 10%, transparent) 100%);
}

@media screen and (min-width: 901px) {
  .p-careerup-block {
    padding-inline: clamp(15px, 2.15719px + 1.67224vw, 25px);
  }
}

.p-careerup-training-grid .p-careerup-block:after {
  content: "";
  position: absolute;
  right: calc(15px + var(--slope-1px) * -2.5);
  bottom: 0;
  display: block;
  width: calc(40px + var(--slope-1px) * 10);
  aspect-ratio: 5 / 4;
  background: url(../img/leaf.svg) 50% 50%/contain no-repeat;
}

@media screen and (min-width: 901px) {
  .p-careerup-skillup-grid .p-careerup-block {
    gap: 25px;
    padding: 30px 40px 40px;
  }
}

.p-careerup-block__head {
  padding: 15px .8em;
  border-radius: 100px;
  background: var(--point-color);
  color: #fff;
  text-align: center;
  font-size: calc(16px + var(--slope-1px) * 2);
  line-height: 1;
}

.p-careerup-block__body {
  margin-block: var(--leading-trim);
  font-size: calc(14px + var(--slope-1px) * 2);
}

.p-careerup-block__list {
  width: calc(100% + 7px);
  max-width: fit-content;
  margin-inline: auto;
  margin-left: -7px;
  letter-spacing: 0;
}

.p-careerup-block__list > li {
  display: flex;
}

.p-careerup-block__list > li:before {
  content: "\30fb";
  font-feature-settings: "none";
}

.p-careerup-block__text {
  max-width: fit-content;
  margin-inline: auto;
}

/* ============================================================= *

welfare.html

* ============================================================= */
/* p-welfare-holiday
============================== */
.p-welfare-holiday {
  padding: calc(25px + var(--slope-1px) * 15) 25px;
  border-radius: 20px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--key-color-dark) 10%, transparent) 0%, color-mix(in srgb, var(--point-color) 10%, transparent) 100%);
}

.p-welfare-holiday__list {
  display: flex;
  flex-wrap: wrap;
  gap: 15px 30px;
  width: 100%;
  max-width: 750px;
  margin-inline: auto;
}

@media screen and (max-width: 900px) {
  .p-welfare-holiday__list {
    flex-direction: column;
    gap: 17px;
  }
}

.p-welfare-holiday__list > li {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  padding-left: 1em;
  font-size: calc(16px + var(--slope-1px) * 2);
  line-height: 1;
}

.p-welfare-holiday__list > li small {
  font-size: calc(12px + var(--slope-1px) * 2);
  line-height: 1.4;
}

@media screen and (max-width: 900px) {
  .p-welfare-holiday__list > li small {
    display: block;
    word-break: keep-all;
    overflow-wrap: anywhere;
  }
}

.p-welfare-holiday__list > li:before {
  content: "";
  position: absolute;
  top: .5em;
  left: 0;
  display: block;
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--key-color-dark);
  transform: translateY(-50%);
}

/* p-welfare-system-grid
============================== */
.p-welfare-system-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
}

/* p-welfare-system-block
============================== */
.p-welfare-system-block {
  display: grid;
  align-content: flex-start;
  grid-template-columns: 100%;
  gap: 20px;
  padding: 25px 25px 30px;
  border-radius: 20px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--key-color-light) 10%, transparent) 0%, color-mix(in srgb, var(--point-color) 10%, transparent) 100%);
}

.p-welfare-system-block__icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(85px + var(--slope-1px) * 15);
  aspect-ratio: 1 / 1;
  margin-inline: auto;
  border-radius: 50%;
  background: #fff;
}

.p-welfare-system-block__icon :is(img, svg) {
  width: 50%;
  height: auto;
}

.p-welfare-system-block__head {
  position: relative;
  padding: 15px .4em;
  border-radius: 100px;
  background: var(--point-color);
  color: #fff;
  text-align: center;
  font-weight: 700;
  font-size: calc(16px + var(--slope-1px) * 2);
  line-height: 1;
}

.p-welfare-system-block__head:after {
  content: "";
  position: absolute;
  right: calc(7px + var(--slope-1px) * 4);
  bottom: calc(100% - 2px);
  display: block;
  width: calc(38px + var(--slope-1px) * 12);
  aspect-ratio: 5 / 4;
  background: url(../img/leaf.svg) 50% 50%/contain no-repeat;
}

.p-welfare-system-block__body {
  margin-block: var(--leading-trim);
  font-size: calc(14px + var(--slope-1px) * 2);
}

/* p-welfare-image-block
============================== */
.p-welfare-image-block {
  display: grid;
  align-content: flex-start;
  grid-template-columns: 100%;
  gap: calc(20px + var(--slope-1px) * 5);
  padding: calc(25px + var(--slope-1px) * 5) calc(25px + var(--slope-1px) * 15) calc(30px + var(--slope-1px) * 10);
  border-radius: 20px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--key-color-light) 10%, transparent) 0%, color-mix(in srgb, var(--point-color) 10%, transparent) 100%);
}

.p-welfare-image-block__image:has(img:nth-child(2)) {
  display: grid;
  grid-template-columns: 58.26087% 1fr;
  gap: 10px;
}

.p-welfare-image-block__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.p-welfare-image-block__head {
  padding: 15px .4em;
  border-radius: 100px;
  background: var(--point-color);
  color: #fff;
  text-align: center;
  font-weight: 700;
  font-size: calc(16px + var(--slope-1px) * 2);
  line-height: 1;
}

.p-welfare-image-block__body {
  margin-block: var(--leading-trim);
  font-size: calc(14px + var(--slope-1px) * 2);
}

/* p-welfare-event-grid
============================== */
.p-welfare-event-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

@media screen and (max-width: 900px) {
  .p-welfare-event-grid {
    grid-template-columns: 100%;
  }
}

/* ============================================================= *

activity

* ============================================================= */
/* p-activity-30s
============================== */
.p-activity-30s {
  display: grid;
  gap: calc(var(--default-1px) * 30);
}

.p-activity-30s__item {
  display: grid;
  gap: calc(var(--default-1px) * 25);
}

.p-activity-30s__head {
  margin-block: var(--leading-trim);
  color: var(--point-color);
  font-size: calc(var(--default-1px) * 24);
  font-family: var(--point-font-family);
}

.p-activity-30s__head:before {
  content: "\30fb";
}

.p-activity-30s__body {
  margin-block: var(--leading-trim);
  font-size: calc(var(--default-1px) * 15);
  line-height: 1.8;
}

/* ============================================================= *

midcareer

* ============================================================= */
/* p-midcareer-image
============================== */
.p-midcareer-image {
  width: calc(100% + var(--inner-padding)* 2);
  margin-inline: calc(var(--inner-padding) * -1);
  margin-top: calc(var(--default-1px) * -40);
  border-top: 2px solid var(--base-color);
  border-bottom: 2px solid var(--base-color);
}

/* ============================================================= *

guide.html

* ============================================================= */
/* p-guide-tab
============================== */
.p-guide-tab {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(10px + var(--slope-1px) * 11);
  margin-bottom: calc(25px + var(--slope-1px) * 10);
}

.p-guide-tab__button {
  padding: 2px;
  outline: none;
  border: 0;
  border-radius: 4em;
  background: var(--gradation-text);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  font-size: calc(16px + var(--slope-1px) * 2);
  line-height: 1;
  transition: all .2s ease-out;
  appearance: none;
}

.p-guide-tab__button:not(.is-current):hover {
  opacity: .7;
  cursor: pointer;
}

.p-guide-tab__button div {
  display: block;
  padding: 25px;
  border-radius: 4em;
  background: var(--gradation-text);
  text-align: center;
}

@media screen and (max-width: 900px) {
  .p-guide-tab__button div {
    padding: 13px 0;
  }
}

.p-guide-tab__button:not(.is-current) div {
  background: #fff;
}

.p-guide-tab__button:not(.is-current) span {
  background: var(--gradation-text);
  -webkit-background-clip: text;
          background-clip: text;

  -webkit-text-fill-color: transparent;
}

/* p-guide-table
============================== */
.p-guide-table {
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid var(--base-color);
}

.p-guide-table :is(th, td) {
  padding-block: 21px;
  border-bottom: 1px solid var(--base-color);
  vertical-align: top;
  font-weight: 500;
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 1.5;
}

.p-guide-table th {
  width: calc(100px + var(--slope-1px) * 120);
  padding-right: 10px;
}

/* p-guide-button-container
============================== */
.p-guide-button-container {
  margin-top: calc(25px + var(--slope-1px) * 10);
}

/* p-guide-button
============================== */
.p-guide-button {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(15px + var(--slope-1px) * 3);
  width: 300px;
  height: calc(50px + var(--slope-1px) * 10);
  margin-inline: auto;
  padding-inline: 25px 20px;
  border-radius: 3em;
  background: var(--base-color);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  font-size: calc(14px + var(--slope-1px) * 2);
}

.p-guide-button__icon {
  flex-shrink: 0;
  width: calc(23px + var(--slope-1px) * 3);
  aspect-ratio: 1 / 1;
}

.p-guide-button__text {
  flex-grow: 1;
  text-align: left;
}

.p-guide-button__arrow {
  position: relative;
  display: block;
  overflow: hidden;
  width: 16px;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
}

.p-guide-button__arrow:before, .p-guide-button__arrow:after {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: currentColor;
  mask: var(--icon-arrow) 50% 50%/contain no-repeat;
  animation-duration: .2s;
  animation-fill-mode: forwards;
}

.p-guide-button__arrow:after {
  transform: translateX(-100%);
}

:is(a, button):hover .p-guide-button__arrow:before {
  animation-name: hoverArrowBefore;
  animation-delay: 0s;
}

:is(a, button):hover .p-guide-button__arrow:after {
  animation-name: hoverArrowAfter;
  animation-delay: .2s;
}

/* p-guide-ready
============================== */
.p-guide-ready {
  margin-block: calc(60px + var(--slope-1px) * 30) calc(70px + var(--slope-1px) * 70);
  text-align: center;
}

/* ============================================================= *

Information

* ============================================================= */
.p-information-contents .blog__paging {
  display: none;
}
