@charset "UTF-8";
/* 25top add */
/* only top */
main {
  transition: background 0.6s;
}
main[change-bg] {
  background-color: #d8dfe1;
}

#overlay {
  position: fixed;
  top: 0;
  z-index: 10001;
  width: 100%;
  height: 100lvh;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
}

.swiper-outer {
  overflow: hidden;
}

.swiper-button-wrapper {
  --mgx: 8px;
  display: flex;
  justify-content: flex-end;
  gap: 16px;
  margin: 2px var(--mgx) 16px;
}
@media only screen and (min-width: 1225px) {
  .swiper-button-wrapper {
    --mgx: 0;
  }
}
.swiper-button-wrapper .swiper-button {
  width: 30px;
  height: 30px;
  border-radius: 100vmax;
  background: no-repeat url(/assets/img/icons/ic_forward.svg) center/1.5em;
  color: transparent;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: background-color 0.3s;
}
.swiper-button-wrapper .swiper-button:focus {
  outline: 1px solid;
}
.swiper-button-wrapper .swiper-button.prev {
  scale: -1 1;
}
.swiper-button-wrapper .swiper-button.disable {
  pointer-events: none;
  background-image: url(/assets/img/icons/ic_forward_gray.svg);
}
.swiper-button-wrapper .swiper-button:active {
  background-color: rgba(255, 255, 255, 0.6);
}
@media (hover: hover) {
  .swiper-button-wrapper .swiper-button:hover {
    background-color: rgba(255, 255, 255, 0.6);
  }
}

:root {
  --topIntro-fs: 3.2rem;
  --topIntro-lh: 1.6;
  --topBrand-pt: 40px;
  --topBrand_catch-mb: 40px;
  --set: 0px;
}
@media only screen and (min-width:768px) {
  :root {
    --topIntro-fs: 4.8rem;
    --set: 40px;
  }
}
@media only screen and (min-width:1025px) {
  :root {
    --topBrand-pt: 70px;
    --topBrand_catch-mb: 5px;
  }
  :root:is(html[lang=ja]) {
    --set: 175px;
  }
  :root:is(html[lang=en]) {
    --set: 225px;
  }
  :root:is(html[lang=cn]) {
    --set: 155px;
  }
}

.c-article:is(.p-topBrand *, .p-topSolution *, .p-topStory *, .p-topCategory *) {
  line-height: 200%;
}

.c-headingLv2:is(.p-topBrand *, .p-topSolution *):is(html[lang=en] *, html[lang=cn] *) {
  margin-bottom: 24px;
}

.c-heading_subText:is(.p-topBrand *, .p-topSolution *):is(html[lang=ja] *) {
  font-family: DINNextLTPro-Bold, "FP-こぶりなゴシック StdN W6", sans-serif;
}
.c-heading_subText:is(.p-topBrand *, .p-topSolution *):is(html[lang=en] *) {
  font-family: DINNextLTPro-Bold, sans-serif;
}
.c-heading_subText:is(.p-topBrand *, .p-topSolution *):is(html[lang=cn] *) {
  font-family: "DINNextLTPro-Bold{pm}", "FP-ヒラギノ角ゴ 簡体中文 W6{pm}", sans-serif;
}

.c-heading_subTitle {
  --lh: 38px;
  --fs: 2.6rem;
}
@media only screen and (min-width:768px) {
  .c-heading_subTitle {
    --lh: 54px;
    --fs: 3.6rem;
  }
}
.c-heading_subTitle:is(.p-topBrand *, .p-topSolution *) {
  letter-spacing: 0;
  font-size: var(--fs);
  font-weight: initial;
  line-height: var(--lh);
}
.c-heading_subTitle:is(.p-topBrand *, .p-topSolution *):is(html[lang=ja] *) {
  font-family: DINNextLTPro-Regular, "FP-こぶりなゴシック StdN W3", sans-serif;
}
.c-heading_subTitle:is(.p-topBrand *, .p-topSolution *):is(html[lang=en] *) {
  font-family: DINNextLTPro-Regular, sans-serif;
}
.c-heading_subTitle:is(.p-topBrand *, .p-topSolution *):is(html[lang=cn] *) {
  font-family: "DINNextLTPro-Regular{pm}", "FP-ヒラギノ角ゴ 簡体中文 W3{pm}", sans-serif;
}

