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

index

* ============================================================= */
/* p-index-title
============================== */
.p-index-title {
  margin-block: var(--leading-trim);
  font-weight: 700;
  font-size: calc(28px + var(--slope-1px) * 14);
}

/* p-index-mv
============================== */
.p-index-mv {
  position: relative;
  width: 100%;
  height: calc(var(--vh) * 100);
  max-height: calc(var(--vw) * 100 / 375 * 725);

  container-type: inline-size;
}

@media screen and (min-width: 769px) {
  .p-index-mv {
    min-height: calc(var(--vw) * 100 / 1366 * 724);
    max-height: calc(var(--vw) * 100 / 1366 * 820);
  }
}

/* p-index-mv-lead
============================== */
.p-index-mv-lead {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1;
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;
  gap: calc(8px + var(--slope-1px) * 8);
  width: fit-content;
  margin-inline: auto;
  margin-top: calc(133px + var(--slope-1px) * 134);
  letter-spacing: .1em;
  font-weight: 700;
  font-size: calc(22px + var(--slope-1px) * 20);
  pointer-events: none;
}

@media screen and (min-width: 769px) {
  .p-index-mv-lead {
    gap: calc(var(--base-cqi) * 16);
    margin-top: calc(var(--base-cqi) * 267);
    padding-right: calc(100% / 1366 * 702);
    font-size: calc(var(--base-cqi) * 42);
  }
}

.p-index-mv-lead > span {
  display: inline-block;
  padding-inline: calc(12px + var(--slope-1px) * 4);
  border-radius: calc(4px + var(--slope-1px) * 4);
  background: #fff;
  line-height: 1.28571;
  pointer-events: auto;
  writing-mode: vertical-rl;

  padding-block-start: .2em;
}

@media screen and (min-width: 769px) {
  .p-index-mv-lead > span {
    padding-inline: calc(var(--base-cqi) * 16);
    border-radius: calc(var(--base-cqi) * 8);
  }
}

.p-index-mv-lead > span:not(:first-child) {
  font-feature-settings: "vhal", "vpal";

  padding-inline-end: calc(24px + var(--slope-1px) * 8);
}

@supports (background: -webkit-named-image(i)) {
  .p-index-mv-lead > span:not(:first-child) {
    /* safari hack */
    font-feature-settings: normal;

    padding-inline-end: 0;
  }
}

/* p-index-mv-slider
============================== */
.p-index-mv-slider {
  position: relative;
  z-index: 0;
  background: var(--base-bg-color);
}

.p-index-mv-slider__list {
  mask: url(../img/mv/window.svg) 50% top/100% no-repeat;
}

@media screen and (max-width: 768px) {
  .p-index-mv-slider__list {
    mask: url(../img/mv/window-sp.svg) 50% bottom/100% no-repeat;
  }
}

.p-index-mv-slider__item {
  position: relative;
}

.p-index-mv-slider__item:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 80%;
  background: linear-gradient(180deg, rgba(0, 8, 48, 0) 0%, rgba(0, 8, 48, .2) 100%);
}

.p-index-mv-slider__item img {
  width: 100%;
  transition: transform 0s;
  transform: scale(1);
}

@media screen and (max-width: 768px) {
  .p-index-mv-slider__item img {
    max-height: calc(100svh - 100cqi / 375 * 96);
    aspect-ratio: 375 / 600;
    object-fit: cover;
  }
}

.p-index-mv-slider__item.is-scaling img {
  transition: transform var(--scaling-speed) linear;
  transform: scale(1.1);
}

@media screen and (min-width: 769px) {
  .p-index-mv-slider__control {
    position: absolute;
    top: calc(var(--base-cqi) * 553);
    right: 0;
    left: 0;
  }
}

@media screen and (max-width: 768px) {
  .p-index-mv-slider__control {
    padding-right: calc(var(--base-cqi-mobile) * 133);
  }
}

.p-index-mv-slider__handle {
  position: absolute;
  top: 0;
  right: 0;
  width: calc(var(--base-cqi) * 253);
  margin-top: calc(var(--base-cqi) * 470);
  margin-right: calc(var(--base-cqi) * 217);
}

@media screen and (max-width: 768px) {
  .p-index-mv-slider__handle {
    top: 100%;
    width: calc(var(--base-cqi-mobile) * 125);
    margin-top: 0;
    margin-right: calc(var(--base-cqi-mobile) * 49);

    translate: 0 -55%;
  }
}

.p-index-mv-slider__handle img {
  transition: transform var(--transition-speed) ease;
}

.p-index-mv-slider__handle.is-turning-right img {
  transform: rotate(25deg);
}

.p-index-mv-slider__handle.is-turning-left img {
  transform: rotate(-25deg);
}

/* p-index-introduction
============================== */
.p-index-introduction {
  position: relative;
  width: 100%;
  min-height: calc(var(--vh) * 100 * var(--scroll-ratio));
  margin-bottom: calc(var(--vh) * -100 * var(--overlap-ratio));

  container-type: inline-size;
  --scroll-progress: 0;
  --scroll-ratio: 4;
  --visual-scroll-ratio: 3;
  --progress-multiplier: calc((var(--scroll-ratio) - 1) / (var(--visual-scroll-ratio) - 1));
  --normalized-progress: min(1, calc(var(--scroll-progress) * var(--progress-multiplier)));
  --overlap-ratio: calc(var(--scroll-ratio) - var(--visual-scroll-ratio));
}

.p-index-introduction__contents {
  position: sticky;
  top: 0;
  display: flex;
  align-items: center;
  width: 100%;
  height: calc(var(--vh) * 100);
  padding-inline: calc(100% / 1366 * 96) calc(100% / 1366 * 120);
  padding-top: calc(100% / 1366 * 90);
}

