:root {
  --u: min(100vw, 1440px);
  --g50: #f5f5f5; --g100: #e6e6e6; --g200: #c7c7c7; --g300: #a3a3a3; --g500: #616161;
  --g700: #333; --g800: #222; --g900: #111;
  --blue: #146af5;
  --ease01: cubic-bezier(.16, 1, .3, 1);
  --ease02: cubic-bezier(.6, .25, 0, 1);
  --en: "Plus Jakarta Sans", "Noto Sans JP", sans-serif;
  --jp: "Plus Jakarta Sans", "Noto Sans JP", sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
body {
  margin: 0; background: #fff; color: var(--g800);
  font-family: var(--jp); font-weight: 500; font-size: 16px; letter-spacing: .03em;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
  font-feature-settings: "palt"; }
a { color: inherit; text-decoration: none; }
img, video { display: block; max-width: 100%; }
h1, h2, h3, h4, h5, p, figure, ul { margin: 0; padding: 0; font-weight: inherit; }
ul { list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
.sp { display: none; }

.ttl-en, .bnf-lbl, .svc-card-lbl, .dl-en, .about-num, .svc-card-pre, .cases-count { font-family: var(--en); font-weight: 700; }
.ttl-jp, .about-ttl, .bnf-ttl, .sol-lbl, .sol-ttl, .icon-btn, .svc-sbttl, .svc-card-ttl, .case-ttl, .case-company,
.news-item a, .dl-ttl, .ft-copy, .ft-nav-a, .ft-nav-b { font-weight: 800; font-feature-settings: "palt"; }

.ph { position: relative; width: 100%; height: 100%; overflow: hidden; background: linear-gradient(135deg, #d9d9d9, #bdbdbd); }
.ph--b { background: linear-gradient(135deg, #cfd6e2, #9aa6ba); }
.ph--c { background: linear-gradient(135deg, #f1e3b8, #d9b867); }
.ph--dark { background: linear-gradient(150deg, #3a3a3a, #1d1d1d); }
.ph::after { content: attr(data-label); position: absolute; left: 14px; bottom: 12px; font: 600 11px/1 var(--en); letter-spacing: .12em; color: rgba(0,0,0,.4); }
.ph--dark::after { color: rgba(255,255,255,.35); }

.arw-d, .arw-h, .arw-up { position: absolute; top: 50%; left: 50%; overflow: hidden; transform: translate(-50%, -50%); }
.arw-d { width: 10px; height: 10px; }
.arw-h { width: 11px; height: 7px; }
.arw-up { width: 10px; height: 21px; top: 60px; transform: translateX(-50%); }
.arw-d::before, .arw-d::after, .arw-h::before, .arw-h::after, .arw-up::before, .arw-up::after {
  content: ""; position: absolute; inset: 0; background: currentColor;
  -webkit-mask: var(--m) center / 100% auto no-repeat; mask: var(--m) center / 100% auto no-repeat;
}
.arw-d { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='%23000' stroke-width='1.4'%3E%3Cpath d='M1 9 9 1M3 1h6v6'/%3E%3C/svg%3E"); }
.arw-h { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 7' fill='none' stroke='%23000' stroke-width='1.2'%3E%3Cpath d='M0 3.5h10M7 .5l3 3-3 3'/%3E%3C/svg%3E"); }
.arw-up { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 21' fill='none' stroke='%23000' stroke-width='1.2'%3E%3Cpath d='M5 21V1M1 5l4-4 4 4'/%3E%3C/svg%3E"); }
.arw-d::after { transform: translate(-100%, 100%); }
.arw-h::after { transform: translateX(-100%); }
.arw-up::after { transform: translateY(100%); }
a:hover .arw-d::before { animation: arwDOut 1s cubic-bezier(.19, 1, .22, 1); }
a:hover .arw-d::after { animation: arwDIn 1s cubic-bezier(.19, 1, .22, 1); }
a:hover .arw-h::before, button:hover .arw-h::before { animation: arwHOut 1s cubic-bezier(.19, 1, .22, 1); }
a:hover .arw-h::after, button:hover .arw-h::after { animation: arwHIn 1s cubic-bezier(.19, 1, .22, 1); }
button:hover .arw-up::before { animation: arwUOut 1s cubic-bezier(.19, 1, .22, 1); }
button:hover .arw-up::after { animation: arwUIn 1s cubic-bezier(.19, 1, .22, 1); }
@keyframes arwDOut { to { transform: translate(100%, -100%); } }
@keyframes arwDIn { from { transform: translate(-100%, 100%); } to { transform: none; } }
@keyframes arwHOut { to { transform: translateX(100%); } }
@keyframes arwHIn { from { transform: translateX(-100%); } to { transform: none; } }
@keyframes arwUOut { to { transform: translateY(-100%); } }
@keyframes arwUIn { from { transform: translateY(100%); } to { transform: none; } }

.icon-btn { display: inline-flex; align-items: center; }
.icon-sq { position: relative; display: block; width: clamp(0px, 4.1666666667vw, 60px); height: clamp(0px, 4.1666666667vw, 60px); border-radius: 4px; background: var(--g800); color: #fff; transition: opacity .3s; }
.icon-btn:hover .icon-sq { opacity: .9; }
.icon-txt { transition: opacity .3s; margin-top: 2px; }
.icon-btn:hover .icon-txt { opacity: .7; }
.icon-btn--w { color: #fff; }
.icon-btn--w .icon-sq { background: #fff; color: #000; }
.sec-btn { display: table; margin-left: auto; font-size: 16px; }
.sec-btn .icon-sq { margin-left: clamp(0px, 1.5277777778vw, 22px); }

.hr {
  height: 1px; margin: 0 4.1666666667vw; border: 0; background: var(--g700);
  transform: scaleX(0); transform-origin: left top; transition: transform 1.9s var(--ease01);
}
.hr.is-in { transform: scaleX(1); }

.ttl { display: block; margin: 0 0 37px; }
.ttl-jp {
  position: relative; display: block; padding-left: 18px; margin: 23px 0 clamp(0px, 5.5555555556vw, 80px);
  font-size: calc((1440px - (1440px - var(--u)) / 3) / 1440 * 16); line-height: 1.3; letter-spacing: 0;
}
.ttl-jp::before { content: ""; position: absolute; left: 0; top: .3em; width: 6px; height: 6px; border-radius: 2px; background: var(--blue); }
.ttl-en { display: block; font-size: calc((1440px - (1440px - var(--u)) / 2.4) / 1440 * 100); line-height: .9; letter-spacing: -.05em; }

.about { margin: 0 4.1666666667vw clamp(0px, 11.7361111111vw, 169px); }
.about-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 28.6805555556vw; gap: .4166666667vw; }
.about-cell {
  position: relative; display: flex; flex-direction: column; overflow: hidden; border-radius: 8px;
  padding: 2.2916666667vw 2.0833333333vw 2.0833333333vw;
  opacity: 0; transform: translateY(30px); transition: transform .8s, opacity .8s;
}
.about-cell.is-in { opacity: 1; transform: none; }
.about-cell--01 { grid-area: 1 / 1 / 3 / 3; padding: 0; }
.about-cell--02 { grid-area: 1 / 3 / 2 / 4; background: var(--g100); transition-delay: .2s; }
.about-cell--03 { grid-area: 2 / 4 / 3 / 5; background: var(--g200); }
.about-cell--04 { grid-area: 3 / 3 / 4 / 4; background: var(--g800); color: #fff; }
.about-cell--05 { grid-area: 3 / 4 / 4 / 5; padding: 0; transition-delay: .2s; }
.about-ttl {
  position: relative; padding-left: 16px; margin: 0 0 clamp(0px, 2.7777777778vw, 40px);
  font-size: calc((1440px - (1440px - var(--u)) / 1.6) / 1440 * 16); line-height: 1.8; letter-spacing: 0;
}
.about-ttl::before { content: ""; position: absolute; left: 0; top: .6em; width: 6px; height: 6px; border-radius: 2px; background: var(--blue); }
.about-num { align-self: flex-start; margin: 0 0 20px; }
.about-num .num { display: inline-block; margin-right: clamp(0px, .4166666667vw, 6px); font-size: calc(var(--u) / 1440 * 100); line-height: 1; letter-spacing: -.03em; }
.about-num .unit { display: inline-block; font-size: calc(var(--u) / 1440 * 18); line-height: 1.4; letter-spacing: 0; font-weight: 800; }
.about-num--row2 { display: table; }
.about-num--row2 .num, .about-num--row2 .unit { display: block; margin: 0; }
.about-num--row2 .unit { margin-top: -.64em; text-align: right; }
.about-txt { margin: auto 3.4722222222vw .625vw 0; font-size: calc((1440px - (1440px - var(--u)) / 2.6) / 1440 * 15); line-height: 1.6; letter-spacing: 0; }

.benefits { margin: 23px 4.1666666667vw clamp(0px, 11.7361111111vw, 169px); }
.benefits .ttl-jp { margin-bottom: clamp(0px, 5.625vw, 81px); }
.bnf { display: flex; width: 100%; margin: 0 0 .4166666667vw; overflow: hidden; }
.bnf:nth-of-type(2n) { flex-direction: row-reverse; }
.bnf-fig { position: relative; z-index: 1; display: flex; align-items: center; width: 49.77%; aspect-ratio: 657 / 850; overflow: hidden; border-radius: 8px; background: var(--g100); }
.bnf-bk {
  position: absolute; inset: 0; z-index: -1; opacity: 0;
  background: radial-gradient(circle at 30% 70%, #d4dcf0 0 38%, transparent 38.5%), radial-gradient(circle at 80% 20%, #cfd8ea 0 24%, transparent 24.5%), #dadfe8;
  transition: clip-path 1.6s cubic-bezier(.3, .7, .1, 1) .3s;
}
.bnf--01 .bnf-bk { clip-path: circle(0% at 10% 100%); bottom: -1px; }
.bnf--01 .bnf-fig.is-in .bnf-bk { clip-path: circle(84% at 10% 60%); }
.bnf--02 .bnf-bk { clip-path: circle(15% at 10% 10%); }
.bnf--02 .bnf-fig.is-in .bnf-bk { clip-path: circle(118% at 10% 10%); }
.bnf--03 .bnf-bk { clip-path: circle(0% at 0% 44%); }
.bnf--03 .bnf-fig.is-in .bnf-bk { clip-path: circle(89% at 0% 70%); }
.bnf-fig.is-in .bnf-bk { opacity: 1; }
.bnf-img { position: relative; width: 100%; height: 100%; }
.bnf-ui {
  position: absolute; left: 22%; right: 22%; top: 16%; bottom: 16%; width: auto; height: auto; border-radius: 16px;
  box-shadow: 0 12px 40px rgba(0,0,0,.08);
  transform: translateY(100px); opacity: 0; transition: transform 1s var(--ease02) 1s, opacity 1s 1s;
}
.bnf-fig.is-in .bnf-ui { transform: none; opacity: 1; }
.bnf-front, .bnf-front2 { position: absolute; inset: 0; opacity: 0; }
.bnf-front { transition: opacity .6s; }
.bnf-front2 { transition: opacity .6s .6s; }
.bnf-fig.is-in .bnf-front, .bnf-fig.is-in .bnf-front2 { opacity: 1; }
.bnf-chip { position: absolute; left: 10%; top: 30%; width: 34%; height: 18%; border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.bnf-chip--2 { left: auto; right: 9%; top: auto; bottom: 22%; width: 28%; height: 22%; }
.bnf-dtl { flex: 1; align-self: center; padding: clamp(0px, 7.3611111111vw, 106px) 0 clamp(0px, 6.9444444444vw, 100px) 8.6805555556vw; }
.bnf:nth-of-type(2n) .bnf-dtl { padding-left: 7.7777777778vw; }
.bnf-lbl { position: relative; padding-left: 16px; margin: 0 0 33px; font-size: 18px; line-height: .9; letter-spacing: -.02em; }
.bnf-lbl::before { content: ""; position: absolute; left: 0; top: .18em; width: 6px; height: 6px; border-radius: 2px; background: var(--blue); }
.bnf-ttl { margin: 0 0 55px; font-size: calc((1440px - (1440px - var(--u)) / 1.3) / 1440 * 46); line-height: 1.4; letter-spacing: 0; }
.bnf-dtl p { width: 26.3888888889vw; font-size: calc((1440px - (1440px - var(--u)) / 2) / 1440 * 18); line-height: 1.8; letter-spacing: 0; color: var(--g700); }

.solutions { margin: 0 4.1666666667vw clamp(0px, 11.8055555556vw, 170px); }
.sol {
  position: relative; display: flex; flex-wrap: wrap; min-height: 500px; margin: 0 0 120px; border-radius: 8px;
  padding: 7.1527777778vw 4.1666666667vw 6.9444444444vw;
}
.sol:last-child { margin-bottom: 0; }
.sol--01 { background: var(--g100); }
.sol--02 { background: var(--g200); }
.sol--03 { background: var(--g700); color: #fff; }
.sol--04 { background: var(--g800); color: var(--g50); }
.sol-head { flex: 1; }
.sol-lbl { position: relative; padding-left: 16px; margin: 0 0 clamp(18px, 3.125vw, 5vh); font-size: calc((1440px - (1440px - var(--u)) / 3) / 1440 * 16); line-height: 1.8; letter-spacing: 0; }
.sol-lbl::before { content: ""; position: absolute; left: 0; top: .55em; width: 6px; height: 6px; border-radius: 2px; background: var(--blue); }
.sol-ttl { font-size: clamp(30px, calc(var(--u) / 1440 * 60), 6.6666666667vh); line-height: 1.3; letter-spacing: 0; }
.sol-fig { display: flex; align-items: center; justify-content: center; width: 40.9722222222vw; height: 28.6111111111vw; margin: 5.2777777778vw 0 0; border-radius: 6px; background: #fff; }
.sol-txt {
  position: absolute; left: 4.1666666667vw; bottom: clamp(102px, 14.2361111111vw, 22.7777777778vh);
  width: clamp(0px, calc((100vw - 861px) / 579 * 173 + 300px), 473px);
  font-size: calc((1440px - (1440px - var(--u)) / 1.8) / 1440 * 18); line-height: 1.8; letter-spacing: 0; color: var(--g700);
}
.sol--03 .sol-txt, .sol--04 .sol-txt { color: inherit; opacity: .85; }
.sol-btn { position: absolute; left: 4.1666666667vw; bottom: clamp(50px, 6.9444444444vw, 11.1111111111vh); font-size: calc((1440px - (1440px - var(--u)) / 2) / 1440 * 16); line-height: 1.8; }
.sol-btn .icon-sq { margin-right: clamp(0px, 1.5277777778vw, 22px); }
.sol-btn .icon-sq.sp { display: none; }

.ico { position: relative; width: 13.8888888889vw; height: 13.8888888889vw; color: #111; }
.ico--dots { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6%; }
.ico--dots i { border-radius: 50%; background: currentColor; animation: dotPulse 2.4s ease-in-out infinite; animation-delay: var(--dl); }
@keyframes dotPulse { 0%, 100% { transform: scale(.25); } 50% { transform: scale(1); } }
.ico--bars { display: flex; align-items: center; justify-content: center; gap: 5%; }
.ico--bars i { width: 6%; height: 100%; border-radius: 6px; background: currentColor; animation: barWave 1.6s ease-in-out infinite; animation-delay: var(--dl); }
@keyframes barWave { 0%, 100% { transform: scaleY(.3); } 50% { transform: scaleY(1); } }
.ico--ring::before, .ico--ring::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 11px solid currentColor; }
.ico--ring::after { border-color: transparent; border-top-color: #fff; animation: spin 2.2s var(--ease02) infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.ico--circles::before, .ico--circles::after { content: ""; position: absolute; left: 20%; width: 60%; height: 60%; border-radius: 50%; background: currentColor; }
.ico--circles::before { top: 5%; animation: cTop 2.6s var(--ease02) infinite alternate; }
.ico--circles::after { bottom: 5%; background: transparent; border: 6px solid currentColor; animation: cBtm 2.6s var(--ease02) infinite alternate; }
@keyframes cTop { to { transform: translateY(18%); } }
@keyframes cBtm { to { transform: translateY(-18%); } }

.loop { margin: 0 0 170px; overflow: hidden; }
.loop-wrap { display: flex; will-change: transform; }
.loop-inr { display: flex; flex-shrink: 0; }
.loop-img { width: 43.0555555556vw; aspect-ratio: 620 / 400; margin: 0 3.4722222222vw; }
.loop-img .ph { border-radius: 6px; }

.svc { position: relative; z-index: 1; padding: clamp(0px, 11.6666666667vw, 168px) 0 clamp(0px, 11.8055555556vw, 170px); overflow: hidden; clip-path: inset(0); color: #fff; }
.svc-bk { position: absolute; inset: 0; z-index: -1; background: var(--g900); will-change: clip-path; }
.svc-ttlarea { margin: 0 0 clamp(0px, 9.4444444444vw, 136px); text-align: center; will-change: transform, opacity; }
.svc-ttlarea .ttl { margin-bottom: 0; }
.svc-ttlarea .ttl-jp { display: table; margin: 0 auto 40px; }
.svc-ttlarea-body { padding-top: clamp(0px, 3.6805555556vw, 5.8888888889vh); }
.svc-sbttl { font-size: calc((1440px - (1440px - var(--u)) / 2) / 1440 * 36); line-height: 1.55; letter-spacing: 0; }
.svc-ttlarea p { width: 29.5833333333vw; margin: 27px auto 0; font-size: calc((1440px - (1440px - var(--u)) / 4) / 1440 * 16); line-height: 1.8; letter-spacing: 0; color: var(--g50); }
.svc-cardarea { position: relative; margin: 0 4.1666666667vw; }
.svc-card {
  width: 41.9444444444vw; min-width: 320px; margin: 0 0 clamp(0px, 6.9444444444vw, 100px) auto;
  padding: 1.7361111111vw 1.7361111111vw 3.3333333333vw; border-radius: 8px; background: #fff; color: var(--g800);
}
.svc-card:nth-of-type(2n) { margin-left: 0; }
.svc-card-ttlwrap { position: relative; }
.svc-card-ttlsets { position: absolute; z-index: 10; top: 3.9583333333vw; left: 3.125vw; color: #fff; }
.svc-card-lbl { position: relative; padding-left: 16px; margin: 0 0 clamp(0px, 1.6666666667vw, 24px); font-size: 16px; line-height: .9; letter-spacing: -.02em; }
.svc-card-lbl::before { content: ""; position: absolute; left: 0; top: .092em; width: 6px; height: 6px; border-radius: 2px; background: var(--blue); }
.svc-card-ttl { font-size: calc(var(--u) / 1440 * 46); line-height: 1.2; letter-spacing: 0; }
.svc-card figure { height: 38.1944444444vw; margin: 0 0 clamp(0px, 2.9861111111vw, 43px); overflow: hidden; border-radius: 6px; }
.svc-card-btm { display: flex; flex-wrap: wrap; min-height: clamp(0px, 12.2222222222vw, 176px); }
.svc-card-txt { width: 18.0555555556vw; margin: 0 10px 0 1.7361111111vw; font-size: 16px; line-height: 1.7; letter-spacing: 0; color: var(--g700); }
.svc-card-pre { flex: 1; align-self: flex-end; padding-right: 1.7361111111vw; text-align: right; font-size: 11px; line-height: 1.6; letter-spacing: 0; }
.svc-card-pre .num { display: block; margin: 13px 2px 0 0; font-size: calc((1440px - (1440px - var(--u)) / 1.6) / 1440 * 60); line-height: 1; letter-spacing: -.03em; }
.svc-card-pre .unit { display: block; margin: -2px 7px 0 0; font-size: calc((1440px - (1440px - var(--u)) / 1.6) / 1440 * 16); line-height: 1.4; letter-spacing: 0; font-weight: 800; }

.cases { padding: clamp(0px, 10.4166666667vw, 150px) 0 clamp(0px, 8.1944444444vw, 118px); background: var(--g50); }
.cases .ttl-jp { margin-bottom: clamp(0px, 2.7777777778vw, 40px); }
.cases-inr { margin: 0 0 0 4.1666666667vw; overflow: hidden; }
.cases-slider { position: relative; margin: 0 0 clamp(0px, 7.0138888889vw, 101px); overflow: visible; }
.cases-count.swiper-pagination-fraction { position: absolute; top: -86px; right: 219px; left: auto; bottom: auto; width: auto; font-size: 14px; line-height: 1; letter-spacing: 0; }
.cases-nav { position: absolute; top: -110px; z-index: 2; width: 60px; height: 60px; border-radius: 4px; background: var(--g800); color: #fff; transition: background-color .3s; }
.cases-nav--next { right: 4.1666666667vw; }
.cases-nav--prev { right: calc(4.1666666667vw + 68px); }
.cases-nav--prev .arw-h { transform: translate(-50%, -50%) scaleX(-1); }
.cases-nav.is-off { background: transparent; color: var(--g200); box-shadow: inset 0 0 0 1px var(--g200); }
.cases-nav:hover { background: rgba(34,34,34,.9); color: #fff; box-shadow: none; }
.case { height: auto; font-weight: 800; }
.case a { display: flex; flex-direction: column; height: 100%; margin-right: 2.7777777778vw; padding: clamp(0px, .9722222222vw, 14px) .9722222222vw clamp(0px, 3.4027777778vw, 49px); border-radius: 6px; background: #fff; }
.case-fig { position: relative; z-index: 1; aspect-ratio: 456 / 296; margin: 0 0 clamp(0px, 2.9861111111vw, 43px); overflow: hidden; border-radius: 4px; transition: transform .8s var(--ease02); will-change: transform; }
.case-fig .ph { transition: transform .8s var(--ease02); }
.case a:hover .case-fig { transform: rotate(.005deg) scale(.97); }
.case a:hover .case-fig .ph { transform: scale(1.05); }
.case-ttl { width: 28.0555555556vw; margin: 0 0 6.4583333333vw 1.8055555556vw; font-size: calc((1440px - (1440px - var(--u)) / 2.2) / 1440 * 26); line-height: 1.5; letter-spacing: 0; transition: opacity .4s; }
.case-company { display: flex; align-items: center; margin: auto 0 0 1.8055555556vw; transition: opacity .4s; }
.case a:hover .case-ttl, .case a:hover .case-company { opacity: .7; }
.case-logo { flex: none; width: 80px; height: 30px; margin-right: clamp(0px, 2.1527777778vw, 31px); border-radius: 2px; }
.case-company .txt { flex: 1; font-size: calc((1440px - (1440px - var(--u)) / 2) / 1440 * 15); line-height: 1.4; letter-spacing: 0; }
.case-company .unit { margin-left: 6px; font-size: 10px; }
.cases-logo { width: 84.7222222222vw; height: auto; aspect-ratio: 1220 / 202; margin: 0 0 clamp(0px, 8.1944444444vw, 118px) 3.75vw; border-radius: 6px; }
.cases > .sec-btn { margin-top: clamp(-18px, -1.25vw, 0px); margin-right: 4.1666666667vw; }

.news { padding: clamp(0px, .6944444444vw, 10px) 4.1666666667vw clamp(0px, 11.8055555556vw, 170px); background: var(--g50); }
.news .ttl { margin-bottom: 47px; }
.news .ttl-jp { margin-bottom: clamp(0px, 2.1527777778vw, 31px); }
.news-list { margin: 0 0 0 31.0416666667vw; border-top: 1px solid var(--g200); }
.news-item { border-bottom: 1px solid var(--g200); }
.news-item a {
  position: relative; display: flex; align-items: center; width: 100%; min-height: clamp(0px, 12.0833333333vw, 174px);
  padding: clamp(0px, 2.7777777778vw, 40px) clamp(0px, 6.3888888889vw, 92px) clamp(0px, 2.7083333333vw, 39px) 0;
  color: var(--g800); font-size: calc((1440px - (1440px - var(--u)) / 4) / 1440 * 18); line-height: 1.5; letter-spacing: 0;
}
.news-item a p { transition: opacity .4s; }
.news-item a:hover p { opacity: .7; }
.news-thumb { flex: none; width: clamp(90px, 8.3333333333vw, 120px); aspect-ratio: 120 / 68; margin-right: clamp(0px, 4.1666666667vw, 60px); overflow: hidden; border-radius: 4px; transition: transform .8s var(--ease02); }
.news-thumb .ph { transition: transform .8s var(--ease02); }
.news-item a:hover .news-thumb { transform: rotate(.005deg) scale(.94); }
.news-item a:hover .news-thumb .ph { transform: scale(1.1); }
.news-dtl { flex: 1; }
.news-dtl .time { margin: 20px 0 0; font: 500 15px/1.5 var(--en); letter-spacing: 0; color: var(--g500); }
.news-arw { top: calc(50% - 4px); left: auto; right: 10px; width: 12px; height: 8px; transform: none; color: var(--g800); }
.sec-btn--news { margin-top: 50px; }

.dl { position: relative; z-index: 1; padding: 6.9444444444vw 0; background: var(--g50); }
.dl-bk { position: absolute; inset: 0; z-index: -1; overflow: hidden; background: var(--g900); will-change: transform, clip-path; }
.dl-bk-inr { position: absolute; top: 0; left: 50%; width: 107vw; transform: scale(1.15) rotate(-15deg) translate(-29.5%, 4.7%); transform-origin: center bottom; }
.dl-collage { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1.6vw; opacity: .14; transform: translateY(-30%); }
.dl-collage > div { aspect-ratio: 3 / 4; border-radius: 8px; background: #fff; }
.dl-inr {
  width: 30.8333333333vw; min-width: 444px; margin: 0 auto; text-align: center;
  padding: clamp(0px, 5.6944444444vw, 82px) 5.5555555556vw clamp(0px, 5.5555555556vw, 80px); border-radius: 6px; background: #fff;
}
.dl-en { position: relative; display: table; margin: 0 auto 24px; padding-left: 16px; font-size: 14px; line-height: .9; letter-spacing: -.04em; }
.dl-en::before { content: ""; position: absolute; left: 0; top: .05em; width: 6px; height: 6px; border-radius: 1px; background: var(--blue); }
.dl-ttl { margin: 0 0 28px; font-size: calc((1440px - (1440px - var(--u)) / 1.6) / 1440 * 44); line-height: 1.3; letter-spacing: 0; }
.dl-inr p { width: 16.9444444444vw; min-width: 244px; margin: 0 auto 44px; font-size: 15px; line-height: 1.8; letter-spacing: 0; color: var(--g700); }
.dl-btn { width: 284px; margin: 0 auto; }

.ft { position: relative; z-index: 3; display: flex; flex-direction: row-reverse; padding: .4166666667vw 9.4444444444vw 2.0833333333vw 2.0833333333vw; color: #fff; background: var(--g50); }
.ft-copy { position: relative; width: 47.7083333333vw; margin: 0 .4166666667vw 0 0; padding: clamp(0px, 4.5833333333vw, 66px) 4.1666666667vw clamp(0px, 3.8888888889vw, 56px); border-radius: 8px; background: var(--g800); }
.ft-copy-txt { display: block; font-size: calc((1440px - (1440px - var(--u)) / 1.6) / 1440 * 46); line-height: 1.3; letter-spacing: 0; }
.ft-copy-txt01 { margin-bottom: clamp(-19px, -1.3194444444vw, 0px); }
.ft-row { display: inline-block; overflow: hidden; clip-path: inset(0); }
.ft-in { display: inline-block; transform: translateY(100%); transition: transform 1.4s cubic-bezier(.3, 1, .3, 1); }
.ft-copy.is-in .ft-in { transform: none; }
.ft-logo { position: absolute; left: 4.1666666667vw; bottom: 4.1666666667vw; width: clamp(0px, 13.0555555556vw, 188px); color: #fff; }
.ft-logo svg { display: block; width: 100%; height: auto; fill: currentColor; }
.ft-logo text { font: 600 22px/1 var(--en); letter-spacing: -.02em; }
.ft-cr { position: absolute; right: 4.2361111111vw; bottom: 4.0277777778vw; font-size: calc((1440px - (1440px - var(--u)) / 2) / 1440 * 12); line-height: 1.1; letter-spacing: -.02em; color: #7e7e7e; }
.ft-nav { display: flex; flex-wrap: wrap; width: 40.3472222222vw; padding: clamp(0px, 4.6527777778vw, 67px) 4.1666666667vw clamp(0px, 3.6805555556vw, 53px); border-radius: 8px; background: var(--g700); font-size: calc((1440px - (1440px - var(--u)) / 4) / 1440 * 14); line-height: 1.2; letter-spacing: 0; }
.ft-nav a { color: #fff; transition: opacity .4s; }
.ft-nav a:hover { opacity: .7; }
.ft-nav-a { width: 15.2777777778vw; padding-right: 14px; }
.ft-nav-a li, .ft-nav-b li { margin: 0 0 14px; }
.ft-nav-b { flex: 1; }
.ft-nav-b ul { margin: 0 0 clamp(0px, 4.0277777778vw, 58px); }
.ft-nav-c { width: 100%; margin: clamp(0px, 14.6527777778vw, 211px) 0 0; font-size: calc((1440px - (1440px - var(--u)) / 4) / 1440 * 12); line-height: 1.8; letter-spacing: 0; }
.ft-nav-c li { margin: 0 0 3px; }
.ft-totop { position: absolute; top: .4166666667vw; bottom: 2.0833333333vw; right: 2.0833333333vw; width: 6.9444444444vw; border-radius: 8px; background: var(--g700); transition: background-color .3s; }
.ft-totop:hover { background: var(--g800); }
.ft-totop button { position: relative; display: block; width: 100%; height: 100%; color: #fff; }

@media (max-width: 720px) {
  .sp { display: inline; }
  .hr { margin: 0 5.3333333333vw; }
  .ttl { margin: 0 0 23px; }
  .ttl-jp { margin: 0 0 45px; font-size: 15px; }
  .ttl-jp::before { top: .27em; }
  .ttl-en { font-size: 62px; }
  .sec-btn .icon-sq { width: 50px; height: 50px; margin-left: 16px; }
  .sec-btn { font-size: 15px; }

  .about { margin: clamp(0px, 5.8666666667vw, 22px) 5.3333333333vw clamp(0px, 21.0666666667vw, 79px); }
  .about-grid { display: block; }
  .about-cell { min-height: clamp(0px, 93.0666666667vw, 349px); margin: 0 0 1.6vw; padding: 8.5333333333vw 5.6vw 8vw; border-radius: 1.0666666667vw; }
  .about-cell--01 { padding: 0; height: 112.8205128205vw; }
  .about-cell--05 { display: none; }
  .about-ttl { margin: 0 0 33px; padding-left: 15px; font-size: 15px; }
  .about-ttl::before { top: .55em; }
  .about-num .num { margin: -3px 7px 0 0; font-size: 90px; }
  .about-num .unit { font-size: 16px; }
  .about-num--row2 { display: block; }
  .about-num--row2 .num, .about-num--row2 .unit { display: inline-block; }
  .about-num--row2 .num { margin: -3px 7px 0 0; }
  .about-num--row2 .unit { margin-top: 0; text-align: left; }
  .about-txt { width: 58.6666666667vw; margin: auto 0 1.8666666667vw; font-size: 15px; }

  .benefits { margin: 22px 5.3333333333vw clamp(0px, 20.5333333333vw, 77px); }
  .benefits .ttl-jp { margin-bottom: 45px; }
  .bnf { display: block; width: auto; margin: 0 0 14.9333333333vw; }
  .bnf-fig { width: auto; margin: 0 0 32px; border-radius: 1.0666666667vw; }
  .bnf-ui { transition: transform 1s var(--ease02) .4s, opacity 1s .4s; }
  .bnf-dtl, .bnf:nth-of-type(2n) .bnf-dtl { padding: 0 0 0 5.3333333333vw; }
  .bnf-lbl { margin: 0 0 21px; font-size: 16px; }
  .bnf-ttl { margin: 0 0 30px; font-size: 30px; }
  .bnf-dtl p { width: auto; margin: 0 9.8666666667vw 0 0; font-size: 16px; line-height: 1.7; }

  .solutions { margin: 0 5.3333333333vw clamp(0px, 18.6666666667vw, 70px); }
  .solutions .ttl { margin-bottom: 23px; }
  .solutions .ttl-jp { margin: 22px 0 45px; }
  .sol { display: block; min-height: auto; margin: 0 0 2.6666666667vw; padding: 10.9333333333vw 5.3333333333vw 10.6666666667vw; border-radius: 1.0666666667vw; }
  .sol-lbl { margin: 0 0 22px; font-size: 15px; }
  .sol-ttl { margin: 0 0 25px; font-size: 36px; }
  .sol-fig { width: calc(100% + 20px); height: 53.3333333333vw; margin: 0 -10px 33px; border-radius: .5333333333vw; }
  .ico { width: 24vw; height: 24vw; }
  .sol-txt { position: static; width: auto; margin: 0 0 31px; font-size: 16px; line-height: 1.7; }
  .sol-btn { position: static; display: flex; width: max-content; margin: 0 0 0 auto; font-size: 15px; }
  .sol-btn .icon-sq { display: none; }
  .sol-btn .icon-sq.sp { display: block; width: 50px; height: 50px; margin: -4px 0 0 16px; }

  .loop { margin: 0 0 clamp(0px, 18.4vw, 69px); }
  .loop-img { width: 62.4vw; margin: 0 1.3333333333vw; }
  .loop-img .ph { border-radius: 1.0666666667vw; }

  .svc { padding: clamp(0px, 21.8666666667vw, 82px) 5.3333333333vw clamp(0px, 21.0666666667vw, 79px); }
  .svc-bk { border-radius: 1.6vw; }
  .svc-ttlarea { margin: 0 0 7.7333333333vw; }
  .svc-ttlarea .ttl-jp { margin: 0 auto 26px; }
  .svc-sbttl { font-size: 22px; }
  .svc-ttlarea p { width: auto; font-size: 15px; line-height: 1.7; }
  .svc-cardarea { margin: 0; }
  .svc-card, .svc-card:nth-of-type(2n) { width: auto; min-width: 0; margin: 0 0 4vw; padding: 2.6666666667vw 2.6666666667vw 8vw; }
  .svc-card figure { height: 80vw; }
  .svc-card-ttlsets { top: 8vw; left: 6.4vw; }
  .svc-card-lbl { margin: 0 0 18px; }
  .svc-card-ttl { font-size: 30px; }
  .svc-card-btm { display: block; min-height: 0; }
  .svc-card-txt { width: auto; margin: 0 4vw; font-size: 15px; }
  .svc-card-pre { margin: 30px 0 0; padding: 0 0 0 17px; text-align: left; font-size: 12px; }
  .svc-card-pre .num { display: inline-block; margin: 9px 7px 0 0; font-size: 50px; }
  .svc-card-pre .unit { display: inline; font-size: 14px; }
  .svc .sec-btn { margin-top: clamp(0px, 16vw, 60px); }

  .cases { padding: clamp(0px, 21.8666666667vw, 82px) 0 clamp(0px, 18.6666666667vw, 70px); }
  .cases .ttl-jp { margin-bottom: 26px; }
  .cases-inr { margin: 0 0 0 5.3333333333vw; }
  .cases-slider { margin: 22px 0 clamp(0px, 13.3333333333vw, 50px); }
  .cases .ttl { margin-bottom: 26px; }
  .cases-count.swiper-pagination-fraction { top: -40px; right: auto; left: 0; }
  .cases-nav { top: -58px; width: 50px; height: 50px; }
  .cases-nav--next { right: 5.3333333333vw; }
  .cases-nav--prev { right: calc(5.3333333333vw + 58px); }
  .case a { margin-right: 2.6666666667vw; padding: 2.6666666667vw 2.6666666667vw clamp(0px, 8.8vw, 33px); }
  .case-ttl { width: auto; margin: 0 4.8vw 8vw; font-size: 18px; }
  .case-company { margin: auto 0 0 4.8vw; }
  .case-company .txt { font-size: 14px; }
  .cases-logo { width: 76.5333333333vw; margin: 0 0 clamp(0px, 12.8vw, 48px) 6.4vw; }
  .cases > .sec-btn { margin-top: clamp(0px, .5333333333vw, 2px); margin-right: 5.3333333333vw; }

  .news { padding: 0 5.3333333333vw clamp(0px, 21.3333333333vw, 80px); }
  .news .ttl { margin-bottom: 0; }
  .news .ttl-jp { margin-bottom: 20px; }
  .news-list { margin: 26px 0 0; }
  .news-item a { align-items: flex-start; min-height: 0; padding: clamp(0px, 6.9333333333vw, 26px) 0 clamp(0px, 6.4vw, 24px); font-size: 15px; }
  .news-arw { display: none; }
  .news-dtl .time { margin: 13px 0 0; font-size: 14px; }
  .news-thumb { width: 21.3333333333vw; aspect-ratio: 80 / 52; margin: 0 6.6666666667vw 0 0; border-radius: .5333333333vw; }

  .dl { padding: 16vw 2.4154589372% 16.8vw; }
  .dl-bk-inr { width: 244vw; transform: rotate(-15deg) translate(-32.5%, -35%); }
  .dl-collage { transform: translateY(30%); }
  .dl-inr { width: 78.6666666667vw; min-width: 0; padding: 11.7333333333vw 0 10.9333333333vw; border-radius: .5333333333vw; }
  .dl-en { display: none; }
  .dl-ttl { margin: 0 10.1333333333vw 17px 9.8666666667vw; font-size: 26px; }
  .dl-inr p { width: auto; min-width: 0; margin: 0 10.1333333333vw 20px 9.8666666667vw; font-size: 14px; line-height: 1.7; }
  .dl-btn { width: 220px; }
  .dl-btn .cta--lg { height: 46px; font-size: 13px; }
  .dl-btn .cta--lg .cta-r { width: 46px; }

  .ft { display: block; padding: .5333333333vw 2.6666666667% 2.6666666667vw; }
  .ft-copy { width: auto; margin: .5333333333vw 0 0; padding: 8.8vw 8vw; border-radius: 1.0666666667vw; }
  .ft-copy-txt { font-size: 26px; }
  .ft-copy-txt01 { margin-bottom: -.4em; }
  .ft-cr { right: 8vw; bottom: 8vw; font-size: 10px; }
  .ft-logo { position: static; display: block; width: 28.5333333333vw; margin: clamp(0px, 22.9333333333vw, 86px) 0 0; }
  .ft-nav { width: auto; padding: 12.5333333333vw 5.3333333333vw 9.0666666667vw 8vw; border-radius: 1.0666666667vw; font-size: 14px; }
  .ft-nav-a { width: 44.5333333333vw; }
  .ft-nav-b ul { margin: 0 0 49px; }
  .ft-nav-c { margin: clamp(0px, 17.0666666667vw, 64px) 0 0; font-size: 12px; line-height: 1.2; }
  .ft-nav-c li { margin: 0 0 9px; }
  .ft-totop { display: none; }
}

@media (max-width: 580px) {
  .svc-ttlarea p { width: 78.6666666667vw; margin: 20px auto 0; }
  .svc-ttlarea-body { padding-top: 25px; }
  .svc-card, .svc-card:nth-of-type(2n) { margin: 0 0 2.6666666667vw; padding: 3.2vw 3.2vw 10.4vw; border-radius: 1.0666666667vw; }
  .svc-card figure { height: 93.3333333333vw; margin: 0 0 33px; border-radius: .8vw; }
  .svc-card-ttlsets { top: 8.5333333333vw; left: 5.3333333333vw; }
  .svc-card-ttl { margin: 0 0 28px; font-size: 32px; }
  .svc-card-txt { width: 73.3333333333vw; margin: 0 auto; }
  .svc-card-pre br.br { display: none; }
  .case-fig { aspect-ratio: 315 / 204; margin: 0 0 clamp(0px, 8.8vw, 33px); border-radius: .8vw; }
  .case-ttl { margin: 0 2.6666666667vw clamp(0px, 19.7333333333vw, 74px); font-size: 20px; }
  .case-logo { margin-right: clamp(0px, 7.2vw, 27px); }
  .dl-bk { left: 2.6666666667vw; right: 2.6666666667vw; border-radius: 1.0666666667vw; }
  .cases-logo { aspect-ratio: 298 / 287; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .hr { transform: none; }
  .about-cell, .bnf-ui, .bnf-front, .bnf-front2, .bnf-bk { opacity: 1; transform: none; }
  .bnf-bk { clip-path: none !important; }
  .ft-in { transform: none; }
}