.c-btn:is(.p-topSolution + * > *) {
  background: none;
}

.p-topIntro {
  position: absolute;
  top: 0;
  z-index: 10000;
  width: 100%;
  height: calc(100svh + var(--topBrand-pt) + var(--topIntro-fs) * var(--topIntro-lh) * 2 + var(--topBrand_catch-mb) + var(--set));
  pointer-events: none;
}
.p-topIntro_main {
  height: 100%;
  background: rgba(65, 143, 171, 0.9);
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100svh, 0 100svh);
          clip-path: polygon(0 0, 100% 0, 100% 100svh, 0 100svh);
}
.p-topIntro_sub {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-clip-path: polygon(0 100svh, 100% 100svh, 100% 100%, 0 100%);
          clip-path: polygon(0 100svh, 100% 100svh, 100% 100%, 0 100%);
}
.p-topIntro_catchText {
  position: -webkit-sticky;
  position: sticky;
  top: 50%;
  translate: 0 -50%;
  font-size: var(--topIntro-fs);
  font-weight: 600;
  line-height: var(--topIntro-lh);
  letter-spacing: 4px;
  width: min(100%, 1224px);
  margin-inline: auto;
  padding-inline: 8px;
}
.p-topIntro_catchText:is(html[lang=ja] *) {
  font-family: DINNextLTPro-Bold, "FP-こぶりなゴシック StdN W6", sans-serif;
}
.p-topIntro_catchText:is(html[lang=en] *) {
  font-family: DINNextLTPro-Bold, sans-serif;
}
.p-topIntro_catchText:is(html[lang=cn] *) {
  font-family: "DINNextLTPro-Bold{pm}", "FP-ヒラギノ角ゴ 簡体中文 W6{pm}", sans-serif;
}
.p-topIntro_catchText:is(.p-topIntro_main *) {
  opacity: 0;
  color: #fff;
}
.p-topIntro_catchText:is(.p-topIntro_sub *) {
  color: #418fab;
}