@media screen and (max-width: 768px) {
  .p-index-introduction__contents {
    padding-block: calc(100cqb / 667 * 32) calc(100cqb / 667 * 40);
    padding-inline: calc(var(--base-cqi-mobile) * 20);

    container-type: size;
  }
}

.p-index-introduction__contents:before {
  content: "WE ARE PROFESSIONALS OF CAR DEALER’S PROMOTION";
  position: absolute;
  top: calc(var(--base-cqi) * 17);
  left: calc(var(--base-cqi) * 32);
  z-index: -1;
  width: 16.53em;
  background: linear-gradient(90deg, rgba(255, 255, 255, .4) -2.36%, rgba(248, 207, 150, .4) 17.3%, rgba(136, 156, 199, .4) 47.18%, rgba(194, 206, 224, .4) 110.84%);
  -webkit-background-clip: text;
          background-clip: text;
  text-align: left;
  font-weight: 700;
  font-size: calc(var(--base-cqi) * 72);
  font-family: var(--point-en-font-family);
  line-height: 1.2;

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

@media screen and (max-width: 768px) {
  .p-index-introduction__contents:before {
    top: calc(100cqb / 667 * 28);
    left: calc(100% - 100cqb / 667 * 20);
    font-size: calc(100cqb / 667 * 37);
    transform: rotate(90deg);
    transform-origin: left top;
  }
}

.p-index-introduction__inner {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  width: 100%;
}

@media screen and (max-width: 768px) {
  .p-index-introduction__inner {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: calc(100cqb / 667 * 180);
  }
}

.p-index-introduction__head {
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;
  gap: calc(var(--base-cqi) * 16);
  font-weight: 700;
  font-size: calc(var(--base-cqi) * 42);
}

@media screen and (max-width: 768px) {
  .p-index-introduction__head {
    gap: calc(100cqb / 667 * 8);
    font-size: calc(100cqb / 667 * 20);
  }
}

.p-index-introduction__head > span {
  display: inline-block;
  padding-inline: calc(var(--base-cqi) * 16);
  border-radius: calc(var(--base-cqi) * 8);
  background: #fff;
  line-height: 1.28571;
  writing-mode: vertical-rl;

  padding-block-start: .2em;
}

@media screen and (max-width: 768px) {
  .p-index-introduction__head > span {
    padding-inline: calc(100cqb / 667 * 12);
    border-radius: calc(100cqb / 667 * 4);
  }
  .p-index-introduction__head > span:has(span) {
    display: contents;
  }
  .p-index-introduction__head > span > span {
    display: inline-block;
    padding-inline: calc(100cqb / 667 * 12);
    border-radius: calc(100cqb / 667 * 4);
    background: #fff;

    padding-block-start: .2em;
  }
}

.p-index-introduction__body {
  align-self: flex-end;
  margin-block: var(--leading-trim);
  font-size: calc(var(--base-cqi) * 18);
  line-height: 2.2;
}

@media screen and (max-width: 768px) {
  .p-index-introduction__body {
    align-self: flex-start;
    font-size: calc(100cqb / 667 * 15);
  }
}

.p-index-introduction__body .char {
  color: color-mix(in srgb, var(--base-color) var(--fill-percent), var(--base-color-light));

  --adjusted-progress: calc(var(--normalized-progress) * 5);
  --base-color-light: var(--point-color);
  --char-local-progress: calc((var(--adjusted-progress) * var(--char-total)) - var(--char-index));
  --fill-percent: clamp(0%, calc(var(--char-local-progress) * 100%), 100%);
}

.p-index-introduction__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100 * var(--vh));
  pointer-events: none;
}

.p-index-introduction__mask {
  width: 100%;
  height: 100%;
          mask: url(../img/introduction/mask.svg) 50% calc(50% - var(--mask-offset-y-init) * (1 - var(--ease-strong)) - var(--mask-offset-y) * var(--ease-strong)) no-repeat;

  --mask-progress: max(0, calc((var(--normalized-progress) - .2) / .8));
  /* easing */
  --ease-standard: calc(.5 - .5 * cos(var(--mask-progress) * 180deg));
  --ease-strong: calc(.5 - .5 * cos(var(--ease-standard) * 180deg));
  /* size */
  --mask-w-init: calc(var(--vw) * 100 / 1366 * 376);
  --mask-w-final: max(calc(100vh * 320 / 124), 210vw);
  --mask-w-current: calc(var(--mask-w-init) + (var(--mask-w-final) - var(--mask-w-init)) * var(--ease-strong));
  /* offset */
  --mask-offset-y: calc(var(--mask-w-current) * 32.5 / 320);
  --mask-offset-y-init: 0px;
  /* mask */
  -webkit-mask: url(../img/introduction/mask.svg) 50% calc(50% - var(--mask-offset-y-init) * (1 - var(--ease-strong)) - var(--mask-offset-y) * var(--ease-strong)) no-repeat;
  -webkit-mask-size: var(--mask-w-current);
          mask-size: var(--mask-w-current);
}

@media screen and (max-width: 768px) {
  .p-index-introduction__mask {
    --mask-w-init: calc(100cqb / 667 * 167);
    --mask-offset-y-init: calc(100cqb / 667 * 68);
  }
}

.p-index-introduction__mask img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: blur(max(0px, calc(100px - 100px * var(--visual-scroll-ratio) * var(--mask-progress))));
}

/* p-index-about
============================== */
.p-index-about {
  position: relative;
  padding: calc(105px + var(--slope-1px) * 100) var(--inner-padding) calc(48px + var(--slope-1px) * 48);
  background: url(../img/about/bg.svg) center top/100% auto no-repeat var(--base-bg-color);
}

