@charset "utf-8";

:root {
  --lx-ink: #000;
  --lx-paper: #fff;
  --lx-divider: rgba(0, 0, 0, 0.08);
  --lx-shadow: none;   
  --lx-shadow-none: 0 8px 40px rgba(0, 0, 0, 0);
  --lx-handle: #d3d4d9;
  --lx-header-h: 96px;          
  --lx-btn-h-outer: 52px;    
  --lx-btn-h-inner: 40px;     
  --lx-sukima: calc((var(--lx-btn-h-outer) - var(--lx-btn-h-inner)) / 2);
  --lx-open-w: 123px;           
  --easing-1: cubic-bezier(0.18, 0.06, 0.23, 1);
  --easing-3: cubic-bezier(0.47, 0.16, 0.24, 1);
  --lx-font-ja: var(--font-ja);
  --lx-font-en: "Roboto", var(--font-ja);
}
.lxh { position: relative; z-index: 400; }
.lxh a { text-decoration: none; color: inherit; }
.lxh button { font: inherit; letter-spacing: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
.lxh svg { display: block; }
.lxh .lx-label-m { font-family: var(--lx-font-ja); font-weight: 700; font-size: 12px; letter-spacing: 0.02em; line-height: 1.4; font-feature-settings: "palt"; }
.lxh .lx-label-l { font-family: var(--lx-font-ja); font-weight: 700; font-size: 14px; letter-spacing: 0.02em; line-height: 1.4; font-feature-settings: "palt"; }
.lxh .lx-label-xl { font-family: var(--lx-font-ja); font-weight: 700; font-size: 20px; letter-spacing: 0.02em; line-height: 1.4; font-feature-settings: "palt"; }
.lxh .lx-label-s { font-family: var(--lx-font-ja); font-weight: 700; font-size: 11px; letter-spacing: 0.02em; line-height: 1.4; }
.lxh .lx-en-m { font-family: var(--lx-font-en); font-weight: 700; font-size: 16px; line-height: 1.2; }
.lxh .lx-en-s { font-family: var(--lx-font-en); font-weight: 700; font-size: 12px; line-height: 1.2; }
@media (min-width: 768px) {
  .lxh .lx-label-m { font-size: 14px; }
  .lxh .lx-label-l { font-size: 16px; }
  .lxh .lx-label-s { font-size: 12px; }
  .lxh .lx-en-m { font-size: 24px; }
  .lxh .lx-en-s { font-size: 14px; }
}

.lx-arrow { --d: 20px; --bw: 1px; --enshuu: calc((var(--d) - var(--bw) * 2) * 3.14); position: relative; width: 20px; height: 20px; margin-left: 10px; flex-shrink: 0; }
.lx-arrow svg { position: absolute; inset: 0; margin: auto; width: 100%; height: 100%; overflow: visible; }
.lx-arrow__back { opacity: 0.12; color: var(--lx-ink); transform: scale(1); transition: all 0.5s var(--easing-1); }
.lx-arrow__front { color: var(--lx-ink); transform: rotate(-90deg) scale(1.08); transform-origin: center; }
.lx-arrow__front circle { stroke-dasharray: 0 var(--enshuu); transition: stroke-dasharray 0.7s var(--easing-3); }
.lx-arrow .lx-arrow__arrow { width: 6px; height: 6px; margin: 7px; color: var(--lx-ink); }
@media (hover: hover) {
  a:hover > .lx-arrow .lx-arrow__back { stroke-dasharray: var(--enshuu) var(--enshuu); opacity: 0; transform: scale(1.08); transition: all 1.2s var(--easing-1); }
  a:hover > .lx-arrow .lx-arrow__front circle { stroke-dasharray: var(--enshuu) var(--enshuu); transition: stroke-dasharray 0.3s var(--easing-3); }
}
.lx-arrow.lx-arrow--ext .lx-arrow__arrow { width: 8.3px; height: 6.7px; margin: 6.65px 5.85px; }
@media (max-width: 767px) {
  .lx-arrow { --d: 16px; width: 16px; height: 16px; }
  .lx-arrow .lx-arrow__arrow { margin: 5px; }
  .lx-arrow.lx-arrow--ext .lx-arrow__arrow { width: 6.7px; height: 5.3px; margin: 5.35px 4.65px; }
}

.lxh-pc { display: none; }
.lxh-open { display: none; }
.lxh-fixed-jobs { display: none; }
@media (min-width: 768px) {
  .lxh-sp { display: none; }
  .lxh-pc {
    display: grid; grid-template-columns: repeat(28, 1fr); position: fixed; top: 0; left: 0; width: 100%;
    opacity: 0; transition: opacity 0.1s var(--easing-1) 0.4s; pointer-events: none;
  }
  .lxh-pc.is-show { opacity: 1; transition: opacity 0.01s var(--easing-1) 0s; pointer-events: auto; }
  .lxh-pc__row { grid-column: 2 / -2; display: flex; justify-content: space-between; align-items: center; height: var(--lx-header-h); z-index: 1; }
  .lxh-pc__left { width: 100%; }
  .lxh-pc__nav { display: flex; align-items: center; }
  
  .lxh-pc__hover-line { position: absolute; top: 0; left: 0; width: 0; height: 3px; background: var(--lx-ink); transition: left 0.6s var(--easing-3), width 0.6s var(--easing-3), opacity 0.1s var(--easing-1); }
  .lxh-pc.open-anime-start .lxh-pc__hover-line { opacity: 1; transition: left 0.6s var(--easing-3), width 0.6s var(--easing-3), opacity 0.3s var(--easing-1) 0.8s; }
  .lxh-pc.close-anime-start .lxh-pc__hover-line { opacity: 0; transition: opacity 0.3s var(--easing-1); }
  .lxh-pc__logo { display: block; padding: 15px 0; transition: opacity 0.3s var(--easing-1) 0.1s; }
  .lxh-pc.close-anime-start .lxh-pc__logo { opacity: 0; transition: opacity 0.15s var(--easing-1); }
  .lxh-pc__logo img, .lxh-pc__logo .lg { display: block; width: 110px; height: auto; transform-origin: 50% 50%; }
  
  .lxh-pc__logo.is-bump img, .lxh-sp__logo.is-bump img { animation: lxLogoBump 0.55s cubic-bezier(0.34, 1.56, 0.64, 1); }
  @keyframes lxLogoBump { 0% { transform: scale(1) rotate(0); } 30% { transform: scale(0.88) rotate(-6deg); } 65% { transform: scale(1.08) rotate(3deg); } 100% { transform: scale(1) rotate(0); } }
  .lxh-pc__list { display: flex; align-items: center; height: var(--lx-header-h); margin-left: 28px; }
  .lxh-pc__list > li { flex-shrink: 0; margin: 0 12px; height: 100%; }
  .lxh-pc__link { display: flex; align-items: center; height: 100%; color: var(--lx-ink); }
  .lxh-pc__link > span { padding-top: 6px; }
  .lxh-pc__link--popup { cursor: default; }
  .lxh-pc__chev { width: 9px; height: 5px; margin-left: 8px; flex-shrink: 0; }
  .lxh-pc.close-anime-start .lxh-pc__list > li { opacity: 0; transform: translate3d(-30px, 0, 0) scale(0.82) !important; transition: opacity 0.3s var(--easing-1), transform 0.5s var(--easing-3) !important; }
  .lxh-pc.open-anime-start .lxh-pc__list > li { opacity: 1; transform: translateZ(0) scale(1); transition: opacity 0.5s var(--easing-1), transform 0.5s var(--easing-3); }
  
  .lxh-pc.open-anime-start .lxh-pc__list > li:nth-child(1) { transition-delay: 0.13s; }
  .lxh-pc.open-anime-start .lxh-pc__list > li:nth-child(2) { transition-delay: 0.17s; }
  .lxh-pc.open-anime-start .lxh-pc__list > li:nth-child(3) { transition-delay: 0.21s; }
  .lxh-pc.open-anime-start .lxh-pc__list > li:nth-child(4) { transition-delay: 0.25s; }
  .lxh-pc.open-anime-start .lxh-pc__list > li:nth-child(5) { transition-delay: 0.29s; }
  .lxh-pc.close-anime-start .lxh-pc__list > li:nth-child(1) { transition-delay: 0.03s !important; }
  .lxh-pc.close-anime-start .lxh-pc__list > li:nth-child(2) { transition-delay: 0.05s !important; }
  .lxh-pc.close-anime-start .lxh-pc__list > li:nth-child(3) { transition-delay: 0.07s !important; }
  .lxh-pc.close-anime-start .lxh-pc__list > li:nth-child(4) { transition-delay: 0.09s !important; }
  .lxh-pc.close-anime-start .lxh-pc__list > li:nth-child(5) { transition-delay: 0.11s !important; }
  
  .lxh-pc__popup { position: absolute; left: 0; top: 68px; width: 100%; pointer-events: none; }
  .lxh-pc__popup-box { position: relative; margin-top: 28px; color: var(--lx-ink); opacity: 0; transition: opacity 0.3s var(--easing-1); }
  .lxh-pc__popup[aria-hidden="false"] { pointer-events: auto; }
  .lxh-pc__popup[aria-hidden="false"] .lxh-pc__popup-box { opacity: 1; transform: translateZ(0); transition-duration: 0.5s; }
  .lxh-pc__popup-divider { position: absolute; top: 4px; width: 100%; height: 1px; border-bottom: 1px solid var(--lx-divider); z-index: 1; }
  .lxh-pc__popup-shadow { position: absolute; bottom: 0; height: 30px; width: 100%; border-radius: 0 0 12px 12px; background: var(--lx-paper); box-shadow: var(--lx-shadow); }
  .lxh-pc__popup-bg { position: absolute; top: 0; height: 100%; width: 100%; border-radius: 0 0 12px 12px; background: var(--lx-paper); }
  .lxh-pc__popup-body { position: relative; z-index: 1; padding: 36px 0 54px; padding-left: var(--lx-popup-left, calc(100% / 28 + 110px + 28px + 12px)); }
  .lxh-pc__popup-link { display: flex; align-items: center; padding: 5.3px 0; }
  
  .lxh-pc__jobs { position: relative; z-index: 1; display: none; }
  @media (min-width: 965px) { .lxh-pc__jobs { display: block; } }
  .lxh-pc.close-anime-start .lxh-pc__jobs { opacity: 0; transform: translate3d(-60px, 0, 0) scale(0.82); transition: opacity 0.3s var(--easing-1), transform 0.5s var(--easing-3); }
  .lxh-pc.open-anime-start .lxh-pc__jobs { opacity: 1; transform: translateZ(0) scale(1); transition: opacity 0.5s var(--easing-1) 0.4s, transform 0.3s var(--easing-3) 0.4s; }
  .lxh .lx-pill { display: inline-flex; align-items: center; justify-content: space-between; width: auto; min-width: 170px;    height: var(--lx-btn-h-outer); position: relative; background: none; color: var(--lx-paper); border-radius: 9999px; box-shadow: var(--lx-shadow); transition: color 0.3s; }
  
  .lxh .lx-pill::before { content: ""; position: absolute; inset: 0; background: var(--lx-ink); border-radius: 9999px; transition: opacity 0.8s cubic-bezier(0.39, 0.575, 0.565, 1) 0.1s; }
  .lxh .lx-pill > span { position: relative; z-index: 2; }
  .lxh .lx-pill .lx-pill__line { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
  .lxh .lx-pill .lx-pill__line rect { width: calc(100% - 2px); height: calc(100% - 2px); fill: none; stroke: #000; stroke-width: 1; stroke-dasharray: 0, 100; stroke-dashoffset: 100; transition: all 1s cubic-bezier(0, 0.7, 0, 1); }
  .lxh .lx-pill:hover { color: #000; }
  .lxh .lx-pill:hover::before { opacity: 0; transition-duration: 0.2s; transition-delay: 0s; }
  .lxh .lx-pill:hover .lx-pill__line rect { stroke-width: 2; stroke-dasharray: 100, 0; stroke-dashoffset: 0; }
  .lxh .lx-pill:hover .lx-pill__ja { border-color: rgba(0, 0, 0, 0.25); }
  .lx-pill__en { margin-left: 20px; }
  .lx-pill__ja { position: relative; display: flex; white-space: nowrap; align-items: center; justify-content: center; height: var(--lx-btn-h-inner); margin: 0 var(--lx-sukima) 0 14px; padding: 0 14px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 9999px; transition: border-color 0.3s; }
  
  .lxh-pc__bg { position: absolute; left: 0; top: 0; bottom: 0; margin: auto 0; height: var(--lx-header-h); width: 100vw; background: var(--lx-paper); transform: translate3d(2.2vw, 0, 0) scale(1); transition: transform 0.5s var(--easing-3); }
  .lxh-pc.is-show:not(.bg-none) .lxh-pc__bg { border-radius: 0; box-shadow: var(--lx-shadow-none); height: var(--lx-header-h); transform: translateZ(0) scale(1); width: 100vw; }
  .lxh-pc.is-show.bg-none .lxh-pc__bg { opacity: 0 !important; }
  .lxh-pc.close-anime-start .lxh-pc__bg { animation: lx-radius-close 0.5s forwards; }
  .lxh-pc.open-anime-start .lxh-pc__bg { animation: lx-radius-open 0.8s var(--easing-1) forwards; transform: translate3d(2.2vw, 0, 0) scale(1.08); }
  .lxh-pc.open-anime-start.bg-none .lxh-pc__bg { opacity: 0 !important; }
  .lxh-pc__popupbg { position: absolute; left: 0; top: 0; bottom: 0; margin: auto 0; height: 100%; width: 100%; background: var(--lx-paper); opacity: 0; transition: opacity 0.3s var(--easing-1); }
  .lxh-pc.popup-open .lxh-pc__popupbg { opacity: 1; transition-duration: 0.4s; }
  @keyframes lx-radius-open {
    0% { border-radius: 9999px; box-shadow: var(--lx-shadow); height: var(--lx-btn-h-outer); width: var(--lx-open-w); }
    40% { border-radius: calc(var(--lx-header-h) / 2); }
    100% { border-radius: 0; box-shadow: var(--lx-shadow-none); height: var(--lx-header-h); width: 100vw; }
  }
  @keyframes lx-radius-close {
    0% { border-radius: 0; box-shadow: var(--lx-shadow-none); height: var(--lx-header-h); width: 100vw; }
    40% { border-radius: calc(var(--lx-header-h) / 2); }
    100% { border-radius: 9999px; box-shadow: var(--lx-shadow); height: var(--lx-btn-h-outer); width: var(--lx-open-w); }
  }
  
  .lxh .lxh-open {
    display: inline-flex; align-items: center; justify-content: space-between; position: fixed; top: 22px; left: calc(100% / 28); margin-left: -1.4vw; z-index: 300;
    height: var(--lx-btn-h-outer); background: var(--lx-paper); border-radius: 9999px; box-shadow: var(--lx-shadow);
    opacity: 0; pointer-events: none; transition: opacity 0.1s var(--easing-1);
  }
  .lxh .lxh-open.is-show { opacity: 1; pointer-events: auto; transition: opacity 0.3s var(--easing-1); }
  .lxh .lxh-open.is-show:hover { opacity: 0.4; transition-duration: 0.2s; }
  .lxh-open__mark { width: 32px; height: 28px; margin-left: 20px; }
  .lxh-open__mark img { width: 100%; height: 100%; object-fit: contain; display: block; }
  .lxh-open__label { margin: 4px 20px 0 12px; text-transform: capitalize; }
  
  .lxh-fixed-jobs { display: flex; position: fixed; top: 22px; right: calc(100% / 28); z-index: 200; margin-right: 20px; opacity: 0; pointer-events: none; transition: opacity 0.3s var(--easing-1); }
  .lxh-fixed-jobs.is-show { opacity: 1; pointer-events: auto; }
}

@media (max-width: 767px) {
  .lxh-sp__bar { position: fixed; top: 0; width: 100%; z-index: 1; }
  .lx-container { box-sizing: content-box; max-width: 100%; margin: 0 auto; padding: 0 20px; }
  .lxh-sp__row { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; }
  .lxh-sp__logo { display: flex; align-items: center; height: 40px; }
  .lxh-sp__logo img, .lxh-sp__logo .lg { display: block; width: 94px; height: auto; }
  .lxh-sp__menu { text-transform: capitalize; }
  
  .lx-sheet { position: fixed; inset: 0; margin: auto; z-index: 200; transition: opacity 0.5s var(--easing-1); }
  .lx-sheet[aria-hidden="true"] { pointer-events: none; }
  .lx-sheet__overlay { position: absolute; top: 0; width: 100%; height: 100%; }
  .lx-sheet__contents { position: relative; z-index: 1; display: flex; flex-direction: column; width: 100%; max-height: 100%; padding-bottom: 72px; background: var(--lx-paper); border-radius: 0 0 16px 16px; box-shadow: var(--lx-shadow); opacity: 1; transform: translateY(0); transition: transform 0.5s var(--easing-3), opacity 0.5s var(--easing-1) 0.3s; }
  .lx-sheet[aria-hidden="true"] .lx-sheet__contents { opacity: 0; transform: translateY(-100%); }
  .lx-sheet__inner { position: relative; z-index: 1; width: 100%; margin-top: auto; opacity: 1; transform: translateZ(0); transition: opacity 0.5s var(--easing-1) 0.2s, transform 0.5s var(--easing-3) 0.2s; }
  .lx-sheet[aria-hidden="true"] .lx-sheet__inner { opacity: 0; transform: translate3d(0, -70px, 0); transition-delay: 0.5s; transition-duration: 0s; }
  .lx-sheet__close { display: flex; padding: 10px 0 10px 10px; }
  .lx-sheet__close svg { width: 16px; height: 16px; }
  .lx-divider { box-sizing: border-box; width: 100%; height: 1px; border-bottom: 1px solid var(--lx-divider); }
  .lx-sheet__divider-top { margin-top: 50px; }
  .lx-sheet__nav { overflow-y: auto; scrollbar-width: none; }
  .lx-sheet__nav::-webkit-scrollbar { display: none; }
  .lx-sheet__list { margin-top: 20px; }
  .lx-sheet__group-title { margin-top: 18px; }
  .lx-sheet__group-body { margin: 22px 0 6px; }
  .lx-sheet__group-body ul { padding-left: 20px; }
  .lx-sheet__sub { display: flex; align-items: flex-end; justify-content: space-between; padding: 10px 0; }
  .lx-sheet__top { display: flex; align-items: center; justify-content: space-between; padding: 16px 0; }
  .lx-sheet__drag { position: absolute; z-index: 1; bottom: 0; left: 0; right: 0; margin: auto; width: 100px; height: 72px; cursor: grab; }
  .lx-sheet__handle { position: absolute; left: 0; right: 0; bottom: 20px; margin: auto; width: 64px; height: 4px; border-radius: 9999px; background: var(--lx-handle); }
  body.lx-sheet-open { overflow: hidden; }
}

@media screen and (min-width: 768px) { .lxh .lxh-open { border: 1px solid rgba(0, 0, 0, 0.1); box-sizing: border-box; } }

.lxh-pc__chev { transition: transform 0.5s cubic-bezier(0, 0.7, 0, 1); transform-origin: 50% 50%; }
.lxh-pc__item--popup:hover .lxh-pc__chev, .lxh-pc__item--popup[aria-expanded="true"] .lxh-pc__chev { transform: rotate(180deg); }

.lxh-fixed-logo { display: none; }
@media (min-width: 768px) {
  .lxh .lxh-fixed-logo { display: block; position: fixed; z-index: 300; padding: 15px 0; opacity: 0; pointer-events: none; transition: opacity 0.3s var(--easing-1); }
  .lxh .lxh-fixed-logo.is-show { opacity: 1; pointer-events: auto; }
  .lxh .lxh-fixed-logo:hover { opacity: 0.6; }
  .lxh .lxh-open { left: auto; right: calc(100% / 28); margin-left: 0; margin-right: -1.4vw; }
  .lxh-pc__bg { left: auto; right: 0; transform: translate3d(-2.2vw, 0, 0) scale(1); }
  .lxh-pc.open-anime-start .lxh-pc__bg { transform: translate3d(-2.2vw, 0, 0) scale(1.08); transform-origin: 100% 50%; }
  .lxh-pc.close-anime-start .lxh-pc__bg { transform-origin: 100% 50%; }
  .lxh-fixed-jobs { right: calc(100% / 28 - 1.4vw + var(--lx-open-w, 120px) + 12px); margin-right: 0; }
}

.lx-burger { display: inline-flex; flex-direction: column; justify-content: space-between; width: 20px; height: 14px; }
.lx-burger i { display: block; height: 2px; border-radius: 1px; background: currentColor; }
.lxh-open__burger { margin: 0 22px 0 14px; color: #000; }
.lxh-sp__menu .lx-burger { width: 22px; height: 15px; vertical-align: middle; }