.p-topMv {
  --toR: 120px;
  --toT: 80px;
  --obj-pos-set: center center;
  --obj-pos-set-port: center center;
  --obj-pos-l: 50%;
  --obj-pos-l-port: var(--obj-pos-l);
  --obj-pos-r0: var(--toR);
  --obj-pos-r0-port: 40%;
  --obj-pos-r100: 0px;
  padding-top: 0;
}
.p-topMv .swiper-mv {
  width: 100%;
  height: 100svh;
}
.p-topMv .swiper-mv .swiper-slide-prev .p-topMv_img-zoomOut img,
.p-topMv .swiper-mv .swiper-slide-active .p-topMv_img-zoomOut img {
  -webkit-animation: zoom-out calc(var(--delay) * 2 + var(--speed) / 4) linear calc(var(--speed) * 0.05) both;
          animation: zoom-out calc(var(--delay) * 2 + var(--speed) / 4) linear calc(var(--speed) * 0.05) both;
}
.p-topMv .swiper-mv .swiper-slide-prev .p-topMv_img-zoomIn img,
.p-topMv .swiper-mv .swiper-slide-active .p-topMv_img-zoomIn img {
  -webkit-animation: zoom-in calc(var(--delay) * 2 + var(--speed) / 4) linear calc(var(--speed) * 0.05) both;
          animation: zoom-in calc(var(--delay) * 2 + var(--speed) / 4) linear calc(var(--speed) * 0.05) both;
}
.p-topMv .swiper-mv .swiper-slide-prev .p-topMv_img-toTop img,
.p-topMv .swiper-mv .swiper-slide-active .p-topMv_img-toTop img {
  -webkit-animation: to-top calc(var(--delay) * 2 + var(--speed) / 2) linear calc(var(--speed) * 0.05) both;
          animation: to-top calc(var(--delay) * 2 + var(--speed) / 2) linear calc(var(--speed) * 0.05) both;
}
@media (orientation: portrait) {
  .p-topMv .swiper-mv .swiper-slide-prev .p-topMv_img-toTop img,
.p-topMv .swiper-mv .swiper-slide-active .p-topMv_img-toTop img {
    --obj-pos-l: var(--obj-pos-l-port);
  }
}
.p-topMv .swiper-mv .swiper-slide-prev .p-topMv_img-toBottom img,
.p-topMv .swiper-mv .swiper-slide-active .p-topMv_img-toBottom img {
  -webkit-animation: to-bottom calc(var(--delay) * 2 + var(--speed) / 2) linear calc(var(--speed) * 0.05) both;
          animation: to-bottom calc(var(--delay) * 2 + var(--speed) / 2) linear calc(var(--speed) * 0.05) both;
}
@media (orientation: portrait) {
  .p-topMv .swiper-mv .swiper-slide-prev .p-topMv_img-toBottom img,
.p-topMv .swiper-mv .swiper-slide-active .p-topMv_img-toBottom img {
    --obj-pos-l: var(--obj-pos-l-port);
  }
}
.p-topMv .swiper-mv .swiper-slide-prev .p-topMv_img-toRight img,
.p-topMv .swiper-mv .swiper-slide-active .p-topMv_img-toRight img {
  -webkit-animation: to-right calc(var(--delay) * 2 + var(--speed) / 2) linear calc(var(--speed) * 0.05) both;
          animation: to-right calc(var(--delay) * 2 + var(--speed) / 2) linear calc(var(--speed) * 0.05) both;
}
@media (orientation: portrait) {
  .p-topMv .swiper-mv .swiper-slide-prev .p-topMv_img-toRight img,
.p-topMv .swiper-mv .swiper-slide-active .p-topMv_img-toRight img {
    --toR: 80px;
    --obj-pos-r0: var(--obj-pos-r0-port);
    --obj-pos-r100: calc(var(--obj-pos-r0-port) - var(--toR));
  }
}
.p-topMv .swiper-mv .swiper-slide-prev .p-topMv_img-toLeft img,
.p-topMv .swiper-mv .swiper-slide-active .p-topMv_img-toLeft img {
  -webkit-animation: to-left calc(var(--delay) * 2 + var(--speed) / 2) linear calc(var(--speed) * 0.05) both;
          animation: to-left calc(var(--delay) * 2 + var(--speed) / 2) linear calc(var(--speed) * 0.05) both;
}
@media (orientation: portrait) {
  .p-topMv .swiper-mv .swiper-slide-prev .p-topMv_img-toLeft img,
.p-topMv .swiper-mv .swiper-slide-active .p-topMv_img-toLeft img {
    --toR: 80px;
    --obj-pos-r0: var(--obj-pos-r0-port);
    --obj-pos-r100: calc(var(--obj-pos-r0-port) - var(--toR));
  }
}
.p-topMv_img {
  overflow: hidden;
  height: 100%;
}
.p-topMv_img::after {
  content: "";
  position: absolute;
  top: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.1);
  pointer-events: none;
}
.p-topMv_img img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: var(--obj-pos-set);
     object-position: var(--obj-pos-set);
  width: 100%;
  height: 100%;
}
@media (orientation: portrait) {
  .p-topMv_img img {
    -o-object-position: var(--obj-pos-set-port);
       object-position: var(--obj-pos-set-port);
  }
}
.p-topMv_img img:is(.p-topMv_img-toTop *, .p-topMv_img-toBottom *) {
  height: calc(100% + var(--toT));
}
.p-topMv_img img:is(.p-topMv_img-toRight *, .p-topMv_img-toLeft *) {
  width: calc(100% + var(--toR));
}
.p-topMv_title {
  --w: 1.6em;
  position: absolute;
  bottom: 0;
  width: 100%;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), black);
  transition: opacity 0.2s;
}
.p-topMv_title_link {
  display: block;
  width: 100%;
  padding: 1em calc(var(--w) * 2) 1em 1em;
  color: #fff;
  text-decoration: none;
  transition: color 0.3s, opacity 0.3s;
}
.p-topMv_title_link:is(.p-topMv_title[is-hide] *) {
  opacity: 0;
}
.p-topMv_title_link::before {
  pointer-events: none;
  right: 0;
  translate: -50% 0;
  width: var(--w);
  height: var(--w);
  background-image: url(/assets/img/icons/ic_forward_white.svg);
  transition: background-image 0.3s;
}
.p-topMv_title_link.no-link {
  pointer-events: none;
  height: 100%;
}
.p-topMv_title_link.no-link::before {
  visibility: hidden;
}
@media only screen and (min-width:768px) {
  .p-topMv_title_link {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
    padding: 2.4rem calc(var(--w) * 2 + 1.2rem) 2.4rem 2.4rem;
  }
  .p-topMv_title_link::before {
    right: var(--w);
    translate: 0 0;
  }
}
@media (hover: hover) {
  .p-topMv_title_link:hover {
    color: #418fab;
  }
  .p-topMv_title_link:hover::before {
    background-image: url(/assets/img/icons/ic_forward_blue.svg);
  }
}
.p-topMv_title_note {
  line-height: 1.6;
}
@-webkit-keyframes zoom-out {
  0% {
    scale: 1.12;
  }
  100% {
    scale: 1;
  }
}
@keyframes zoom-out {
  0% {
    scale: 1.12;
  }
  100% {
    scale: 1;
  }
}
@-webkit-keyframes zoom-in {
  0% {
    scale: 1;
  }
  100% {
    scale: 1.12;
  }
}
@keyframes zoom-in {
  0% {
    scale: 1;
  }
  100% {
    scale: 1.12;
  }
}
@-webkit-keyframes to-top {
  0% {
    object-position: top 0px left var(--obj-pos-l);
  }
  100% {
    object-position: top calc(var(--toT) * -1) left var(--obj-pos-l);
  }
}
@keyframes to-top {
  0% {
    -o-object-position: top 0px left var(--obj-pos-l);
       object-position: top 0px left var(--obj-pos-l);
  }
  100% {
    -o-object-position: top calc(var(--toT) * -1) left var(--obj-pos-l);
       object-position: top calc(var(--toT) * -1) left var(--obj-pos-l);
  }
}
@-webkit-keyframes to-bottom {
  0% {
    object-position: top calc(var(--toT) * -1) left var(--obj-pos-l);
  }
  100% {
    object-position: top 0px left var(--obj-pos-l);
  }
}
@keyframes to-bottom {
  0% {
    -o-object-position: top calc(var(--toT) * -1) left var(--obj-pos-l);
       object-position: top calc(var(--toT) * -1) left var(--obj-pos-l);
  }
  100% {
    -o-object-position: top 0px left var(--obj-pos-l);
       object-position: top 0px left var(--obj-pos-l);
  }
}
@-webkit-keyframes to-right {
  0% {
    object-position: right var(--obj-pos-r0) top 50%;
  }
  100% {
    object-position: right var(--obj-pos-r100) top 50%;
  }
}
@keyframes to-right {
  0% {
    -o-object-position: right var(--obj-pos-r0) top 50%;
       object-position: right var(--obj-pos-r0) top 50%;
  }
  100% {
    -o-object-position: right var(--obj-pos-r100) top 50%;
       object-position: right var(--obj-pos-r100) top 50%;
  }
}
@-webkit-keyframes to-left {
  0% {
    object-position: right var(--obj-pos-r100) top 50%;
  }
  100% {
    object-position: right var(--obj-pos-r0) top 50%;
  }
}
@keyframes to-left {
  0% {
    -o-object-position: right var(--obj-pos-r100) top 50%;
       object-position: right var(--obj-pos-r100) top 50%;
  }
  100% {
    -o-object-position: right var(--obj-pos-r0) top 50%;
       object-position: right var(--obj-pos-r0) top 50%;
  }
}