@media screen and (max-width: 768px) {
  .p-index-about {
    min-height: 100vh;
    background-image: url(../img/about/bg-sp.svg);
  }
}

.p-index-about:before {
  content: "ABOUT";
  position: absolute;
  top: 0;
  left: calc(100% / 1366 * 637);
  display: block;
  margin-top: calc(64px + var(--slope-1px) * 64);
  background: var(--gradation-orange-blue, linear-gradient(90deg, rgba(255, 255, 255, .7) -2.36%, rgba(248, 207, 150, .7) 17.3%, rgba(136, 156, 199, .7) 47.18%, rgba(194, 206, 224, .7) 110.84%));
  -webkit-background-clip: text;
          background-clip: text;
  font-weight: 700;
  font-size: calc(75px + var(--slope-1px) * 85);
  font-family: var(--point-en-font-family);
  line-height: .8;
  transform: translateX(-50%);

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

@media screen and (max-width: 768px) {
  .p-index-about:before {
    left: 50%;
  }
}

.p-index-about__body {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  gap: 96px;
}

@media screen and (max-width: 768px) {
  .p-index-about__body {
    gap: 36px;
    padding-inline: 13px;
  }
}

.p-index-about__title {
  font-weight: 700;
  font-size: calc(28px + var(--slope-1px) * 14);
  writing-mode: vertical-rl;
}

.p-index-about__text {
  margin-block: var(--leading-trim);
  padding-top: 116px;
  line-height: 2;
}

@media screen and (max-width: 768px) {
  .p-index-about__text {
    max-width: 29em;
    padding-top: 63px;
  }
}

.p-index-about__foot {
  max-width: 900px;
  margin-inline: auto;
  margin-top: 112px;
}

@media screen and (max-width: 768px) {
  .p-index-about__foot {
    margin-top: 48px;
  }
}

/* p-index-movie
============================== */
.p-index-movie {
  overflow: hidden;
  border-radius: var(--border-radius-lg);
}

.p-index-movie__link {
  position: relative;
  display: block;
  transition: opacity .2s ease-out;
}

.p-index-movie__link:hover {
  opacity: .8;
}

.p-index-movie__link-label {
  position: absolute;
  top: calc(12px + var(--slope-1px) * 18);
  left: calc(12px + var(--slope-1px) * 18);
  display: flex;
  align-items: center;
  gap: calc(3px + var(--slope-1px) * 4.5);
  height: calc(30px + var(--slope-1px) * 27);
  padding-inline: calc(8px + var(--slope-1px) * 16) calc(10px + var(--slope-1px) * 14);
  border-radius: var(--ovall-radius);
  background: #fff;
  font-weight: 500;
  font-size: calc(12px + var(--slope-1px) * 8);

  text-box: trim-both cap alphabetic;
}

.p-index-movie__link-label:before {
  content: "";
  display: block;
  flex-shrink: 0;
  width: calc(24px + var(--slope-1px) * 18);
  aspect-ratio: 1/1;
  background: url(../img/about/movie-icon.svg) 50% 50%/contain no-repeat;
}

/* p-index-business
============================== */
.p-index-business {
  position: relative;
  width: 100%;
  min-height: calc(var(--vh) * 300);
  color: #fff;

  container-type: inline-size;
}

@media screen and (max-width: 768px) {
  .p-index-business {
    min-height: auto;
  }
}

.p-index-business:after {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(106deg, rgba(54, 104, 170, .75) 8.78%, rgba(33, 45, 70, .75) 100%);
  opacity: clamp(0, calc((var(--scroll-progress) - .249999) * 10000000), 1);
  transition: opacity .2s;
}

@media screen and (max-width: 768px) {
  .p-index-business:after {
    opacity: 1;
  }
}

.p-index-business__image-track {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(var(--vh) * 200);
}

@media screen and (max-width: 768px) {
  .p-index-business__image-track {
    display: contents;
  }
}

.p-index-business__image {
  position: sticky;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: calc(var(--vh) * 100);
}

@media screen and (max-width: 768px) {
  .p-index-business__image {
    position: absolute;
    height: 100%;
  }
}

.p-index-business__image img {
  position: absolute;
}

.p-index-business__image img._01 {
  top: 0;
  left: 0;
  width: calc(var(--base-cqi) * 726);
}

@media screen and (max-width: 768px) {
  .p-index-business__image img._01 {
    top: calc(var(--base-cqi-mobile) * 48);
    width: calc(var(--base-cqi-mobile) * 260);
  }
}

.p-index-business__image img._02 {
  top: calc(var(--base-cqi) * 248);
  left: calc(var(--base-cqi) * 826);
  width: calc(var(--base-cqi) * 540);
}

@media screen and (max-width: 768px) {
  .p-index-business__image img._02 {
    top: auto;
    right: 0;
    bottom: calc(var(--base-cqi-mobile) * 233);
    left: auto;
    width: calc(var(--base-cqi-mobile) * 149);
  }
}

.p-index-business__image img._03 {
  top: calc(var(--base-cqi) * 535);
  left: calc(var(--base-cqi) * 138);
  width: calc(var(--base-cqi) * 290);

  --parallax-amount: -30vh;
}

@media screen and (max-width: 768px) {
  .p-index-business__image img._03 {
    top: auto;
    bottom: calc(var(--base-cqi-mobile) * 71);
    left: calc(var(--base-cqi-mobile) * 20);
    width: calc(var(--base-cqi-mobile) * 166);
  }
}

.p-index-business__image img._04 {
  top: calc(var(--base-cqi) * 693);
  left: calc(var(--base-cqi) * 606);
  width: calc(var(--base-cqi) * 290);

  --parallax-amount: -60vh;
}

@media screen and (max-width: 768px) {
  .p-index-business__image img._04 {
    top: auto;
    right: calc(var(--base-cqi-mobile) * 36);
    bottom: calc(var(--base-cqi-mobile) * 48);
    left: auto;
    width: calc(var(--base-cqi-mobile) * 102);
  }
}

.p-index-business__contents-track {
  position: absolute;
  top: calc(var(--vh) * 100);
  left: 0;
  width: 100%;
  height: calc(var(--vh) * 200);
  pointer-events: none;
}

@media screen and (max-width: 768px) {
  .p-index-business__contents-track {
    display: contents;
  }
}

.p-index-business__contents {
  position: sticky;
  top: 0;
  z-index: 2;
  display: grid;
  align-items: flex-end;
  grid-template-columns: 1fr auto;
  gap: 48px;
  width: min(calc(var(--inner-width-px) + var(--inner-padding) * 2), 100%);
  min-height: calc(var(--vh) * 100);
  margin-inline: auto;
  padding-inline: var(--inner-padding);
  pointer-events: auto;
}

@media screen and (max-width: 768px) {
  .p-index-business__contents {
    align-items: center;
    min-height: 0;
    padding-block: calc(var(--base-cqi-mobile) * 251) calc(var(--base-cqi-mobile) * 365);
  }
}

.p-index-business__contents:before {
  content: "OUR BUSINESS";
  position: absolute;
  top: 50%;
  right: 0;
  width: 6.7em;
  color: rgba(151, 167, 202, .3);
  text-align: right;
  font-weight: 700;
  font-size: calc(56px + var(--slope-1px) * 64);
  font-family: var(--point-en-font-family);
  line-height: 1;
  transform: translateY(-120%);
}

@media screen and (max-width: 768px) {
  .p-index-business__contents:before {
    top: calc(var(--base-cqi-mobile) * 221);
    transform: none;
  }
}

.p-index-business__head {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(32px + var(--slope-1px) * 16);
  max-width: 632px;
  padding-right: 16px;
}

@media screen and (max-width: 768px) {
  .p-index-business__head {
    grid-column: span 2;
    padding-right: 0;
  }
}

.p-index-business__body {
  align-self: start;
  grid-column: span 2;
}

.p-index-business__foot {
  grid-column: span 2;
}

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

/* p-index-business-figure
============================== */
.p-index-business-figure {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  padding: calc(var(--overlay-px) / 2);
  font-size: calc(16px + var(--slope-1px) * 4);

  --overlay-px: 30px;
}

@media screen and (max-width: 768px) {
  .p-index-business-figure {
    grid-template-columns: repeat(2, 1fr);
    max-width: 20.9375em;
    margin-inline: auto;
  }
}

.p-index-business-figure__item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 28px;
  aspect-ratio: 1/1;
  padding-block: 13px 0;
  text-align: center;
  text-shadow: 0 0 25px #212d46;
  line-height: 1.4;
}

@media screen and (max-width: 768px) {
  .p-index-business-figure__item {
    padding-block: 0 13px;
  }
}

.p-index-business-figure__item:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(100% + var(--overlay-px));
  aspect-ratio: 1/1;
  padding: 1px;
  border-radius: var(--ovall-radius);
  background: linear-gradient(90deg, rgba(255, 255, 255, .7) -2.36%, rgba(248, 207, 150, .7) 17.3%, rgba(136, 156, 199, .7) 47.18%, rgba(194, 206, 224, .7) 110.84%);
          mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  transform: translate(-50%, -50%);
  pointer-events: none;

  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
}

.p-index-business-figure__item ._en {
  position: absolute;
  top: 34px;
  left: 50%;
  display: block;
  background: linear-gradient(90deg, rgba(255, 255, 255, .7) -2.36%, rgba(248, 207, 150, .7) 17.3%, rgba(136, 156, 199, .7) 47.18%, rgba(194, 206, 224, .7) 110.84%);
  -webkit-background-clip: text;
          background-clip: text;
  text-shadow: none;
  font-weight: 500;
  font-size: calc(10px + var(--slope-1px) * 2);
  font-family: var(--point-en-font-family);
  transform: translateX(-50%);

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

@media screen and (max-width: 768px) {
  .p-index-business-figure__item ._en {
    position: static;
    transform: none;
  }
}

/* p-index-achievements
============================== */
.p-index-achievements {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding: calc(103px + var(--slope-1px) * 29) var(--inner-padding) calc(64px + var(--slope-1px) * 16);

  container-type: inline-size;
}

.p-index-achievements:before {
  content: "ACHIEVEMENTS";
  position: absolute;
  top: calc(calc(103px + var(--slope-1px) * 29) - .2em);
  left: 50%;
  z-index: -1;
  background: linear-gradient(90deg, rgba(255, 255, 255, .4) -2.36%, rgba(248, 207, 150, .4) 17.3%, rgba(136, 156, 199, .4) 47.18%, rgba(194, 206, 224, .4) 110.84%);
  -webkit-background-clip: text;
          background-clip: text;
  font-weight: 700;
  font-size: calc(var(--base-cqi) * 120);
  font-family: var(--point-en-font-family);
  line-height: 1;
  transform: translateX(-50%) translateY(-35%);

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

@media screen and (max-width: 768px) {
  .p-index-achievements:before {
    top: calc(calc(103px + var(--slope-1px) * 29) - .3em);
    left: var(--inner-padding);
    width: 100%;
    word-break: break-all;
    font-size: calc(56px + var(--slope-1px) * 64);
    transform: translateY(-25%);
  }
}

.p-index-achievements__contents {
  display: grid;
  align-items: flex-end;
  grid-template-columns: 1fr auto;
  gap: 48px;
  width: min(var(--inner-width-px), 100%);
  margin-inline: auto;
}

@media screen and (max-width: 768px) {
  .p-index-achievements__contents {
    gap: 29px;
  }
}

@media screen and (max-width: 768px) {
  .p-index-achievements__head {
    grid-column: span 2;
    margin-block: 3px;
  }
}

.p-index-achievements__body {
  grid-column: span 2;
}

.p-index-achievements__foot {
  grid-column: span 2;
}

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

/* p-index-achievements-slider
============================== */
.p-index-achievements-slider {
  overflow: hidden;
  width: calc(100% + var(--inner-overflow));

  --gap: calc(24px + var(--slope-1px) * 8);
  --card-width: calc(303px + var(--slope-1px) * 97);
  --item-width: calc(var(--card-width) + var(--gap));
}

.p-index-achievements-slider__inner {
  padding-right: var(--inner-overflow);
}

.p-index-achievements-slider__list {
  display: flex;
  width: calc(var(--item-width) * 2);
  margin-left: calc(var(--gap) * -.5);
}

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

.p-index-achievements-slider__item {
  flex-shrink: 0;
  width: var(--item-width);
  padding-inline: calc(var(--gap) * .5);
}

.p-index-achievements-slider__control {
  margin-top: calc(21px + var(--slope-1px) * 19);
}

/* p-index-company
============================== */
.p-index-company {
  position: relative;
  padding: calc(48px + var(--slope-1px) * 32) var(--inner-padding);
  background: linear-gradient(91deg, #c2cee0 -16.13%, #f8cf96 3.55%, #889cc7 75.12%, #c2cee0 120.63%);
}

@media screen and (max-width: 768px) {
  .p-index-company {
    background: linear-gradient(91deg, #ffe2ba 0%, #889cc7 60%, #c2cee0 100%);
  }
}

.p-index-company:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  height: 100%;
  aspect-ratio: 928 / 505;
  background: url(../img/company/bg.svg) 50% 50%/contain no-repeat;
}

@media screen and (max-width: 768px) {
  .p-index-company:before {
    top: 50%;
    width: 100%;
    height: auto;
    aspect-ratio: 375 / 316;
    background: url(../img/company/bg-sp.svg) 50% 50%/cover no-repeat;
    transform: translateY(-50%);
  }
}

/* p-index-company-grid
============================== */
.p-index-company-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(16px + var(--slope-1px) * 8);
  width: min(var(--inner-width-px), 100%);
  margin-inline: auto;
}

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

.p-index-company-grid__item {
  display: contents;
}

/* p-index-company-nav
============================== */
.p-index-company-nav {
  display: grid;
  align-items: center;
  grid-template-columns: calc(121px + var(--slope-1px) * 23) 1fr auto;
  gap: calc(16px + var(--slope-1px) * 8);
  padding: calc(20px + var(--slope-1px) * 4);
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: var(--border-radius-lg);
  background: linear-gradient(116deg, rgba(255, 255, 255, .7) 3.9%, rgba(255, 255, 255, .35) 96.28%);
  text-decoration: none;
  transition: all .25s;
}

.p-index-company-nav:hover {
  background-color: rgba(255, 255, 255, .4);
}

.p-index-company-nav__image {
  overflow: hidden;
  border-radius: var(--border-radius);
}

.p-index-company-nav__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-index-company-nav__text {
  display: grid;
  gap: calc(12px + var(--slope-1px) * 2);
  font-size: calc(18px + var(--slope-1px) * 2);
  line-height: 1;
}

.p-index-company-nav__text ._en {
  color: var(--point-color);
  font-weight: 500;
  font-size: calc(10px + var(--slope-1px) * 2);
  font-family: var(--point-en-font-family);
}

.p-index-company-nav:after {
  content: "";
  display: block;
  width: calc(14px + var(--slope-1px) * 2);
  aspect-ratio: 1/1;
  background: currentColor;
  mask: var(--icon-arrow) 50% 50%/contain no-repeat;
}

/* p-index-news
============================== */
.p-index-news {
  padding: calc(48px + var(--slope-1px) * 27) var(--inner-padding) calc(48px + var(--slope-1px) * 32);
}

.p-index-news__inner {
  display: grid;
  grid-template-rows: auto 1fr;
  grid-template-columns: 178px 1fr;
  gap: calc(24px + var(--slope-1px) * 16) 64px;
  width: min(var(--inner-width-px), 100%);
  margin-inline: auto;
  padding: calc(30px + var(--slope-1px) * 42) calc(20px + var(--slope-1px) * 44) calc(30px + var(--slope-1px) * 45);
  border-radius: var(--border-radius-lg);
  background: #fff;
}

@media screen and (max-width: 768px) {
  .p-index-news__inner {
    grid-template-rows: auto;
    grid-template-columns: 100%;
  }
}

@media screen and (max-width: 768px) {
  .p-index-news__head {
    text-align: center;
  }
}

@media screen and (min-width: 769px) {
  .p-index-news__body {
    align-self: center;
    grid-row: span 2;
  }
}

@media screen and (min-width: 769px) {
  .p-index-news__foot {
    max-width: 178px;
  }
}

/* p-index-news-list
============================== */
.p-index-news-list {
  border-top: 1px solid;
}

.p-index-news-list__item {
  border-bottom: 1px solid;
}

/* p-index-news-nav
============================== */
.p-index-news-nav {
  display: grid;
  align-items: center;
  grid-template-columns: 8em 1fr;
  gap: 20px 32px;
  padding: 32px 24px;
  text-decoration: none;
  transition: opacity .25s;
}

.p-index-news-nav:hover {
  opacity: .7;
}

@media screen and (max-width: 768px) {
  .p-index-news-nav {
    grid-template-columns: 100%;
    padding: 24px 16px;
  }
}

.p-index-news-nav__date {
  margin-block: var(--leading-trim);
  font-weight: 700;
  font-size: 12px;
  font-family: var(--point-en-font-family);
}

.p-index-news-nav__text {
  margin-block: var(--leading-trim);
}

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

services

* ============================================================= */
/* p-services
============================== */
.p-services {
  container-type: inline-size;
  --base-cqi: calc(100cqi / 1080);
}

/* p-services-main
============================== */
.p-services-main {
  display: grid;
  grid-template-columns: var(--figure-size) 1fr;
  gap: 32px calc(var(--base-cqi) * 107);
  margin-block: calc(var(--padding-block) * -1);

  --figure-size: calc(var(--base-cqi) * 517);
  --padding-block: calc((100vh - var(--figure-size)) / 2);
}

@media screen and (max-width: 768px) {
  .p-services-main {
    grid-template-columns: 100%;
    margin-block: 0;
  }
}

.p-services-main[data-current-index="01"] {
  --current-index: 1;
}

.p-services-main[data-current-index="02"] {
  --current-index: 2;
}

.p-services-main[data-current-index="03"] {
  --current-index: 3;
}

.p-services-main[data-current-index="04"] {
  --current-index: 4;
}

.p-services-main__contents {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(48px + var(--slope-1px) * 48);
}

@media screen and (min-width: 769px) {
  .p-services-main__contents {
    padding-block: var(--padding-block);
  }
}

/* p-services-figure
============================== */
.p-services-figure {
  position: sticky;
  top: 0;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: calc(var(--vh) * 100);
  aspect-ratio: 1/1;

  container-type: inline-size;
  --base-cqi: calc(100cqi / 517);
}

@media screen and (max-width: 768px) {
  .p-services-figure {
    min-height: 0;
    max-width: 600px;
    margin-inline: auto;

    --base-cqi: calc(100cqi / 335);
  }
}

.p-services-figure__inner {
  position: relative;
  width: 100%;
  aspect-ratio: 1/1;
  padding: calc(var(--base-cqi) * 76);
}

@media screen and (max-width: 768px) {
  .p-services-figure__inner {
    padding: calc(var(--base-cqi-mobile) * 56);
  }
}

.p-services-figure__circle {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

@media screen and (min-width: 769px) {
  .p-services-figure__circle {
    transition: rotate .4s ease-out;

    rotate: calc(90deg * (1 - var(--current-index)));
  }
}

.p-services-figure__list {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  aspect-ratio: 1/1;
  padding-bottom: calc(var(--base-cqi) * 28);
  border-radius: var(--ovall-radius);
  background: #5b7fcc;
  color: #fff;
}

@media screen and (max-width: 768px) {
  .p-services-figure__list {
    flex-direction: column;
    padding-bottom: 0;
    text-align: center;
    font-size: calc(var(--base-cqi-mobile) * 10);
    font-family: var(--point-en-font-family);
    line-height: 1.65;
  }
  .p-services-figure__list:before {
    content: "OUR";
  }
  .p-services-figure__list:after {
    content: "BUSINESS";
  }
}

.p-services-figure__item {
  display: contents;
}

.p-services-figure__item[data-index="01"] {
  --index: 1;
}

.p-services-figure__item[data-index="02"] {
  --index: 2;
}

.p-services-figure__item[data-index="03"] {
  --index: 3;
}

.p-services-figure__item[data-index="04"] {
  --index: 4;
}

.p-services-figure__head {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: calc(var(--base-cqi) * 21);
  width: calc(var(--base-cqi) * 152);
  aspect-ratio: 1/1;
  padding-bottom: calc(var(--base-cqi) * 18);
  border-radius: var(--ovall-radius);
  background: rgba(255, 255, 255, .95);
  text-align: center;
}

@media screen and (min-width: 769px) {
  .p-services-figure__head {
    transition: rotate .4s ease-out;

    rotate: calc(90deg * (-1 + var(--current-index)));
  }
}

@media screen and (max-width: 768px) {
  .p-services-figure__head {
    gap: calc(var(--base-cqi-mobile) * 14);
    width: calc(var(--base-cqi) * 114);
    padding-bottom: calc(var(--base-cqi) * 9);
  }
}

.p-services-figure__head:before {
  content: "";
  position: absolute;
  inset: -1px;
  width: calc(100% + 2px);
  aspect-ratio: 1/1;
  padding: 1px;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(255, 255, 255, .7) -2.36%, rgba(248, 207, 150, .7) 17.3%, rgba(136, 156, 199, .7) 47.18%, rgba(194, 206, 224, .7) 110.84%);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  pointer-events: none;

          mask-composite: exclude;
  -webkit-mask-composite: xor;
}

.p-services-figure__item[data-index="01"] .p-services-figure__head {
  bottom: auto;
  margin-inline: auto;
}

.p-services-figure__item[data-index="02"] .p-services-figure__head {
  left: auto;
  margin-block: auto;
}

.p-services-figure__item[data-index="03"] .p-services-figure__head {
  top: auto;
  margin-inline: auto;
}

.p-services-figure__item[data-index="04"] .p-services-figure__head {
  right: auto;
  margin-block: auto;
}

.p-services-figure__head-en {
  position: relative;
  z-index: 1;
  width: fit-content;
  background: linear-gradient(90deg, rgba(255, 255, 255, .7) -2.36%, rgba(248, 207, 150, .7) 17.3%, rgba(136, 156, 199, .7) 47.18%, rgba(194, 206, 224, .7) 110.84%);
  background-clip: text;
  color: transparent;
  font-weight: 500;
  font-size: calc(var(--base-cqi) * 10);
  font-family: var(--point-en-font-family);

  text-box: trim-both cap alphabetic;
}

@media screen and (max-width: 768px) {
  .p-services-figure__head-en {
    font-size: calc(var(--base-cqi-mobile) * 9);
  }
}

.p-services-figure__head-ja {
  position: relative;
  z-index: 1;
  margin-block: var(--leading-trim);
  color: var(--base-color);
  font-size: calc(var(--base-cqi) * 14);
  line-height: 1.4;
}

@media screen and (max-width: 768px) {
  .p-services-figure__head-ja {
    font-size: calc(var(--base-cqi-mobile) * 13);
  }
}

.p-services-figure__body {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  grid-template-columns: 100%;
  gap: calc(var(--base-cqi) * 31);
  text-align: center;
  opacity: 0;

  translate: -50% -50%;
}

@media screen and (min-width: 769px) {
  .p-services-figure__body {
    opacity: calc(1 - (var(--current-index) - var(--index)) * (var(--current-index) - var(--index)));
    transition: opacity .4s ease-out;
  }
}

.p-services-figure__index {
  font-size: calc(var(--base-cqi) * 14);

  text-box: trim-both cap alphabetic;
}

.p-services-figure__text {
  margin-block: var(--leading-trim);
  font-size: calc(var(--base-cqi) * 16);
  line-height: 1.65;
}

/* p-services-section
============================== */
.p-services-section {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(20px + var(--slope-1px) * 4);
}

.p-services-section:before {
  content: attr(data-index);
  display: block;
  width: fit-content;
  background: linear-gradient(90deg, rgba(255, 255, 255, .7) -2.36%, rgba(248, 207, 150, .7) 17.3%, rgba(136, 156, 199, .7) 47.18%, rgba(194, 206, 224, .7) 110.84%);
  background-clip: text;
  color: transparent;
  font-weight: 500;
  font-size: calc(48px + var(--slope-1px) * 17);
  font-family: var(--point-en-font-family);
  line-height: .8;
}

.p-services-section__head {
  margin-block: var(--leading-trim);
  font-weight: 700;
  font-size: calc(20px + var(--slope-1px) * 4);
}

.p-services-section__body {
  display: contents;
}

.p-services-section__image {
  overflow: hidden;
  border-radius: var(--border-radius-lg);
}

/* p-services-reason
============================== */
.p-services-reason {
  position: relative;
  display: grid;
  grid-template-columns: 100%;
  gap: calc(32px + var(--slope-1px) * 16);
  margin-top: calc(48px + var(--slope-1px) * 32);
  padding-block: calc(48px + var(--slope-1px) * 40);
}

.p-services-reason:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: calc(var(--vw) * 100);
  height: 100%;
  background: #e2e8f5;
  transform: translateX(-50%);
}

.p-services-reason__head {
  position: relative;
  z-index: 1;
}

.p-services-reason__body {
  display: contents;
}

.p-services-reason__body > * {
  position: relative;
  z-index: 1;
}

/* p-services-reason-list
============================== */
.p-services-reason-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: calc(16px + var(--slope-1px) * 16);
}