.p-topBrand {
  padding-top: var(--topBrand-pt);
}
.p-topBrand_content {
  padding-top: calc(var(--topIntro-fs) * var(--topIntro-lh) * 2 + var(--topBrand_catch-mb));
}
@media only screen and (min-width:1025px) {
  .p-topBrand_content {
    width: 45%;
    margin-left: auto;
    padding-top: 0;
  }
}
.p-topBrand .c-heading_subText {
  font-size: 1.6rem;
  margin-bottom: 1em;
}

.p-topSolution {
  --fs: 2rem;
  --lh: 1.3;
  --title-mb: 0.5em;
  --gap: 32px;
  --posT: 0;
  --posL: 8px;
  --rate: 2;
  --mb: 200px;
  --h: calc(100lvh - (var(--start)) - var(--gap) * 3 - var(--space));
  counter-reset: card-count;
}
@media only screen and (min-width:768px) {
  .p-topSolution {
    --fs: 2.6rem;
    --lh: 1.6;
    --title-mb: 1em;
    --posT: 4px;
    --posL: 16px;
    --rate: 1.5;
  }
}
.p-topSolution .c-heading_subText {
  font-size: 1.6rem;
  line-height: 1.4;
  margin-bottom: 1em;
}
.p-topSolution_heading {
  position: -webkit-sticky;
  position: sticky;
  top: var(--headingSticky);
  will-change: transform;
  transform: translateZ(0);
}
.p-topSolution_heading .c-article {
  transition: opacity 0.3s;
}
.p-topSolution_outer {
  display: grid;
  margin-top: var(--mb);
}
.p-topSolution_outer > * {
  grid-row: 1;
  grid-column: 1;
}
.p-topSolution_bgArea {
  display: grid;
  gap: var(--space);
  width: 100%;
}
.p-topSolution_bgArea::after {
  content: "";
  display: block;
  width: 100%;
  height: calc(var(--gap) * 4);
}
.p-topSolution_bg {
  height: var(--h);
}
.p-topSolution_cards_outer {
  will-change: transform;
  transform: translateZ(0);
}
.p-topSolution_cards {
  position: -webkit-sticky;
  position: sticky;
  top: var(--start);
  display: grid;
  gap: var(--space);
  width: 100%;
  will-change: transform;
  transform: translateZ(0);
}
@media only screen and (max-width: 767px) {
  .p-topSolution_cards {
    padding: 0;
  }
}
.p-topSolution_cards::after {
  content: "";
  display: block;
  width: 100%;
  height: calc(var(--gap) * 3);
}
.p-topSolution_card {
  --progress: 0;
  --bgProgress: 0;
  left: 0;
  display: grid;
  color: #fff;
  line-height: var(--lh);
  width: 100%;
  height: var(--h);
  padding: var(--gap) 10%;
  counter-increment: card-count;
  will-change: transform;
  transform: translateZ(0);
}
.p-topSolution_card:nth-of-type(2) {
  position: absolute;
  top: calc(var(--h) + var(--space));
}
.p-topSolution_card:nth-of-type(3) {
  position: absolute;
  top: calc(var(--h) + var(--gap) + var(--space));
}
.p-topSolution_card:nth-of-type(4) {
  position: absolute;
  top: calc(var(--h) + var(--gap) * 2 + var(--space));
}
@media only screen and (min-width:768px) {
  .p-topSolution_card {
    text-align: center;
  }
}
.p-topSolution_card::before {
  content: counter(card-count, decimal-leading-zero);
  position: absolute;
  top: var(--posT);
  left: var(--posL);
  z-index: 1;
  font-size: 1.8rem;
}
.p-topSolution_card_img {
  position: absolute;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
.p-topSolution_card_img::after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  background: rgba(0, 0, 0, 0.45);
  width: 100%;
  height: 100%;
}
.p-topSolution_card_img img {
  -o-object-fit: cover;
     object-fit: cover;
  height: calc(100% + 20vh);
  -o-object-position: bottom calc(20vh - var(--progress) * 0.2vh) left 50%;
     object-position: bottom calc(20vh - var(--progress) * 0.2vh) left 50%;
}
@media only screen and (min-width: 1025px) and (orientation: landscape) {
  .p-topSolution_card_img img:is(.p-topSolution_card:nth-of-type(1) *) {
    height: calc(100% + 30vh);
    -o-object-position: top calc(-30vh + var(--progress) * 0.3vh) left 50%;
       object-position: top calc(-30vh + var(--progress) * 0.3vh) left 50%;
  }
  .p-topSolution_card_img img:is(.p-topSolution_card:nth-of-type(2) *) {
    height: calc(100% + 20vh);
    -o-object-position: bottom calc(20vh - var(--progress) * 0.2vh) left 50%;
       object-position: bottom calc(20vh - var(--progress) * 0.2vh) left 50%;
  }
  .p-topSolution_card_img img:is(.p-topSolution_card:nth-of-type(3) *, .p-topSolution_card:nth-of-type(4) *) {
    height: calc(100% + 35vh);
    -o-object-position: top calc(-35vh + var(--progress) * 0.35vh) left 50%;
       object-position: top calc(-35vh + var(--progress) * 0.35vh) left 50%;
  }
}
.p-topSolution_card_textBox {
  z-index: 1;
  align-self: center;
  margin-inline: auto;
}
@media only screen and (min-width:1025px) {
  .p-topSolution_card_textBox:is(html[lang=en] *) {
    max-width: 700px;
  }
}
.p-topSolution_card_title {
  --progress: 0;
  font-size: var(--fs);
  font-weight: 600;
  margin-bottom: var(--title-mb);
}
.p-topSolution_card_title:is(html[lang=ja] *) {
  font-family: DINNextLTPro-Bold, "FP-こぶりなゴシック StdN W6", sans-serif;
}
.p-topSolution_card_title:is(html[lang=en] *) {
  font-family: DINNextLTPro-Bold, sans-serif;
}
.p-topSolution_card_title:is(html[lang=cn] *) {
  font-family: "DINNextLTPro-Bold{pm}", "FP-ヒラギノ角ゴ 簡体中文 W6{pm}", sans-serif;
}
.p-topSolution_card_note {
  font-size: 1.6rem;
}