@media screen and (max-width: 1080px) {
  .p-services-reason-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 768px) {
  .p-services-reason-list {
    grid-template-columns: 100%;
  }
}

.p-services-reason-list__item {
  display: contents;
}

/* p-services-reason-block
============================== */
.p-services-reason-block {
  display: grid;
  grid-template-rows: auto auto 1fr;
  grid-template-columns: 100%;
  padding: 16px 20px 30px;
  border-radius: calc(16px + var(--slope-1px) * 8);
  background: #fff;
}

.p-services-reason-block__image {
  width: 78px;
  aspect-ratio: 1/1;
  margin-inline: auto;
  margin-bottom: 16px;
}

.p-services-reason-block__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-services-reason-block__head {
  margin-bottom: calc(20px + var(--slope-1px) * 4);
  text-align: center;
  font-weight: 700;
  font-size: calc(18px + var(--slope-1px) * 2);

  text-box: trim-both cap alphabetic;
}

.p-services-reason-block__body {
  width: fit-content;
  max-width: 100%;
  margin-block: var(--leading-trim);
  margin-inline: auto;
  font-size: calc(15px + var(--slope-1px) * 1);
}

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

achievements

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

.p-achievements-grid__item {
  display: contents;
}

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

information

* ============================================================= */
/* p-information
============================== */
.p-information {
  display: grid;
  grid-template-columns: 100%;
  gap: 40px;
}

/* p-information-block
============================== */
.p-information-block {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(24px + var(--slope-1px) * 8);
  padding: calc(30px + var(--slope-1px) * 16) calc(20px + var(--slope-1px) * 36) calc(30px + var(--slope-1px) * 26);
  border-radius: calc(20px + var(--slope-1px) * 20);
  background: #fff;
}

.p-information-block__head {
  display: grid;
  align-items: center;
  grid-template-columns: auto 1fr;
  gap: calc(16px + var(--slope-1px) * 8) calc(14px + var(--slope-1px) * 2);
  padding-bottom: calc(24px + var(--slope-1px) * 8);
  border-bottom: 1px solid var(--base-color);
}

.p-information-block__title {
  grid-column: span 2;
  grid-row: 2/3;
  margin-block: var(--leading-trim);
  font-weight: 700;
  font-size: calc(18px + var(--slope-1px) * 6);
  line-height: 1.6;
}

.p-information-block__label {
  display: block;
  padding: calc(8px + var(--slope-1px) * 2) calc(12px + var(--slope-1px) * 2);
  border-radius: var(--ovall-radius);
  background: var(--point-color);
  color: #fff;
  font-weight: 700;
  font-size: calc(12px + var(--slope-1px) * 2);
  line-height: 1;

  text-box: trim-both cap alphabetic;
}