.p-topStory {
  --fs: 6.4rem;
  --imgW: calc(100% - 8px);
  --ta: center;
  --pt: 120px;
  --pb: 10px;
  padding-top: var(--pt);
  padding-bottom: var(--pb);
}
@media only screen and (min-width:768px) {
  .p-topStory {
    --fs: 8rem;
    --imgW: 100%;
    --ta: initial;
    --pt: 170px;
    --pb: 40px;
  }
}
.p-topStory .c-headingLv2 {
  color: #6d8289;
  font-size: var(--fs);
  line-height: 1.3;
  font-weight: 400;
  font-family: DINNextLTPro-Regular, "FP-こぶりなゴシック StdN W3", sans-serif;
  text-align: var(--ta);
}
.p-topStory .c-card-type2 {
  margin: unset;
  max-width: unset;
}
.p-topStory .c-card-type2_img {
  width: var(--imgW);
}
.p-topStory .c-card-type2_item {
  margin-right: unset;
}
@media only screen and (min-width:768px) {
  .p-topStory .c-card-type2_item {
    right: 0;
    width: calc(100% - 45px);
    max-width: unset;
    margin-top: -17%;
  }
}
@media only screen and (min-width:1025px) {
  .p-topStory .c-card-type2_item {
    right: 64px;
    width: 52%;
    max-width: 624px;
    margin-top: -144px;
  }
}
.p-topStory .c-card-type2_note {
  display: flex;
  align-items: center;
}
.p-topStory .c-card-type2_note::before {
  translate: 0 100%;
}
.p-topStory .c-card-type2_link {
  transition-property: color;
}
.p-topStory .swiper-story {
  width: min(100%, 1208px);
  overflow: visible;
}