.p-information-block__date {
  color: var(--point-color);
  font-weight: 500;
  font-size: calc(13px + var(--slope-1px) * 1);
  font-family: var(--point-en-font-family);
}

.p-information-block__body {
  display: grid;
  grid-template-columns: 100%;
  gap: 1lh;
}

.p-information-block__body > p:not(:has(img)) {
  margin-block: var(--leading-trim);
}

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

Privacy Policy

* ============================================================= */
.p-privacy-lead {
  margin-bottom: 2.25em;
  padding-bottom: calc(1.75em - var(--leading-trim));
  border-bottom: 1px solid var(--border-color);
}

.p-privacy-block {
  margin-bottom: 40px;
  padding-left: 22px;
}

.p-privacy-section {
  list-style-position: outside;
  list-style-type: decimal;
  line-height: 2;
}

.p-privacy-section:not(:last-child) {
  margin-bottom: 3em;
}

.p-privacy-section em {
  font-style: normal;
  line-height: 1.45;
}

.p-privacy-detail {
  margin-top: 1.4em;
  margin-left: 35px;
}

.p-privacy-detail > li {
  margin-top: 20px;
  list-style-position: outside;
  list-style-type: lower-roman;
}

.p-privacy-detail li:first-child {
  margin-top: 0;
}