.p-topCategory {
  --fs: 1.8rem;
  --fs-sub: 1.4rem;
  --fs-note: 1.2rem;
  --mt: 8px;
  --maxW: 176px;
  --posR: 4px;
  --asp: 1/1;
}
@media only screen and (min-width:768px) {
  .p-topCategory {
    --fs: 2.2rem;
    --fs-sub: 1.5rem;
    --fs-note: 1.4rem;
    --mt: 16px;
    --maxW: 280px;
    --posR: 12px;
    --asp: 1.6/1;
  }
}
.p-topCategory .c-link-type1 {
  flex-direction: row;
  font-size: var(--fs);
  padding: 0;
}
.p-topCategory .c-link-type1_textBox {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex: 1;
  padding: 0.5em 1em;
}
.p-topCategory .c-link-type1_text {
  letter-spacing: 1px;
  padding: 0;
  color: #17191a;
}
.p-topCategory .c-link-type1_text:is(html[lang=cn] *) {
  margin-bottom: 0;
}
.p-topCategory .c-link-type1_text:is(.c-link-type1:hover *, .c-link-type1:active *) {
  color: #17191a;
}
.p-topCategory .c-link-type1_subText {
  font-size: var(--fs-sub);
  line-height: 1.4;
  color: #17191a;
  margin-top: var(--mt);
  padding: 0;
}
.p-topCategory .c-link-type1_subText:is(.c-link-type1:hover *, .c-link-type1:active *) {
  color: #17191a;
}
@media only screen and (max-width:1024px) {
  .p-topCategory .c-link-type1_subText br {
    display: none;
  }
}
.p-topCategory .c-link-type1_img {
  position: relative;
  display: grid;
  width: 50%;
  max-width: var(--maxW);
  padding: 0;
  overflow: hidden;
}
.p-topCategory .c-link-type1_img > * {
  grid-row: 1;
  grid-column: 1;
}
.p-topCategory .c-link-type1_img img {
  aspect-ratio: var(--asp);
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  transition: scale 0.3s;
}
.p-topCategory .c-link-type1_img img:is(.c-link-type1:hover *) {
  scale: 1.1;
}
.p-topCategory .c-link-type1_title {
  align-self: end;
  display: grid;
  align-items: center;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), black);
  color: #fff;
  padding: 12px 1.5em 8px 8px;
  transition: color 0.3s;
}
.p-topCategory .c-link-type1_title::before {
  background-image: url(/assets/img/icons/ic_forward_white.svg);
  right: var(--posR);
  translate: 0 -3px;
  margin-bottom: 0;
}
.p-topCategory .c-link-type1_note {
  display: block;
  font-size: var(--fs-note);
}
@media only screen and (max-width: 767px) {
  .p-topCategory .l-tile-1col-sm .l-tile_item {
    margin-top: 16px;
  }
  .p-topCategory .l-tile-1col-sm .l-tile_item:is(html[lang=en] *, html[lang=cn] *) {
    margin-bottom: 0;
  }
  .p-topCategory .l-tile-1col-sm .l-tile_item:nth-child(-n+1) {
    margin-top: 0;
  }
}

.p-topWorks {
  margin-top: 40px;
  padding-top: 0;
}
@media only screen and (min-width:768px) {
  .p-topWorks {
    margin-top: 120px;
  }
  .p-topWorks::before {
    left: calc((100% - min(100%, 1224px)) / 2 + 100px);
    right: 0;
  }
  .p-topWorks::before:is(html[lang=ja] *) {
    top: 44px;
  }
}
.p-topWorks .swiper-works {
  width: min(100%, 1208px);
  overflow: visible;
}
.p-topWorks .c-card_category {
  position: absolute;
  right: 0;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 1px;
  color: #fff;
  font-size: 1.2rem;
}
.p-topWorks .c-card_category .item {
  background: rgba(110, 119, 122, 0.8);
  padding: 3px 1em 0;
  line-height: 1.6;
}
.p-topWorks .p-topButton {
  margin-top: 20px;
  margin-bottom: 0;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .p-topWorks .p-topButton {
    margin-top: 40px;
  }
}

.p-topNews .c-filter_linksList label:hover {
  color: #418fab;
}

.p-topCard .c-card-type3_img {
  height: -webkit-min-content;
  height: -moz-min-content;
  height: min-content;
}
.p-topCard .c-card-type3_img img {
  border: 1px solid #9fa1a0;
}
.p-topCard .c-card-type3_textBox {
  line-height: 1.6;
  padding: 2.5em;
}
@media only screen and (min-width:768px) {
  .p-topCard .c-card-type3_list {
    display: flex;
    flex-wrap: wrap;
  }
  .p-topCard .c-card-type3_textBox {
    font-size: 1.4rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .p-topCard .c-card-type3_list {
    gap: 30px;
  }
  .p-topCard .c-card-type3 {
    width: calc((100% - 30px) / 2);
    margin-top: 0px;
  }
}
@media only screen and (min-width:1025px) {
  .p-topCard .c-card-type3_img {
    height: initial;
    min-height: 150px;
  }
}

.p-topBanner-type2 {
  --gap: 10px;
}
@media only screen and (min-width:1025px) {
  .p-topBanner-type2 {
    --gap: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .p-topBanner-type2 .l-tile_item:is(.l-tile-1col-sm *) {
    margin-top: var(--gap);
  }
  .p-topBanner-type2 .l-tile_item:is(.l-tile-1col-sm *):nth-child(-n+1) {
    margin-top: 0;
  }
}
@media only screen and (min-width:768px) {
  .p-topBanner-type2 .l-tile_item:is(.l-tile-2col-om *) {
    width: calc((100% - var(--gap)) / 2);
    margin-top: var(--gap);
  }
  .p-topBanner-type2 .l-tile_item:is(.l-tile-2col-om *).l-tile_item-100 {
    width: 100%;
  }
  .p-topBanner-type2 .l-tile_item:is(.l-tile-2col-om *):nth-child(-n+2) {
    margin-top: 0;
  }
  .p-topBanner-type2 .l-tile_item:is(.l-tile-2col-om *):not(:nth-child(2n+1)) {
    margin-left: var(--gap);
  }
}

.c-card-type5 {
  --fs: 2rem;
  --minH: 90px;
  font-size: var(--fs);
}
@media only screen and (min-width:768px) {
  .c-card-type5 {
    --minH: 120px;
  }
  .c-card-type5.l-tile_item-100 {
    --minH: 144px;
  }
}
@media only screen and (min-width:1025px) {
  .c-card-type5:is(html[lang=ja] *) {
    --fs: 2.6rem;
  }
  .c-card-type5:is(html[lang=en] *) {
    --fs: 3.6rem;
  }
}
.c-card-type5_link {
  position: relative;
  display: grid;
  text-decoration: none;
  padding-right: 0;
}
.c-card-type5_link:is(html[lang=ja] *) {
  min-height: var(--minH);
}
.c-card-type5_link.u-icon-right::before {
  z-index: 1;
  width: 0.8em;
  right: 1.5em;
}
.c-card-type5_link.u-icon-forward::before {
  background-image: url(/assets/img/icons/ic_forward_white.svg);
}
.c-card-type5_link.u-icon-linkBlank::before {
  background-image: url(/assets/img/icons/ic_link_blank_white.svg);
}
.c-card-type5_img {
  position: absolute;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
.c-card-type5_img::after {
  position: absolute;
  left: 0;
  content: "";
  background: rgba(0, 0, 0, 0.2);
  width: 100%;
  height: 100%;
}
.c-card-type5_img img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
  transition: 0.2s;
}
@media (hover: hover) {
  .c-card-type5_img img:is(.c-card-type5_link:hover *) {
    scale: 1.1;
  }
}
@media only screen and (min-width:768px) {
  .c-card-type5_img:is(.l-tile_item-100 *) {
    display: flex;
  }
  .c-card-type5_img:is(.l-tile_item-100 *) img:is(.c-card-type5_link:hover *) {
    scale: 1.05;
  }
  .c-card-type5_img:is(.l-tile_item-100 *) img:nth-child(1) {
    -o-object-position: center 30%;
       object-position: center 30%;
    transform-origin: right;
  }
  .c-card-type5_img:is(.l-tile_item-100 *) img:nth-child(2) {
    transform-origin: left;
  }
}
.c-card-type5_textBox {
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.2;
  color: #fff;
  font-weight: 600;
  padding: 1em;
}
.c-card-type5_textBox:is(html[lang=ja] *) {
  font-family: DINNextLTPro-Bold, "FP-こぶりなゴシック StdN W6", sans-serif;
}
.c-card-type5_textBox:is(html[lang=en] *) {
  font-family: DINNextLTPro-Bold, sans-serif;
}