.p-privacy-caution {
  margin-top: 20px;
  padding: 2em 1.5em;
  border-radius: var(--border-radius);
  background-color: var(--bg-color);
  font-size: calc(14px + var(--slope-1px) * 2);
}

.p-privacy-caution__head {
  margin-bottom: 1.5em;
  padding-bottom: .5em;
  border-bottom: 1px solid var(--border-color);
  font-weight: 700;
  line-height: 1.2;
}

.p-privacy-caution__body {
  display: grid;
  grid-template-columns: 100%;
  gap: .5em;
}

.p-privacy-caution__body > li {
  display: flex;
  flex-wrap: wrap;
  gap: 0 .5em;
  list-style: none;
  font-size: calc(13px + var(--slope-1px) * 2);
  line-height: 1.25;
}

.p-privacy-caution__body li span {
  display: inline-block;
}

.p-privacy-caution__body li a {
  color: #1c4eb8;
}

.p-privacy-caution:not(:last-child) {
  margin-bottom: 10px;
}

.p-privacy-insurance {
  box-sizing: border-box;
  text-align: left;
}

.p-privacy-insurance__head {
  font-weight: bold;
}

.p-privacy-signature {
  text-align: right;
  line-height: 2.2;
}

.p-privacy-banner {
  width: 100%;
  max-width: 640px;
  margin: calc(30px + var(--slope-1px) * 20) auto 0;
  text-align: center;
}

.p-privacy-banner a {
  display: block;
  width: 100%;
}

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

terms

* ============================================================= */
/* p-terms-block
=============================== */
.p-terms-block {
  line-height: 2;
}

.p-terms-block:not(:first-child) {
  margin-top: calc(30px + var(--slope-1px) * 20);
  padding-top: calc(30px + var(--slope-1px) * 20);
  border-top: 1px solid var(--border-color);
}

.p-terms-block__head {
  margin-bottom: calc(24px + var(--slope-1px) * 8);
}

.p-terms-block__title {
  font-weight: 700;
  font-size: calc(18px + var(--slope-1px) * 6);
}

.p-terms-block__body {
  margin-block: var(--leading-trim);
}

.p-terms-block__body > p + p {
  margin-top: 1.5em;
}

/* p-terms-plugin
=============================== */
.p-terms-plugin {
  margin-top: 1.46667em;
  border: 1px solid var(--border-color);
  border-radius: var(--border-radius);
  background: #fff;
}

.p-terms-plugin__link {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: calc(16px + var(--slope-1px) * 8);
  text-decoration: none;
  transition: all .3s ease-out;
}

.p-terms-plugin__link:hover {
  opacity: .7;
}

@media screen and (max-width: 560px) {
  .p-terms-plugin__link {
    flex-direction: column;
  }
}

.p-terms-plugin__logo {
  margin: 0 1em 0 0;
}

@media screen and (max-width: 560px) {
  .p-terms-plugin__logo {
    margin: 0 0 1em 0;
  }
}

/* p-terms-ssl
=============================== */
.p-terms-ssl {
  margin-top: calc(24px + var(--slope-1px) * 8);
  padding: calc(32px + var(--slope-1px) * 8);
  border: 1px solid var(--border-color);
  border-radius: var(--border-radius);
  background: #fff;
}

.p-terms-ssl__head {
  font-weight: 500;
}

.p-terms-ssl__block:not(:first-child) {
  margin-top: 1.78571em;
}

.p-terms-ssl__item {
  /* -0.375em for line-height offset */
  margin-top: 1.625em;
  margin-bottom: -.375em;
  padding-left: 1em;
}

.p-terms-ssl__item > p {
  position: relative;
  margin-bottom: .5em;
}

.p-terms-ssl__item > p:before {
  content: "\30fb";
  position: absolute;
  top: 0;
  left: -1em;
}

.p-terms-ssl__item > ul > li a {
  position: relative;
  display: inline-block;
  padding-left: 1em;
}

.p-terms-ssl__item > ul > li a:before {
  content: "-";
  position: absolute;
  top: 0;
  left: 0;
}

.p-terms-ssl__foot {
  margin-top: 2.28571em;
}
