@charset "UTF-8";

/*
 * Responsive foundation
 * SP: < 768px / Tablet: 768px - 1023px / PC: >= 1024px
 * Layout may still switch where content would otherwise collide, but type and
 * spacing should use these three tiers and fluid values within the middle tier.
 */
.page-top{
  --top-content-gutter:20px;
  --top-section-title-size:52px;
  --top-lead-size:20px;
  --top-body-size:14px;
  --top-card-title-size:20px;
  --top-section-space:64px;
}

@media(min-width:768px) and (max-width:1023px){
  .page-top{
    --top-content-gutter:24px;
    --top-section-title-size:clamp(56px,6.6vw,68px);
    --top-lead-size:clamp(24px,2.75vw,28px);
    --top-body-size:clamp(14px,1.45vw,15px);
    --top-card-title-size:clamp(22px,2.35vw,24px);
    --top-section-space:clamp(72px,8vw,88px);
  }
}

@media(min-width:1024px){
  .page-top{
    --top-content-gutter:20px;
    --top-section-title-size:clamp(68px,5.764vw,83px);
    --top-lead-size:clamp(26px,1.944vw,28px);
    --top-body-size:15px;
    --top-card-title-size:clamp(22px,1.806vw,26px);
    --top-section-space:clamp(80px,6.944vw,100px);
  }

  .page-top .section-title{
    white-space:nowrap;
  }

  body.page-top .interview__button.gradient-button{
    position:static;
    margin:32px 0 0 7px;
  }
}

/* Linked INTERVIEW cards and CONTACT CTA hover motion. */
.page-top .contact__panel{
  background-position:50% 50%;
  background-size:100% 100%;
  box-shadow:inset 0 0 0 rgba(255,255,255,0);
  transition:background-position .65s cubic-bezier(.22,1,.36,1),
    background-size .65s cubic-bezier(.22,1,.36,1),
    box-shadow .45s ease;
}

.page-top .contact__decoration,
.page-top .contact__arrow{
  transition:transform .45s cubic-bezier(.22,1,.36,1);
}

@media(hover:hover) and (pointer:fine){
  .page-top .contact__panel:hover{
    background-position:calc(50% + 5px) calc(50% - 3px);
    background-size:103% 103%;
    box-shadow:inset 0 0 28px rgba(255,255,255,.28);
  }

  .page-top .contact__panel:hover .contact__decoration:first-child{
    transform:translateX(-4px);
  }

  .page-top .contact__panel:hover .contact__decoration:last-child{
    transform:translateX(4px);
  }

  .page-top .contact__panel:hover .contact__arrow{
    animation:contact-cta-arrow-slide .55s cubic-bezier(.22,1,.36,1);
  }
}

@keyframes contact-cta-arrow-slide{
  0%{opacity:1;transform:translateX(0)}
  42%{opacity:0;transform:translateX(16px)}
  43%{opacity:0;transform:translateX(-16px)}
  100%{opacity:1;transform:translateX(0)}
}

@media(min-width:768px){
  body.page-top .interview__button.gradient-button{
    width:222px;
    min-width:222px;
  }
}

.contact__decoration:not(.contact__arrow){font-size:30px}
.contact__arrow .ui-arrow{transform:translateY(-2.9px)}

.page-top{background:#fff;color:#111}.section{position:relative}.section__inner{width:min(1120px,calc(100% - 40px));margin:auto}.section-title{font-family:var(--font-en);font-size:83px;font-weight:200;line-height:1;letter-spacing:-.035em}.section-label{position:relative;margin-top:22px;padding-left:26px;font-size:18px;font-weight:600}.section-label:before{content:"";position:absolute;left:0;top:.75em;width:11px;height:11px;border-radius:50%;background:linear-gradient(135deg,#f9ca70,#f08696)}.more{display:flex;align-items:center;justify-content:flex-end;color:#f18d78;font-family:var(--font-en);font-size:18px;letter-spacing:.06em;text-align:right}

.site-header{position:absolute;z-index:5;inset:0 0 auto 0;height:350px}.site-header__logo{position:absolute;top:50px;left:58px;width:165px}.site-header__contact{position:fixed;z-index:50;top:37px;right:54px;display:flex;align-items:center;justify-content:space-between;width:177px;height:59px;padding:0 14.58px 0 43px;overflow:hidden;border-radius:29.5px;background:linear-gradient(154.658deg,#94fbff 14.163%,#3f4fff 86.821%);box-shadow:0 1.873px 4.683px rgba(0,0,0,.15),0 0 7px rgba(255,255,255,.72),inset -.937px -.937px 3.746px rgba(255,255,255,.45),inset 1.873px 1.873px 3.746px rgba(255,255,255,.6);color:#fff;font-family:var(--font-en);font-size:15px;font-weight:500;line-height:1;letter-spacing:0}.site-header__nav{position:absolute;top:132px;right:57px;width:172px}.site-header__nav ul{display:flex;flex-direction:column;align-items:flex-end;gap:18px}.site-header__nav li{font-family:var(--font-en);font-size:17px;font-weight:400;line-height:19px;letter-spacing:0;text-align:right;text-transform:uppercase;white-space:nowrap}.site-header__nav-business{font-family:var(--font-ja)!important;font-size:17.961px!important;font-weight:500!important;line-height:36px!important;letter-spacing:0!important;text-transform:none!important}.site-header__nav-business a{display:inline-flex;align-items:center;gap:12px}
.site-header__nav-business-sp{display:none}

.site-header__nav-link{display:inline-grid;justify-items:end;align-items:center;--ui-arrow-color:#111}
.site-header__nav-link>span{grid-area:1/1;transition:opacity .2s ease}
.site-header__nav-en{opacity:1}
.site-header__nav-ja{display:inline-flex;align-items:center;gap:12px;opacity:0;font-family:var(--font-ja);font-size:17.961px;font-weight:500;line-height:19px;text-transform:none}
.site-header__nav-link:focus-visible .site-header__nav-en{opacity:0}
.site-header__nav-link:focus-visible .site-header__nav-ja{opacity:1}
@media(hover:hover) and (pointer:fine){
  .site-header__nav-link:hover .site-header__nav-en{opacity:0}
  .site-header__nav-link:hover .site-header__nav-ja{opacity:1}
}

body .top-scroll-menu{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,visibility .2s ease}
body .top-scroll-menu.is-visible{opacity:1;visibility:visible;pointer-events:auto}

.hero-story{position:relative;height:1652px;overflow:hidden;}.hero-story__headline{position:absolute;z-index:1;top:525.128px;left:max(69px,calc((100% - 1302px)/2))}.hero-story__headline h1{font-size:53px;font-weight: 400;line-height:78px;letter-spacing:.07em}.hero-story__headline>p{position:relative;margin-top:25.872px;padding-left:35.276px;font-family:var(--font-en);font-size:16px;line-height:33px;letter-spacing:.13em}.hero-story__scroll-arrow{position:absolute;top:16px;left:13.977px}.hero-story__body{position:absolute;z-index:1;top:863.407px;left:calc(50% - 260px);width:494px;font-size:19px;line-height:53.761px}.hero-story__body p{margin:0}.hero-story__muted{color:rgba(0,0,0,.3)}.hero-story__body .gradient-button{position:absolute;top:656.593px;left:0;gap:12px;width:207px;min-width:207px;height:54px;margin:0;padding:0 16px;border-radius:5.753px;background:linear-gradient(159.61deg,#f9ca70 24.443%,#f08696 75.557%);box-shadow:0 .827px 5.787px rgba(0,0,0,.15),inset 0 0 3.307px rgba(255,255,255,.54);font-size:14px;line-height:1;letter-spacing:-.04em;white-space:nowrap}.hero-story__art{position:absolute;z-index:0;object-fit:contain}.hero-story__art--products{top:921.547px;left:63.4494vw;width:18.9315vw}.hero-story__art--gifts{top:1116.552px;left:6.3246vw;width:17.559vw}.hero-story__art--kitchen{top:1390.758px;left:67.4067vw;width:24.0388vw}

.hero-story__scroll-arrow{
  --scroll-arrow-travel:7px;
  animation:scroll-arrow-bounce 1.3s infinite;
  will-change:transform;
}

@keyframes scroll-arrow-bounce{
  0%{
    transform:translateY(0);
    animation-timing-function:cubic-bezier(.4,0,1,1);
  }
  30%{
    transform:translateY(var(--scroll-arrow-travel));
    animation-timing-function:cubic-bezier(0,0,.2,1);
  }
  100%{transform:translateY(0)}
}

.business{height:936px;min-height:936px;padding:100px 0}.business__layout{width:min(1228px,calc(100% - 40px));display:grid;grid-template-columns:minmax(0,560px) minmax(0,1fr);grid-template-rows:auto auto auto auto auto;column-gap:40px;align-items:start}.business .section-title,.business .section-label,.business__lead,.business__text,.business .gradient-button{grid-column:1}.business .section-title{grid-row:1;font-size:clamp(54px,6.944vw,100px);line-height:1;white-space:nowrap}.business .section-label{grid-row:2}.business__lead{grid-row:3;margin-top:52px;font-size:28px;font-weight:500;line-height:1.8}.business__text{grid-row:4;margin-top:24px;font-size:15px;line-height:2.15}.business .gradient-button{grid-row:5;justify-self:start;margin-top:24px}.business__visual{position:relative;grid-column:2;grid-row:1 / 6;align-self:center;justify-self:start;width:min(560px,100%);aspect-ratio:1;overflow:hidden;border-radius:44% 56% 48% 52% / 42% 46% 54% 58%}.business__visual:before{content:"";position:absolute;inset:-30px;background:url("../images/top/hero-gradient.png") center/cover;opacity:.35}.business__visual img{position:relative;width:100%;height:100%;object-fit:cover}

.workstyle{padding-top:88px}.workstyle__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:70px;margin-top:74px}.work-card img{width:100%;aspect-ratio:1;object-fit:contain}.work-card h3{margin-top:38px;font-size:26px}.work-card__en{color:#939393;font-family:var(--font-en);font-size:13px;letter-spacing:.18em}.work-card>p:last-of-type{min-height:84px;margin-top:18px;font-size:14px;line-height:2}.workstyle__wide-photo{width:100%;height:609px;margin-top:100px;object-fit:cover;object-position:center 58%}

.jobs{padding:140px 0 120px}.jobs .section-title{font-size:83px;font-weight:200;line-height:1.2;letter-spacing:-.035em}.jobs__list{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:75px}.job-card{position:relative;min-height:316px;padding:34px;border-radius:20px;background:rgba(255,255,255,.58);box-shadow:0 5px 18px rgba(0,0,0,.1);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.job-card h3{font-size:20px;font-weight:600;line-height:40px;letter-spacing:2px}.job-card hr{margin:10px 0 12px;border:0;border-top:1px solid #bbb}.job-card__place{display:flex;align-items:flex-start;gap:11px;font-size:14px;font-weight:400;line-height:28px}.job-card__pin{flex:none;width:19.247px;height:24.075px;margin-top:0}.job-card>p:last-of-type{margin-top:12px;font-size:16px;font-weight:400;line-height:30px;letter-spacing:1px}.job-card .more{position:absolute;right:35px;bottom:28px;font-size:17.879px;line-height:35.758px;letter-spacing:0}.jobs__controls{display:none}

.faq{padding:0 0 195px}.faq__inner{position:relative}.faq__list-button{position:absolute;top:65px;right:0}.faq__list{display:grid;gap:20px;margin-top:75px}.faq-item{border-radius:18px;background:#fffffff0;box-shadow:0 4px 18px #0001}.faq-item h3{font-size:18px}.faq-item button{display:grid;grid-template-columns:46px 1fr 40px;align-items:center;width:100%;min-height:106px;padding:20px 34px;border:0;background:transparent;text-align:left}.faq-mark{display:grid;place-items:center;width:34px;height:34px;border:2px solid #f59a82;border-radius:50%;color:#f08696;font-family:var(--font-en)}.faq-sign{font-size:28px;font-weight: 400;text-align:center}.faq-answer{display:grid;grid-template-columns:46px 1fr;align-items:start;padding:0 78px 30px 34px}.faq-mark--answer{border:0;background:linear-gradient(135deg,#f9ca70,#f08696);color:#fff}.faq-answer p{font-size:15px;line-height:2}

.interview{padding:115px 0 64px}.interview__layout{position:relative;display:grid;grid-template-columns:500px minmax(0,698px);column-gap:79px;width:min(1230px,calc(100% - 40px))}.interview__intro{grid-column:1}.interview__intro>p:not(.section-label){margin-top:40px;font-size:14px;line-height:30px}.interview__intro>p.interview__muted{margin-top:19px;color:#777;font-size:12px;font-weight:400;line-height:26px;letter-spacing:0}.interview__button{position:absolute;top:371px;left:7px;gap:14px;width:207px;height:54px;margin:0;padding:0 8px 0 17px;font-size:13px;line-height:1;letter-spacing:-.06em;white-space:nowrap}.interview__list{grid-column:2;width:698px;margin-top:-21px}.interview-card{position:relative;display:grid;grid-template-columns:348px 350px;align-items:stretch;height:383px;border:0}.interview-card:last-child{height:348px}.interview-card:not(:last-child)::after{content:"";position:absolute;left:0;bottom:0;width:646px;border-bottom:1px solid #dedede}.interview-card img{align-self:center;display:block;width:auto;height:auto;max-width:none;object-fit:contain;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 52%,rgba(0,0,0,.732289) 72%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 52%,rgba(0,0,0,.732289) 72%,transparent 100%);-webkit-mask-mode:alpha;mask-mode:alpha;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.interview-card>div{align-self:start;padding-top:56px}.interview-card:nth-child(2)>div{padding-top:60px}.interview-card:nth-child(3)>div{padding-top:59px}.interview-tag{display:inline-flex;align-items:center;justify-content:center;height:30px;padding:0 14px;border:1.5px solid transparent;border-radius:24px;position:relative;background:none;font-size:13px;font-weight:600;line-height:1;letter-spacing:1px}.interview-card:nth-child(1) .interview-tag{width:177px}.interview-card:nth-child(2) .interview-tag,.interview-card:nth-child(3) .interview-tag{width:154px}.interview-tag span{background-image:var(--interview-gradient);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}.interview-card h3{margin-top:20px;font-size:18px;font-weight:600;line-height:32px}.interview-card div>p:not(.interview-tag){width:274px;margin-top:16px;font-size:14px;line-height:26px}.interview-card .more{margin-top:13px;margin-right:75px;font-size:18px;line-height:36px}

.contact{padding:0 0 64px}.contact__panel{display:flex;flex-direction:column;align-items:center;justify-content:center;width:min(1276px,calc(100vw - 40px));height:395px;margin-right:0;margin-left:max(20px,calc((100vw - 1276px)/2));overflow:hidden;border-radius:21.77px;background:url("../images/top/contact-background-pc.png") center/100% 100% no-repeat;color:#fff;text-align:center}.contact h2{font-family:var(--font-en);font-size:83px;font-weight:200;line-height:120.566px;letter-spacing:0;text-shadow:0 0 12px rgba(0,0,0,.18)}.contact__cta{display:inline-flex;align-items:center;justify-content:center;gap:32px;width:auto;height:24.536px;margin-top:19.423px;color:#fff;font-family:var(--font-ja);font-weight:400;font-size:27px;line-height:24.536px;white-space:nowrap;text-shadow:0 0 12px rgba(0,0,0,.18);opacity:1;mix-blend-mode:normal}.contact__cta>span{display:inline-block;background:none;color:#fff;-webkit-text-fill-color:#fff;opacity:1}.contact__decoration{color:#fff;text-align:center;-webkit-text-fill-color:#fff}.contact__decoration:not(.contact__arrow){font-family:var(--font-en)}.contact__arrow{color:#fff;-webkit-text-fill-color:#fff}.contact__arrow .ui-arrow{--ui-arrow-width:24px;--ui-arrow-height:14.526px}

@media(max-width:767px){.section__inner{width:calc(100% - 40px)}.section-title{font-size:52px;line-height:1.05}.section-label{margin-top:18px;font-size:13px;padding-left:18px}.section-label:before{width:7px;height:7px}.site-header{height:250px}.site-header__logo{top:23px;left:24px;width:118px}.site-header__contact{top:20px;right:19px;width:138px;padding:12px 24px;font-size:13px}.site-header__nav{top:87px;right:19px;gap:11px;font-size:13px}.site-header__nav a:nth-child(2){font-family:var(--font-en);font-size:13px}.hero-story{height:1499px}.hero-story__headline{top:442px;left:20px}.hero-story__headline h1{font-size:28px;line-height:1.6}.hero-story__headline>p{margin-top:18px;font-size:11px}.hero-story__body{top:626px;left:20px;width:310px;font-size:13px;line-height:2.45}.hero-story__body p{margin-bottom:5px}.hero-story__body .gradient-button{margin:30px 0 0 78px}.hero-story__art--products{top:607px;left:208px;width:150px}.hero-story__art--gifts{top:900px;left:225px;width:145px}.hero-story__art--kitchen{right:25px;bottom:95px;width:300px}.gradient-button{min-width:179px;padding:14px 18px;font-size:12px}.business{min-height:936px;padding:10px 0 70px}.business__layout{display:block}.business__lead{margin-top:55px;font-size:20px;line-height:1.8}.business__text{margin-top:350px;font-size:13px;line-height:2.25}.business__visual{position:absolute;top:285px;left:22px;width:330px;height:310px;border-radius:43% 57% 48% 52%/42% 44% 56% 58%}.business .gradient-button{margin-top:28px}.workstyle{padding-top:5px}.workstyle__grid{display:block;margin-top:55px}.work-card{margin-bottom:65px}.work-card img{width:100%}.work-card h3{margin-top:18px;font-size:20px}.work-card__en{font-size:11px}.work-card>p:last-of-type{min-height:0;margin-top:16px;font-size:13px}.work-card .more{margin-top:18px}.workstyle__wide-photo{height:363px;margin-top:30px}.jobs{padding:0 0 45px}.jobs__list{display:block;margin-top:40px}.job-card{min-height:285px;padding:32px}.job-card:not([data-mobile-job]){display:none}.job-card h3{font-size:18px}.job-card>p:last-of-type{font-size:14px}.jobs__controls{display:grid;grid-template-columns:95px 1fr 95px;align-items:center;gap:15px;margin-top:34px}.jobs__controls button{height:40px;border:1px solid #222;border-radius:25px;background:transparent}.jobs__controls p{text-align:center;font-family:var(--font-en)}.faq{padding:35px 0 95px}.faq__list-button{position:static;margin:45px auto 0;display:flex}.faq__list{gap:14px;margin-top:40px}.faq-item{border-radius:18px}.faq-item button{grid-template-columns:38px 1fr 26px;min-height:86px;padding:15px 16px}.faq-item h3{font-size:14px}.faq-mark{width:29px;height:29px}.faq-answer{grid-template-columns:38px 1fr;padding:0 20px 25px 16px}.faq-answer p{font-size:13px;line-height:2}.interview{height:auto;padding:10px 0 68.6px}.interview__layout{display:block;width:calc(100% - 40px)}.interview .section-label{margin-top:8px}.interview__intro>p:not(.section-label){margin-top:37px;font-size:14px;line-height:30px}.interview__intro .interview__muted{margin-top:11px;font-size:12px;line-height:26px}.interview__list{display:flex;flex-direction:column;gap:0;width:100%;margin-top:20px}.interview-card{display:flex;flex-direction:column;width:100%;height:auto;min-height:0;padding:0;border:0}.interview-card:not(:last-child)::after{display:none}.interview-card img{display:block;flex:none;align-self:center;max-width:none;margin-right:auto;margin-left:auto;transform:none}.interview-card>div,.interview-card:nth-child(2)>div,.interview-card:nth-child(3)>div{padding-top:0}.interview-card:nth-child(1)>div{margin-top:19.6px}.interview-card:nth-child(2)>div{margin-top:27px}.interview-card:nth-child(3)>div{margin-top:23.8px}.interview-tag{height:27.119px;padding:0 13px;font-size:12px}.interview-card h3{margin-top:12.9px;font-size:16px;line-height:32px}.interview-card div>p:not(.interview-tag){width:100%;margin-top:11px;font-size:14px;line-height:26px}.interview-card .more{margin-top:0;margin-right:0;font-size:16px;line-height:36px}.interview-card:nth-child(1){margin-bottom:36.8px}.interview-card:nth-child(2){margin-bottom:30.5px}.interview__button{display:flex;width:179px;height:58px;margin:35.5px auto 0;padding:0 23px;font-size:12px;line-height:16px}.contact{padding:0 0 34px}.contact__panel{width:min(356px,calc(100vw - 19px));height:194.302px;margin-left:9.5px;border-radius:9.48px;background-image:url("../images/top/contact-background-sp.png")}.contact h2{font-size:42.75px;line-height:51.84px;text-shadow:0 0 19.612px rgba(0,0,0,.45)}.contact__cta{grid-template-columns:8px 133px 9px 8px;column-gap:16.5px;width:207.5px;height:12.685px;margin-top:9.876px;font-size:11px;line-height:12.685px;text-shadow:0 0 19.612px rgba(0,0,0,.45)}.contact__cta-label{width:133px}.site-footer{height:727px}.site-footer__inner{display:block;width:calc(100% - 40px);padding-top:50px}.site-footer__brand img{width:169px}.site-footer__brand>p{margin-top:28px;font-size:12px}.site-footer nav{grid-template-columns:1fr 1fr;gap:20px 28px;margin-top:48px}.site-footer nav a{font-size:15px}.site-footer nav small{font-size:9px}.site-footer__meta{position:absolute;left:0;bottom:90px;padding:0;font-size:11px}.site-footer__slogan{bottom:10px;left:10px;font-size:45px;line-height:.95;white-space:normal}.site-footer__slogan span{display:block}}

@media(max-width:360px){.site-header__logo{width:105px}.site-header__contact{width:125px}.hero-story__art--products{left:185px}.hero-story__art--gifts{left:195px}.business__visual{width:calc(100% - 44px)}}

@media(max-width:767px){
  .site-header__nav-ja{gap:9px;font-size:14px;line-height:15px}
  .site-header__nav-ja .ui-arrow{--ui-arrow-width:11.709px;--ui-arrow-height:7.088px}
  .business{height:936px;min-height:936px;overflow:hidden;padding:10px 0 40px}
  .business__layout{width:calc(100% - 40px);display:flex;flex-direction:column;gap:0}
  .business .section-title{font-size:52px;line-height:1.05;white-space:normal}
  .business__lead{margin-top:28px;font-size:18px;line-height:1.55}
  .business__visual{position:relative;inset:auto;width:min(330px,100%);height:auto;aspect-ratio:1;margin:20px auto 0}
  .business__text{margin-top:18px;font-size:12px;line-height:2}
  .business .gradient-button{margin-top:18px}
  .workstyle{height:2122px;overflow:hidden}
  .work-card{margin-bottom:45px}
  .interview{height:auto;overflow:hidden}
}

/* Ease of working */
.workstyle{
  height:auto;
  padding-top:0;
}

.workstyle .section__inner{
  width:min(1224px,calc(100% - 40px));
}

.workstyle .section-title{
  width:max-content;
  max-width:100%;
  line-height:100px;
  letter-spacing:0;
  white-space:nowrap;
}

.workstyle .section-label{
  margin-top:17px;
  margin-left:5px;
  padding-left:24px;
}

.workstyle__grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:81px;
  margin-top:-7px;
}

.work-card{
  min-width:0;
}

.work-card__media{
  position:relative;
  isolation:isolate;
}

.work-card picture{
  display:block;
  width:100%;
  height:100%;
}

.work-card img{
  width:100%;
  height:100%;
  max-width:none;
  object-fit:contain;
}

.work-card:nth-child(1) .work-card__media{
  width:484px;
  height:479px;
  margin-left:-95px;
}

.work-card:nth-child(2) .work-card__media{
  width:484px;
  height:479px;
  margin-left:-56px;
}

.work-card:nth-child(3) .work-card__media{
  width:487px;
  height:482px;
  margin-left:-44px;
}

.work-card:nth-child(1) .work-card__media>picture,
.work-card:nth-child(1) .work-card__media>.liquid-mask__canvas{
  filter:brightness(1.08) saturate(.78) contrast(.92);
}

.liquid-mask__canvas{
  position:absolute;
  z-index:1;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease;
}

[data-liquid-mask].is-liquid-ready>picture{
  opacity:0;
}

[data-liquid-mask].is-liquid-ready>.liquid-mask__canvas{
  opacity:1;
}

.work-card h3{
  margin-top:-37px;
  font-size:26px;
  line-height:52px;
}

.work-card:nth-child(3) h3{
  margin-top:-40px;
}

@media(min-width:768px){
  .work-card:nth-child(1) h3,
  .work-card:nth-child(1) .work-card__en,
  .work-card:nth-child(1)>p:last-of-type{
    position:relative;
    left:3px;
  }

  .work-card:nth-child(1)>p:last-of-type{width:352px}

  .work-card:nth-child(2) h3,
  .work-card:nth-child(2) .work-card__en{
    position:relative;
    left:4px;
  }

  .work-card:nth-child(2)>p:last-of-type{
    position:relative;
    left:1px;
    width:352px;
  }

  .work-card:nth-child(3) h3,
  .work-card:nth-child(3) .work-card__en{
    position:relative;
    left:-1px;
  }

  .work-card:nth-child(3)>p:last-of-type{
    position:relative;
    left:-1px;
    width:352px;
  }
}


.work-card__en{
  margin-top:9px;
  font-size:13px;
  line-height:16px;
  letter-spacing:.154em;
  text-transform:uppercase;
}

.work-card>p:last-of-type{
  min-height:60px;
  margin-top:17px;
  font-size:15px;
  line-height:30px;
  letter-spacing:1px;
}

.work-card .more{
  position:relative;
  width:max-content;
  margin-top:13px;
  font-family:var(--font-en);
  font-size:17.879px;
  font-style:normal;
  font-weight:400;
  line-height:35.758px;
  text-align:left;
  white-space:nowrap;
}

.more__paren,
.more__label{
  display:inline-flex;
  align-items:center;
  align-self:center;
  line-height:1;
}
.more__label{margin-left:.75em}
.more .ui-arrow{align-self:center;margin-left:1em}
.more__paren:last-child{margin-left:.75em}

.interview-card .more.more-link{
  display:flex;
  justify-content:flex-end;
}

.work-card .more .ui-arrow{
  position:static;
  --ui-arrow-width:13.957px;
  --ui-arrow-height:8.449px;
}

@media(min-width:768px){
  .work-card:nth-child(1) .more{margin-left:234px}
  .work-card:nth-child(2) .more{margin-left:232px}
  .work-card:nth-child(3) .more{margin-left:223px}
}

.workstyle__wide-photo{
  --wide-photo-scale:1.08;
  position:relative;
  left:50%;
  width:1440px;
  max-width:none;
  height:609px;
  margin-top:144px;
  margin-bottom:-9px;
  transform:translateX(-50%);
  overflow:hidden;
}

.workstyle__wide-photo-image{
  position:absolute;
  top:50%;
  left:50%;
  display:block;
  width:100%;
  max-width:none;
  height:100%;
  object-fit:cover;
  object-position:center 58%;
  transform:translate3d(-50%,-50%,0) scale(var(--wide-photo-scale));
}


@media(min-width:768px) and (max-width:1100px){
  .workstyle .section-title{
    font-size:clamp(60px,7.5vw,83px);
    line-height:1.2;
  }

  .workstyle__grid{
    gap:24px;
    margin-top:24px;
  }

  .work-card__media,
  .work-card:nth-child(1) .work-card__media,
  .work-card:nth-child(2) .work-card__media,
  .work-card:nth-child(3) .work-card__media{
    width:145%;
    height:auto;
    aspect-ratio:1;
    margin-left:-22.5%;
  }

  .work-card h3,
  .work-card:nth-child(3) h3{
    margin-top:-12%;
    font-size:22px;
    line-height:1.7;
  }

  .work-card>p:last-of-type{
    min-height:0;
    font-size:14px;
    line-height:1.9;
  }

  .workstyle__wide-photo{
    --wide-photo-scale:1.08;
    width:100vw;
    height:auto;
    aspect-ratio:1440 / 609;
    margin-top:100px;
    margin-bottom:0;
  }
}

@media(max-width:767px){
  .workstyle{
    height:auto;
    padding-top:0;
    overflow:hidden;
  }

  .workstyle .section__inner{
    width:calc(100% - 40px);
  }

  .workstyle .section-title{
    width:max-content;
    max-width:none;
    margin-left:-4px;
    font-size:51px;
    line-height:55px;
    letter-spacing:-.02em;
    white-space:nowrap;
  }

  .workstyle .section-label{
    margin-top:9px;
    margin-left:0;
    padding-left:18px;
  }

  .workstyle__grid{
    display:block;
    margin-top:-38px;
  }

  .work-card{
    margin-bottom:0;
  }

  .work-card:nth-child(1) .work-card__media{
    width:100vw;
    height:auto;
    aspect-ratio:375 / 438;
    margin-left:-20px;
  }

  .work-card:nth-child(2) .work-card__media{
    width:100vw;
    height:auto;
    aspect-ratio:375 / 438;
    margin-left:-20px;
  }

  .work-card:nth-child(3) .work-card__media{
    width:100vw;
    height:auto;
    aspect-ratio:375 / 441;
    margin-left:-20px;
  }

  .work-card h3,
  .work-card:nth-child(3) h3{
    margin-top:-65px;
    font-size:20px;
    font-weight:500;
    line-height:40px;
  }

  .work-card:nth-child(2) h3{
    margin-top:-61px;
  }

  .work-card:nth-child(3) h3{
    margin-top:-58px;
  }

  .work-card__en{
    margin-top:2px;
    font-size:11px;
    line-height:13px;
    letter-spacing:.091em;
  }

  .work-card>p:last-of-type{
    min-height:56px;
    margin-top:12px;
    font-size:14px;
    line-height:28px;
  }

  .work-card .more{
    width:100%;
    margin-top:10px;
    justify-content:flex-end;
    font-size:16px;
    line-height:36px;
  }

  .work-card+ .work-card{
    margin-top:-33px;
  }

  .work-card:nth-child(3){
    margin-top:-40px;
  }

  .workstyle__wide-photo{
    --wide-photo-scale:1.05;
    left:50%;
    width:max(752px,100vw);
    height:339px;
    margin-top:67px;
    margin-bottom:0;
  }
}

@media(min-width:1024px){
  .workstyle__wide-photo{
    width:100vw;
    height:609px;
    aspect-ratio:auto;
  }
}

/* OUR BUSINESS: Figma Mask Group rendered with its alpha blur intact. */
.business{
  position:relative;
}

.business__visual{
  position:absolute;
  top:200px;
  left:46.5676%;
  width:min(46.3889vw,668px);
  height:auto;
  aspect-ratio:1;
  overflow:visible;
  border-radius:0;
}

.business__visual{
  isolation:isolate;
}

.business__visual::before{
  display:none;
}

.business__visual picture,
.business__visual img{
  display:block;
  width:100%;
  height:100%;
}

.business__visual img{
  position:static;
  object-fit:cover;
  transform:translateY(-10%) scale(1.15);
}

/* Keep the rounded silhouette while the animated canvas is loading. */
.business__visual picture{
  -webkit-mask:url("../images/top/company-building-mask-pc.png") center / 100% 100% no-repeat;
  mask:url("../images/top/company-building-mask-pc.png") center / 100% 100% no-repeat;
}

@media(max-width:767px){
  .business__visual picture{
    -webkit-mask-image:url("../images/top/company-building-mask-sp.png");
    mask-image:url("../images/top/company-building-mask-sp.png");
  }
}

@media(min-width:768px) and (max-width:1100px){
  .business__layout{grid-template-columns:minmax(0,48%) minmax(0,52%);column-gap:24px}
}

@media(max-width:767px){
  .business__visual{
    position:relative;
    inset:auto;
    width:clamp(280px,89.6vw,336px);
    max-width:calc(100vw - 39px);
    aspect-ratio:1;
    margin:20px auto 0;
  }
}

@media(min-width:768px){
  .business .section-title{
    width:max-content;
    max-width:none;
    letter-spacing:-.05em;
  }
}

/* FAQ */
.faq{
  padding-bottom:197px;
}

.faq__list{
  gap:20px;
  margin-top:82px;
}

.faq__list-button{
  top:90px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 11.709px;
  align-items:center;
  width:207px;
  min-width:207px;
  height:54px;
  min-height:54px;
  padding:0 15.29px 0 18px;
  border-radius:5.753px;
  font-size:13px;
}

@media(min-width:768px){
  .page-top .faq__inner{
    display:block;
  }

  .page-top .faq__heading{
    position:relative;
  }

  .page-top .faq__list-button{
    position:absolute;
    top:auto;
    right:0;
    bottom:0;
    margin:0;
    transform:none;
  }

  .page-top .faq__list{
    margin-top:82px;
  }
}

@media(min-width:1024px){
  /* Match CONTACT's OTHER INTERVIEW heading/CTA alignment. */
  .page-top .faq__heading{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
  }

  .page-top .faq__heading>.section-title{
    grid-column:1/-1;
    grid-row:1;
  }

  .page-top .faq__heading>.section-label{
    grid-column:1;
    grid-row:2;
  }

  .page-top .faq__heading>.faq__list-button{
    position:static;
    grid-column:2;
    grid-row:2;
    align-self:end;
    margin:0;
  }
}

.faq-item{
  border-radius:20px;
  background:rgba(255,255,255,.5);
  box-shadow:0 0 25px 3px rgba(0,0,0,.1);
  transition:background-color .35s ease,box-shadow .4s ease;
}

@media(hover:hover) and (pointer:fine){
  .faq-item:hover{
    background:#fff;
    box-shadow:0 8px 24px rgba(0,0,0,.14);
  }
}

.faq-item:has(> h3 > button[aria-expanded="true"]) h3 button{
  min-height:0;
}

.faq-item h3 button{
  grid-template-columns:34px minmax(0,1fr) 26px;
  column-gap:21px;
  min-height:0;
  padding:38px 44px 38px 33px;
  font-size:20px;
  line-height:1.5;
  letter-spacing:.1em;
}

.faq-mark{
  --faq-mark-gradient:linear-gradient(200deg,#f9ca70 0%,#f08696 100%);
  position:relative;
  width:34px;
  height:34px;
  font-family:var(--font-en);
  font-size:18px;
  font-weight:500;
  line-height:1;
}

.faq-mark:not(.faq-mark--answer){
  border:0;
  background:var(--faq-mark-gradient);
  background-clip:text;
  -webkit-background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  text-indent:1.5px;
}

.faq-mark:not(.faq-mark--answer)::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  padding:2px;
  background:var(--faq-mark-gradient);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}

.faq-mark--answer{
  background:var(--faq-mark-gradient);
  text-indent:1.5px;
}

.faq-sign{
  position:relative;
  display:block;
  width:26px;
  height:26px;
  font-size:0;
}

.faq-sign::before,
.faq-sign::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:18px;
  height:2px;
  background:#111;
  transform:translate(-50%,-50%);
  transition:opacity .2s ease,transform .3s cubic-bezier(.4,0,.2,1);
}

.faq-sign::after{
  transform:translate(-50%,-50%) rotate(90deg);
}

.faq-item button[aria-expanded="false"] .faq-sign::before,
.faq-item button[aria-expanded="false"] .faq-sign::after{
  width:26px;
}

.faq-item button[aria-expanded="true"] .faq-sign::before{
  width:26px;
}

.faq-item button[aria-expanded="true"] .faq-sign::after{
  opacity:0;
  transform:translate(-50%,-50%) rotate(180deg);
}

.faq-answer{
  grid-template-columns:34px minmax(0,1fr);
  column-gap:19px;
  min-height:0;
  padding:0 93px 30px 33px;
  font-size:16px;
  line-height:30px;
  letter-spacing:.0625em;
}

.faq-answer p{
  font-size:16px;
  line-height:30px;
  letter-spacing:.0625em;
}

@media(max-width:767px){
  .faq{
    padding-top:0;
    padding-bottom:129px;
  }

  .faq .section-title{
    line-height:1;
  }

  .faq__list{
    gap:15px;
    margin-top:31px;
  }

  .faq__list-button{
    width:179px;
    min-width:179px;
    height:46px;
    min-height:46px;
    margin:51px auto 0;
    padding:0 17px;
    font-size:12px;
  }

  .faq-item{
    border-radius:18px;
    box-shadow:none;
  }

  .faq-item h3 button{
    grid-template-columns:29px minmax(0,1fr) 23px;
    column-gap:13px;
    align-items:start;
    min-height:0;
    padding:29px 20px 29px 17px;
    font-size:16px;
    line-height:28px;
    letter-spacing:.0625em;
  }

  .faq-item:has(> h3 > button[aria-expanded="true"]) h3 button{
    min-height:0;
  }

  .faq-mark{
    width:29px;
    height:29px;
    font-size:15px;
  }

  .faq-sign{
    align-self:start;
    justify-self:end;
    margin-top:6px;
    width:18px;
    height:18px;
  }

  .faq-item button[aria-expanded="true"] .faq-sign::before{
    width:18px;
  }

  .faq-item button[aria-expanded="false"] .faq-sign::before,
  .faq-item button[aria-expanded="false"] .faq-sign::after{
    width:18px;
  }

  .faq-answer{
    grid-template-columns:29px minmax(0,1fr);
    column-gap:13px;
    min-height:0;
    padding:0 56px 20px 17px;
    font-size:14px;
    line-height:28px;
    letter-spacing:.0714em;
  }

  .faq-answer p{
    font-size:14px;
    line-height:28px;
    letter-spacing:.0714em;
  }
}

/* Interview */
.interview-button-sp-break{display:none}


.interview-tag::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:1.5px;
  background:var(--interview-tag-gradient);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}


@media(min-width:768px){
  .faq{padding-bottom:82px}
}

.interview .section-title{line-height:100px;letter-spacing:0}
.interview .section-label{line-height:36px}
.interview__intro .section-label,.interview__intro>p:not(.section-label){margin-left:7px}

@media(min-width:768px) and (max-width:1279px){
  .interview__layout{grid-template-columns:minmax(270px,40%) minmax(0,60%);column-gap:0;width:calc(100% - 40px)}
  .interview .section-title{font-size:clamp(52px,7vw,83px)}
  .interview__list{width:100%}
  .interview-card,.interview-card:last-child{grid-template-columns:minmax(190px,46%) minmax(0,54%);width:100%;height:auto;min-height:383px}
  .interview-card:not(:last-child)::after{width:100%}
  .interview-card img{max-width:calc(100% - 24px)}
  
  
  
  .interview-card div>p:not(.interview-tag){width:auto;padding-right:18px}
  .interview-card .more{margin-right:18px}
}

@media(max-width:767px){
  .interview-pc-break{display:none}
  .interview-button-sp-break{display:block}
  .interview{height:auto;padding:10px 0 68.6px}
  .interview__layout{display:block;width:calc(100% - 40px)}
  .interview .section-title{margin-left:-4px;font-size:51px;line-height:52px}
  .interview__intro .section-label,.interview__intro>p:not(.section-label){margin-left:0}
  .interview .section-label{margin-top:8px;line-height:26px}
  .interview__intro>p:not(.section-label){margin-top:37px;font-size:14px;line-height:30px}
  .interview__intro>p.interview__muted{margin-top:11px;font-size:12px;font-weight:400;line-height:26px;letter-spacing:0}
  .interview__list{display:flex;flex-direction:column;gap:0;width:100%;margin-top:20px}
  .interview__list::after{display:none}
  .interview-card,.interview-card:last-child{display:flex;flex-direction:column;width:100%;height:auto;min-height:0;padding:0;border:0}
  .interview-card:not(:last-child)::after{display:none}
  .interview-card img{display:block;flex:none;align-self:center;max-width:none;margin-right:auto;margin-left:auto;transform:none}
  
  
  
  .interview-card>div,.interview-card:nth-child(2)>div,.interview-card:nth-child(3)>div{min-width:0;padding-top:0}
  .interview-card:nth-child(1)>div{margin-top:19.6px}
  .interview-card:nth-child(2)>div{margin-top:27px}
  .interview-card:nth-child(3)>div{margin-top:23.8px}
  .interview-tag,.interview-card:nth-child(1) .interview-tag,.interview-card:nth-child(2) .interview-tag,.interview-card:nth-child(3) .interview-tag{width:160px;height:27.119px;padding:0 13px;font-size:12px}
  .interview-card h3{max-width:100%;margin-top:12.9px;overflow-wrap:anywhere;font-size:16px;line-height:32px}
  .interview-card h3 br{display:none}
  .interview-card div>p:not(.interview-tag){width:100%;max-width:100%;margin-top:11px;overflow-wrap:anywhere;font-size:14px;line-height:26px}
  .interview-card .more{width:100%;max-width:100%;margin-top:5px;margin-right:0;font-size:16px;line-height:36px}
  .interview-card:nth-child(1){margin-bottom:36.8px}
  .interview-card:nth-child(2){margin-bottom:30.5px}
  .interview__button{position:static;display:flex;gap:8px;width:179px;height:58px;margin:35.5px auto 0;padding:0 10px;font-size:11px;line-height:1;letter-spacing:-.04em;white-space:nowrap}
}

@media(min-width:768px){
  .interview-card img{
    width:281.835px;
    max-width:100%;
    height:281.835px;
    aspect-ratio:1 / 1;
  }

  .interview-card:nth-child(1) .interview-tag,
  .interview-card:nth-child(2) .interview-tag,
  .interview-card:nth-child(3) .interview-tag{
    width:max-content;
    max-width:100%;
    padding-right:15px;
    padding-left:15px;
    font-weight:500;
    white-space:nowrap;
  }

  .interview-card .more{position:relative;top:5px}
}

@media(max-width:767px){
  .interview-card img{
    width:287.864px;
    max-width:100%;
    height:287.864px;
    aspect-ratio:1 / 1;
  }

  .interview-tag,
  .interview-card:nth-child(1) .interview-tag,
  .interview-card:nth-child(2) .interview-tag,
  .interview-card:nth-child(3) .interview-tag{
    width:max-content;
    max-width:100%;
    padding-right:13px;
    padding-left:13px;
    font-weight:600;
    white-space:nowrap;
  }

  .interview-card .more{position:relative;top:5px}
}

/* CONTACT */
.contact{overflow:clip}
.contact__panel{
  --contact-panel-radius:clamp(9.48px,1.51vw,21.77px);
  width:calc(100% - clamp(19px,2.78vw,40px));
  max-width:1276px;
  height:clamp(194.302px,27.43vw,395px);
  margin-right:auto;
  margin-left:auto;
  border-radius:var(--contact-panel-radius);
  background-image:url("../images/top/contact-background-pc.png");
  background-size:100% 100%;
}
.contact{padding-bottom:clamp(34px,4.45vw,64px)}
.contact h2{
  font-size:clamp(42.75px,5.76vw,83px);
  line-height:clamp(51.84px,8.37vw,120.566px);
}
.contact__cta{
  gap:clamp(16.5px,2.22vw,32px);
  margin-top:clamp(9.876px,1.35vw,19.423px);
  font-size:clamp(11px,1.875vw,27px);
  line-height:clamp(12.685px,1.7vw,24.536px);
}
.contact__decoration:not(.contact__arrow){font-size:clamp(16px,2.08vw,30px)}
.contact__arrow .ui-arrow{
  --ui-arrow-width:clamp(11.709px,1.67vw,24px);
  --ui-arrow-height:clamp(7.088px,1.01vw,14.526px);
}
.has-contact-reveal .contact__panel{
  opacity:0;
  clip-path:inset(calc(100% - 52px) calc(50% - 100px) 0 round var(--contact-panel-radius));
  transform:translateY(36px);
  transform-origin:center bottom;
  transition:clip-path 1s cubic-bezier(.16,1,.3,1),
    transform 1s cubic-bezier(.16,1,.3,1),
    opacity .18s ease,
    background-position .65s cubic-bezier(.22,1,.36,1),
    background-size .65s cubic-bezier(.22,1,.36,1),
    box-shadow .45s ease;
  will-change:clip-path,transform;
}
.has-contact-reveal .contact__panel> *{
  opacity:0;
  transform:translateY(14px);
  transition:opacity .35s ease,transform .55s cubic-bezier(.16,1,.3,1);
}
.has-contact-reveal .contact.is-contact-visible .contact__panel{
  opacity:1;
  clip-path:inset(0 round var(--contact-panel-radius));
  transform:translateY(0);
}
.has-contact-reveal .contact.is-contact-visible .contact__panel> *{
  opacity:1;
  transform:translateY(0);
  transition-delay:.42s;
}
@media(max-width:767px){.contact h2{font-weight:200;text-shadow:0 0 10px rgba(0,0,0,.18)}.contact__cta{display:inline-flex;gap:16.5px;width:auto;text-shadow:0 0 10px rgba(0,0,0,.18)}.contact__cta-label{width:auto}.contact__arrow .ui-arrow{--ui-arrow-width:11.709px;--ui-arrow-height:7.088px}}

/* JOBS */
.job-card{
  display:block;
  background:rgba(255,255,255,.5);
  transition:background-color .35s ease,box-shadow .4s ease;
}
.job-card hr{
  height:1px;
  border:0;
  background-image:var(--gradient-button-background),linear-gradient(#bbb,#bbb);
  background-repeat:no-repeat;
  background-position:left center;
  background-size:0 100%,100% 100%;
  transition:background-size .45s cubic-bezier(.22,1,.36,1);
}
.job-card .more-link{transition:filter .35s ease}
@media(hover:hover) and (pointer:fine){
  .job-card:hover{
    background:#fff;
    box-shadow:0 8px 24px rgba(0,0,0,.14);
  }
  .job-card:hover hr{background-size:100% 100%,100% 100%}
  .job-card:hover .more-link{filter:saturate(1.25) brightness(.92)}
}
@media(min-width:768px){.job-card__place{margin-top:14.5px}.job-card>p:last-of-type{margin-top:17px}}
@media(max-width:767px){.jobs{padding:66px 0 86px}.jobs .section-title{font-size:50px;line-height:52px}.job-card{min-height:252px;padding:24px 32px;border-radius:18px}.job-card h3{font-size:16px;line-height:32px}.job-card hr{margin:7px 0 7px}.job-card__place{gap:11px;margin-top:12px;font-size:13px;line-height:26px}.job-card__pin{width:16px;height:20.013px;margin-top:2px}.job-card>p:last-of-type{margin-top:11px;font-size:14px;line-height:28px;letter-spacing:2px}.job-card .more{right:25px;bottom:26px;font-size:16px;line-height:35.758px;letter-spacing:0}}
@media(max-width:767px){.jobs__controls{grid-template-columns:95px 1fr 95px;gap:0;width:280.15px;height:40px;margin:38.881px auto 0}.jobs__controls button{position:relative;width:95px;height:40px;padding:0;border:1px solid #000;border-radius:20px;background:transparent}.jobs__controls button>span{position:absolute;top:50%;left:50%;width:9px;height:9px;border-top:1px solid #000;border-right:1px solid #000}.jobs__controls button:first-child>span{transform:translate(-35%,-50%) rotate(-135deg)}.jobs__controls button:last-child>span{transform:translate(-65%,-50%) rotate(45deg)}.jobs__controls p{font-family:var(--font-en);font-size:14px;font-weight:400;line-height:40px;text-align:center}}

@media(max-width:767px){.hero-story{height:1499px}.hero-story__headline{top:440.662px;left:18.957px}.hero-story__headline h1{font-size:29px;font-weight: 400;line-height:45px;letter-spacing:.055em}.hero-story__headline>p{margin-top:17.338px;padding-left:20px;font-size:11px;line-height:20px}.hero-story__scroll-arrow{top:12px;left:9.264px;font-size:10px;line-height:12px}.hero-story__body{top:624px;left:20.957px;width:min(294px,calc(100% - 40px));font-size:14px;line-height:36px}.hero-story__body p{margin:0}.hero-story__body .gradient-button{top:735.421px;left:77.043px;gap:8px;width:179px;min-width:179px;height:46px;margin:0;padding:0 10px;border-radius:4.917px;font-size:13px;letter-spacing:-.12em}.hero-story__art--products{top:601.582px;left:51.999vw;width:41.634vw}.hero-story__art--gifts{top:906.998px;left:61.0552vw;width:44.9024vw}.hero-story__art--kitchen{top:1152.515px;right:auto;bottom:auto;left:12.2373vw;width:75.5256vw}}

/* Tablet layout adjustments */
@media(min-width:768px) and (max-width:1199px){
  .business .section-title,
  .workstyle .section-title,
  .jobs .section-title,
  .interview .section-title{
    font-size:var(--top-section-title-size);
  }

  .business__lead{
    font-size:var(--top-lead-size);
  }

  .business__text{
    font-size:var(--top-body-size);
  }

  .work-card:nth-child(1)>p:last-of-type,
  .work-card:nth-child(2)>p:last-of-type,
  .work-card:nth-child(3)>p:last-of-type{
    left:0;
    width:100%;
    max-width:100%;
    overflow-wrap:anywhere;
  }

  .work-card:nth-child(1) .more,
  .work-card:nth-child(2) .more,
  .work-card:nth-child(3) .more{
    margin-left:auto;
  }
}

@media(min-width:900px) and (max-width:1199px){
  .business__layout{
    grid-template-columns:minmax(0,46fr) minmax(0,54fr);
    column-gap:clamp(24px,3vw,40px);
  }

  .business__visual{
    position:relative;
    top:auto;
    left:auto;
    grid-column:2;
    grid-row:1 / 6;
    align-self:center;
    justify-self:start;
    width:100%;
    max-width:560px;
  }

  .workstyle .section-title{
    font-size:clamp(46px,4.5vw,54px);
  }

  .workstyle__grid{
    gap:clamp(24px,3vw,44px);
  }

  .work-card h3,
  .work-card:nth-child(3) h3{
    font-size:var(--top-card-title-size);
  }

  .work-card>p:last-of-type{
    font-size:var(--top-body-size);
  }
}

@media(max-width:1023px){
  .hero-story__art--gifts{
    transform:translate(-30px,40px);
  }
}

@media(min-width:1024px) and (max-width:1439px){
  .workstyle .section-title{
    font-size:clamp(46px,calc(8.9vw - 45px),83px);
  }
}

/* PC: OUR BUSINESSを基準に、EASE OF WORKINGの左右要素を外側へ展開 */
@media(min-width:1024px){
  .page-top .workstyle{
    --workstyle-title-spread:clamp(0px,calc((100vw - 1228px) / 2),54px);
    --workstyle-card-spread:calc(var(--workstyle-title-spread) + 3px);
    overflow-x:clip;
  }

  .page-top .workstyle .section-title,
  .page-top .workstyle .section-label{
    translate:calc(-1 * var(--workstyle-title-spread)) 0;
  }

  .page-top .work-card:nth-child(1) .work-card__media,
  .page-top .work-card:nth-child(1) h3,
  .page-top .work-card:nth-child(1) .work-card__en,
  .page-top .work-card:nth-child(1)>p:last-of-type,
  .page-top .work-card:nth-child(1) .more{
    translate:calc(-1 * var(--workstyle-card-spread) + 10px) 0;
  }

  .page-top .work-card:nth-child(2) .work-card__media,
  .page-top .work-card:nth-child(2) h3,
  .page-top .work-card:nth-child(2) .work-card__en,
  .page-top .work-card:nth-child(2)>p:last-of-type,
  .page-top .work-card:nth-child(2) .more{
    translate:-30px 0;
  }

  .page-top .work-card:nth-child(3) .work-card__media,
  .page-top .work-card:nth-child(3) h3,
  .page-top .work-card:nth-child(3) .work-card__en,
  .page-top .work-card:nth-child(3)>p:last-of-type,
  .page-top .work-card:nth-child(3) .more{
    translate:calc(var(--workstyle-card-spread) - 70px) 0;
  }
}

/* Stronger, still fluid CONTACT CTA hover feedback. */
.page-top .contact__panel{
  position:relative;
  isolation:isolate;
}

.page-top .contact__panel::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(120deg,rgba(249,202,112,.42),rgba(240,134,150,.3) 48%,rgba(77,225,235,.4));
  mix-blend-mode:soft-light;
  opacity:0;
  transform:scale(.96);
  transition:opacity .45s ease,transform .65s cubic-bezier(.22,1,.36,1);
  pointer-events:none;
}

.page-top .contact__panel>h2,
.page-top .contact__panel>.contact__cta{
  position:relative;
  z-index:1;
  transform-origin:center;
  transition:opacity .35s ease,transform .55s cubic-bezier(.22,1,.36,1);
}

@media(hover:hover) and (pointer:fine){
  .page-top .contact__panel:hover{
    background-position:calc(50% + 14px) calc(50% - 8px);
    background-size:108% 108%;
    box-shadow:inset 0 0 34px rgba(255,255,255,.4);
  }

  .page-top .contact__panel:hover::before{
    opacity:.82;
    transform:scale(1.05);
  }

  .page-top .contact__panel:hover .contact__decoration:first-child{
    transform:translateX(-8px);
  }

  .page-top .contact__panel:hover .contact__decoration:last-child{
    transform:translateX(8px);
  }

  body.page-top .contact__panel:hover>h2,
  body.page-top .contact__panel:hover>.contact__cta{
    transform:scale(1.02);
  }
}

@media(min-width:768px) and (max-width:1023px){
  .interview__intro .interview-pc-break{
    display:none;
  }

  .business{
    height:auto;
    min-height:0;
    padding:72px 0 96px;
  }

  .business__layout{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    width:calc(100% - 48px);
  }

  .business .section-title,
  .business .section-label,
  .business__lead,
  .business__text,
  .business .gradient-button,
  .business__visual{
    grid-column:1;
  }

  .business__lead{
    grid-row:3;
    width:100%;
    max-width:none;
    margin-top:40px;
    font-size:clamp(25px,3.65vw,30px);
  }

  .business__visual{
    position:relative;
    inset:auto;
    grid-row:4;
    justify-self:center;
    width:clamp(390px,62vw,500px);
    margin-top:30px;
  }

  .business__text{
    grid-row:5;
    width:100%;
    max-width:none;
    margin-top:28px;
    font-size:clamp(15px,2vw,17px);
    line-height:2;
  }

  .business .gradient-button{
    grid-row:6;
    margin-top:28px;
  }

  .workstyle .section__inner{
    width:calc(100% - 48px);
  }

  .workstyle__grid{
    grid-template-columns:minmax(0,1fr);
    gap:72px;
    margin-top:48px;
  }

  .work-card{
    width:100%;
    margin-inline:auto;
  }

  .work-card__media,
  .work-card:nth-child(1) .work-card__media,
  .work-card:nth-child(2) .work-card__media,
  .work-card:nth-child(3) .work-card__media{
    width:clamp(390px,68vw,520px);
    max-width:100%;
    height:auto;
    margin-inline:auto;
  }

  .work-card h3,
  .work-card:nth-child(3) h3{
    margin-top:-30px;
    font-size:clamp(23px,3.1vw,27px);
  }

  .work-card__en{
    font-size:13px;
  }

  .work-card>p:last-of-type{
    font-size:clamp(15px,2vw,17px);
    line-height:2;
  }

  .workstyle__wide-photo{
    margin-top:80px;
  }

  .jobs__list{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .job-card>p:last-of-type{
    font-size:15px;
  }

  .interview__layout{
    display:block;
    width:calc(100% - 48px);
  }

  .interview__intro>p:not(.section-label),
  .interview__intro>p.interview__muted{
    width:100%;
    max-width:none;
  }

  .interview__button{
    position:static;
    left:auto;
    margin:32px auto 0;
  }

  .interview__list{
    width:100%;
    margin-top:58px;
  }

  .interview-card,
  .interview-card:last-child{
    grid-template-columns:minmax(220px,.8fr) minmax(0,1fr);
    column-gap:clamp(20px,3vw,32px);
    width:100%;
  }

  .interview-card img{
    justify-self:center;
    margin-left:0;
  }

  .interview-card:not(:last-child)::after{
    width:100%;
  }
}
@media(max-width:360px){.hero-story__body{overflow-wrap:anywhere}.hero-story__body .gradient-button{gap:6px;padding:0 8px;font-size:12px;letter-spacing:-.12em}}

/* Header and shared arrows */
.site-header__contact,.gradient-button,.contact__arrow{--ui-arrow-color:#fff}.site-header__nav-business{--ui-arrow-color:#111}.more{--ui-arrow-color:#f18d78}.more .ui-arrow{margin-bottom:0}
@media(max-width:767px){.site-header__contact{top:20px;right:19px;width:138px;height:41px;padding:0 5.62px 0 31px;border-radius:20.684px;background:linear-gradient(157.114deg,#94fbff 14.163%,#3f4fff 86.821%);box-shadow:0 1.246px 3.116px rgba(0,0,0,.15),0 0 5px rgba(255,255,255,.72),inset -.623px -.623px 2.493px rgba(255,255,255,.45),inset 1.246px 1.246px 2.493px rgba(255,255,255,.6);font-size:13px}.site-header__nav{top:89px;right:18.043px;width:150px}.site-header__nav ul{gap:12px}.site-header__nav li{font-size:12.5px;line-height:15px}.site-header__nav-business{font-size:14px!important;font-weight:600!important;line-height:22px!important}.site-header__nav-business a{gap:9px}.site-header__nav-business .ui-arrow{--ui-arrow-width:11.709px;--ui-arrow-height:7.088px}.ui-arrow-down{flex-basis:7.264px;inline-size:7.264px;block-size:12px}}

/* Footer compatibility overrides for the legacy compact mobile rule above. */
@media(max-width:767px){
  .site-footer__inner{width:auto;margin-right:18px;margin-left:18px;padding-top:50px}
  .site-footer__brand>p{margin-top:25px;font-size:12px}
  .site-footer .site-footer__nav{grid-template-columns:initial!important;gap:normal!important;margin-top:47px}
  .site-footer .site-footer__nav ul{gap:20px 28px}
  .site-footer .site-footer__nav a{font-size:16px}
  .site-footer__meta{position:static;margin-top:62px;padding:0;font-size:13px}
  .site-footer__slogan{top:625px;bottom:auto;left:10px;width:calc(100vw - 29px);font-size:30px;line-height:38px;letter-spacing:-1.461px;white-space:normal;text-box-trim:none;text-box-edge:auto}
}

@media(max-width:360px){
  .site-footer__inner{margin-right:16px;margin-left:16px}
  .site-footer .site-footer__nav ul{column-gap:18px}
  .site-footer .site-footer__nav a{font-size:14px}
}

/* TOP first view: Figma nodes 1000:538, 1000:683, 1354:1706, 1354:1796, 1354:1859 */
@media(min-width:768px){
  .site-header__logo{left:57px;width:165.193px}
  .site-header__nav{color:#000}
  .site-header__nav li:not(:first-child){transform:translateY(1.079px)}
  .site-header__nav-business{--ui-arrow-color:#000;color:#282828}
  .site-header__nav-business-pc{display:inline-flex;align-items:center;gap:12px}
}

@media(max-width:767px){
  .site-header__logo{top:23.562px;left:23.957px;width:118px}
  .page-top .site-header__contact{top:20px;right:19.043px;width:138px;height:41px;padding:0 5.62px 0 31px;font-size:12px}
  .site-header__nav{top:89px;right:18.043px;width:150px}
  .site-header__nav ul{gap:11.625px}
  .site-header__nav li:not(:first-child){transform:none}
  .site-header__nav-business{font-family:var(--font-en)!important;font-size:12.5px!important;font-weight:400!important;line-height:15px!important;text-transform:uppercase!important}
  .site-header__nav-business a{display:block}
  .site-header__nav-business-pc{display:none}
  .site-header__nav-business-sp{display:flex;flex-direction:column;align-items:flex-end;gap:11.625px}
}

/* TOP scroll guide: Figma nodes 1000:567-568, 1354:1722, 1354:1724 */
@media(min-width:768px){
  .hero-story__headline>p{font-size:18px;line-height:32.718px;letter-spacing:1.6359px}
  .hero-story__scroll-arrow{top:6px;left:3px}
}

@media(max-width:767px){
  .hero-story__headline>p{font-size:11px;line-height:20px;letter-spacing:1px}
  .hero-story__scroll-arrow{top:3.8px;left:2px}
}

/* TOP message CTA: Figma node 1000:437, styled from 1283:2752. */
@media(min-width:768px){
  .hero-story__body .gradient-button{
    border-radius:5.753px;
    background:linear-gradient(159.610055deg,#f9ca70 24.443%,#f08696 75.557%);
    box-shadow:0 .827px 5.787px rgba(0,0,0,.15),inset -.827px -.827px 1.653px rgba(255,255,255,.65),inset 1.653px 1.653px 2.48px #fff;
  }
}

.business-pc-break{display:none}

/* OUR BUSINESS: Figma nodes 1073:1735-1754 and 1354:1905-1908. */
@media(min-width:1101px){
  .business-pc-break{display:block}

  .business .section-title{
    font-size:83px;
    font-weight:200;
    line-height:100px;
    letter-spacing:0;
  }
  .business .section-label{
    margin-top:17px;
    margin-left:5px;
    padding-left:22px;
    font-size:18px;
    line-height:36px;
  }
  .business .section-label::before{top:11.267px}
  .business__lead{
    margin-top:52.762px;
    margin-left:5px;
    font-size:28px;
    font-weight:500;
    line-height:50px;
  }
  .business__text{
    margin-top:28.61px;
    margin-left:5px;
    font-size:16px;
    line-height:40.1px;
  }
  .business .gradient-button{
    width:207px;
    min-width:207px;
    height:54px;
    margin-top:52.761px;
    margin-left:5px;
    padding:0 18px 0 44px;
    gap:0;
    border-radius:5.753px;
    background:linear-gradient(159.610055deg,#f9ca70 24.443%,#f08696 75.557%);
    box-shadow:0 .827px 5.787px rgba(0,0,0,.15),inset -.827px -.827px 1.653px rgba(255,255,255,.65),inset 1.653px 1.653px 2.48px #fff;
    font-size:14px;
    line-height:1;
    letter-spacing:0;
  }
  .business__visual{
    top:169px;
    left:calc(50% - 75px);
    width:630px;
    max-width:none;
    aspect-ratio:1;
  }
}

/* OUR BUSINESS shared subtitle dot and mobile typography. */
.sp-break{display:none}

.business .section-label::before{
  top:14px;
  width:11px;
  height:11px;
  border-radius:9.256px;
  background:linear-gradient(125.062487deg,#f9ca70 24.443%,#f08696 75.557%);
  box-shadow:inset 1.029px 1.647px 3.294px rgba(255,255,255,.9);
}

@media(max-width:767px){
  .sp-break{display:block}

  .business{
    height:auto;
    min-height:clamp(820px,calc(1047px - 29.6vw),936px);
  }

  .business__lead{
    width:315.295px;
    max-width:100%;
    color:#000;
    font-family:var(--font-ja);
    font-size:20px;
    font-style:normal;
    font-weight:500;
    line-height:34px;
  }

  .business__text{
    width:336px;
    max-width:100%;
    color:#000;
    text-align:justify;
    font-family:var(--font-ja);
    font-size:14px;
    font-style:normal;
    font-weight:400;
    line-height:30px;
  }

  .business .gradient-button{
    width:179px;
    min-width:179px;
    height:46px;
    padding:0 18px 0 44px;
    gap:0;
    border-radius:5.753px;
    background:linear-gradient(159.610055deg,#f9ca70 24.443%,#f08696 75.557%);
    box-shadow:0 .827px 5.787px rgba(0,0,0,.15),inset -.827px -.827px 1.653px rgba(255,255,255,.65),inset 1.653px 1.653px 2.48px #fff;
    font-size:14px;
    line-height:1;
    letter-spacing:0;
  }

  .business .section-label::before{
    top:9.39px;
    width:8px;
    height:8px;
    border-radius:6.732px;
    box-shadow:inset .749px 1.198px 2.396px rgba(255,255,255,.9);
  }
}

/* Smoothly bridge the 375px SP composition to the 768px tablet layout. */
@media(min-width:376px) and (max-width:767px){
  .hero-story{
    height:clamp(1499px,calc(39.03vw + 1352.64px),1652px);
  }

  .site-header__logo{
    top:clamp(23.562px,calc(6.74vw - 1.72px),50px);
    left:clamp(23.957px,calc(8.42vw - 7.58px),57px);
    width:clamp(118px,calc(11.99vw + 73.04px),165.193px);
  }

  body.page-top .site-header__contact{
    top:clamp(20px,calc(4.34vw + 3.73px),37px);
    right:clamp(19.043px,calc(.244vw + 18.128px),20px);
    width:clamp(138px,calc(9.95vw + 100.69px),177px);
    height:clamp(41px,calc(4.59vw + 23.79px),59px);
    padding-right:clamp(5.62px,1.9vw,14.58px);
    padding-left:clamp(31px,calc(3.06vw + 19.53px),43px);
    border-radius:clamp(20.684px,3.84vw,29.5px);
    font-size:clamp(12px,calc(.765vw + 9.13px),15px);
  }

  body.page-top .site-header__contact .ui-arrow{
    top:clamp(17.092px,calc(2.27vw + 8.58px),26px);
    left:clamp(110.001px,calc(7.65vw + 81.31px),140px);
    width:clamp(11.21px,calc(.127vw + 10.734px),11.709px);
    height:clamp(6.787px,calc(.077vw + 6.498px),7.088px);
  }

  .site-header__nav{
    top:clamp(89px,calc(10.97vw + 47.86px),132px);
    right:clamp(18.043px,calc(9.95vw - 19.31px),57px);
    width:clamp(150px,calc(5.61vw + 128.96px),172px);
  }

  .site-header__nav ul{
    gap:clamp(11.625px,calc(1.63vw + 5.51px),18px);
  }

  .site-header__nav li,
  .site-header__nav-business{
    font-size:clamp(12.5px,calc(1.15vw + 8.19px),17px)!important;
  }

  .hero-story__headline{
    top:clamp(440.662px,calc(21.54vw + 359.89px),525.128px);
    left:clamp(18.957px,calc(12.76vw - 28.85px),69px);
  }

  .hero-story__headline h1{
    font-size:clamp(29px,calc(6.12vw + 6.05px),53px);
    line-height:clamp(45px,calc(8.42vw + 13.43px),78px);
  }

  .hero-story__headline>p{
    margin-top:clamp(17.338px,calc(2.18vw + 9.16px),25.872px);
    padding-left:clamp(20px,calc(3.9vw + 5.38px),35.276px);
    font-size:clamp(11px,calc(1.79vw + 4.29px),18px);
    line-height:clamp(20px,calc(3.24vw + 7.85px),32.718px);
  }

  .hero-story__body{
    top:clamp(624px,calc(60.97vw + 395.36px),863.407px);
    left:clamp(20.957px,calc(26.28vw - 77.59px),124px);
    width:clamp(294px,calc(51.02vw + 102.67px),494px);
    font-size:clamp(14px,calc(.255vw + 13.043px),15px);
    line-height:clamp(36px,calc(1.531vw + 30.258px),42px);
  }

  .hero-story__body .gradient-button{
    top:clamp(656.593px,calc(-20.15vw + 810.56px),735.421px);
    left:clamp(0px,calc(-19.64vw + 150.65px),77.043px);
    width:clamp(179px,calc(7.14vw + 152.2px),207px);
    min-width:0;
    height:clamp(46px,calc(2.04vw + 38.35px),54px);
    font-size:clamp(13px,calc(.255vw + 12.04px),14px);
  }

  .hero-story__art--products{
    top:clamp(601.582px,calc(81.63vw + 295.47px),921.547px);
    left:clamp(195px,calc(74.49vw - 84.34px),486.7px);
    width:clamp(145px,calc(-2.81vw + 166.54px),156px);
  }

  .hero-story__art--gifts{
    top:clamp(906.998px,calc(53.46vw + 706.5px),1116.552px);
    right:clamp(1px,calc(3.827vw - 13.351px),16px);
    left:auto;
    width:clamp(134.6px,calc(-8.62vw + 200.7px),168.4px);
  }

  .hero-story__art--kitchen{
    top:clamp(1152.515px,calc(60.78vw + 924.6px),1390.758px);
    right:auto;
    bottom:auto;
    left:clamp(45.9px,calc(120.2vw - 404.8px),517px);
    width:clamp(184.4px,calc(-25.2vw + 377.7px),283.2px);
  }
}

/* Wide phones have enough line length; avoid the abrupt mobile-only wraps at 768px. */
@media(min-width:541px) and (max-width:767px){
  .sp-break{display:none}
}

/* Keep the TOP contact control continuous across the shared 900px header breakpoint. */
@media(min-width:768px) and (max-width:900px){
  body.page-top .site-header__contact{
    top:37px;
    right:20px;
    width:177px;
    height:59px;
    padding:0 14.58px 0 43px;
    border-radius:29.5px;
    font-size:15px;
  }

  body.page-top .site-header__contact .ui-arrow{
    top:26px;
    left:140px;
    width:11.709px;
    height:7.088px;
  }
}

/* Hero copy and second illustration: tablet bridge without changing 375px/1440px. */
@media(min-width:768px) and (max-width:1023px){
  .hero-story__body{
    font-size:clamp(15px,calc(.392vw + 11.988px),16px);
    line-height:clamp(42px,calc(1.569vw + 29.949px),46px);
  }

  .hero-story__art--gifts{
    right:clamp(16px,3vw,31px);
    left:auto;
  }
}

@media(min-width:1024px) and (max-width:1439px){
  .hero-story__body{
    font-size:clamp(16px,calc(.721vw + 8.615px),19px);
    line-height:clamp(46px,calc(1.865vw + 26.902px),53.761px);
  }
}

/* TOP-wide responsive bridge. The 375px and 1440px reference layouts stay untouched. */
@media(min-width:376px) and (max-width:767px){
  .section__inner{
    width:calc(100% - clamp(40px,calc(2.041vw + 32.347px),48px));
  }

  .section-label{
    margin-top:clamp(18px,calc(1.531vw + 12.258px),24px);
    padding-left:clamp(18px,calc(1.531vw + 12.258px),24px);
    font-size:clamp(13px,calc(.765vw + 10.13px),16px);
  }

  .section-label::before{
    width:clamp(7px,calc(1.02vw + 3.173px),11px);
    height:clamp(7px,calc(1.02vw + 3.173px),11px);
  }

  .jobs{
    padding-top:clamp(66px,calc(4.592vw + 48.776px),84px);
    padding-bottom:clamp(86px,calc(1.02vw + 82.173px),90px);
  }

  .faq{
    padding-bottom:clamp(129px,calc(2.806vw + 118.48px),140px);
  }
}

@media(min-width:768px) and (max-width:1023px){
  .section__inner,
  .faq__inner{
    width:calc(100% - 48px);
  }

  .jobs{
    padding:clamp(84px,10vw,102px) 0 clamp(90px,10vw,110px);
  }

  .jobs__list{
    gap:clamp(18px,2.5vw,24px);
    margin-top:clamp(48px,6.5vw,64px);
  }

  .job-card{
    min-height:clamp(286px,32vw,316px);
    padding:clamp(26px,3.25vw,32px);
  }

  .job-card h3{
    font-size:clamp(18px,2.15vw,20px);
  }

  .job-card>p:last-of-type{
    font-size:clamp(14px,1.75vw,15px);
    line-height:clamp(28px,3.4vw,30px);
  }

  .faq{
    padding-bottom:clamp(140px,16vw,164px);
  }

  .faq__list{
    gap:clamp(14px,2vw,20px);
    margin-top:clamp(52px,7vw,70px);
  }

  .faq-item button{
    grid-template-columns:clamp(38px,5vw,46px) minmax(0,1fr) clamp(30px,4vw,40px);
    min-height:0;
    padding:clamp(29px,3.7vw,38px) clamp(20px,3.3vw,34px);
  }

  .faq-item h3{
    font-size:clamp(15px,1.85vw,18px);
  }

  .faq-answer{
    grid-template-columns:clamp(38px,5vw,46px) minmax(0,1fr);
    padding-right:clamp(32px,7vw,72px);
    padding-left:clamp(20px,3.3vw,34px);
  }
}

@media(min-width:1024px) and (max-width:1439px){
  .section__inner{
    width:min(1120px,calc(100% - clamp(40px,4vw,56px)));
  }

  .interview__layout{
    grid-template-columns:clamp(420px,41vw,500px) minmax(0,1fr);
    column-gap:clamp(24px,2.5vw,48px);
    width:min(1230px,calc(100% - clamp(40px,4vw,56px)));
  }

  .interview__list{
    width:100%;
  }

  .interview-card,
  .interview-card:last-child{
    grid-template-columns:281.835px minmax(0,1fr);
    column-gap:clamp(18px,2vw,28px);
    width:100%;
    height:auto;
    min-height:383px;
  }

  .interview-card:last-child{
    min-height:348px;
  }

  .interview-card:not(:last-child){
    padding-bottom:clamp(26px,3vw,38px);
  }

  .interview-card:not(:last-child)::after{
    width:100%;
  }

  .interview-card img{
    justify-self:center;
    width:281.835px;
    height:281.835px;
    margin-left:0;
  }

  .interview-card div>p:not(.interview-tag){
    width:min(274px,100%);
  }

  .interview-card .more{
    top:0;
    margin-right:0;
  }
}

/* Prevent the Figma-fixed OUR BUSINESS visual offset from overflowing at intermediate widths. */
@media(min-width:1024px){
  .business__layout{
    width:min(1228px,calc(100% - clamp(40px,4vw,56px)));
    grid-template-columns:minmax(0,46fr) minmax(0,54fr);
    column-gap:clamp(24px,3vw,40px);
  }

  .business__visual{
    position:relative;
    top:auto;
    left:auto;
    grid-row:3 / 6;
    align-self:center;
    width:min(100%,clamp(500px,calc(31.25vw + 180px),630px));
    max-width:630px;
  }
}

/* EASE OF WORKING liquid media: fluid inside each layout mode. */
@media(min-width:376px) and (max-width:767px){
  .business__lead,
  .business__text{
    width:100%;
    max-width:none;
  }

  .business__lead{
    font-size:clamp(20px,calc(1.0204vw + 16.1735px),24px);
    line-height:clamp(34px,calc(1.5306vw + 28.2602px),40px);
  }

  .business__text{
    text-align:left;
    font-size:clamp(14px,calc(.5102vw + 12.0867px),16px);
    line-height:clamp(30px,calc(1.5306vw + 24.2602px),36px);
  }

  .work-card:nth-child(1) .work-card__media,
  .work-card:nth-child(2) .work-card__media,
  .work-card:nth-child(3) .work-card__media{
    width:clamp(375px,calc(36.99vw + 236.288px),520px);
    max-width:none;
    margin-right:0;
    margin-left:50%;
    transform:translateX(-50%);
  }

  .work-card:nth-child(1) .work-card__media,
  .work-card:nth-child(2) .work-card__media{
    height:clamp(438px,calc(20.918vw + 359.568px),520px);
    aspect-ratio:auto;
  }

  .work-card:nth-child(3) .work-card__media{
    height:clamp(441px,calc(20.153vw + 365.426px),520px);
    aspect-ratio:auto;
  }

  .work-card h3,
  .work-card:nth-child(2) h3,
  .work-card:nth-child(3) h3{
    margin-top:clamp(-65px,calc(8.929vw - 98.482px),-30px);
  }
}

@media(min-width:768px) and (max-width:1023px){
  .work-card__media,
  .work-card:nth-child(1) .work-card__media,
  .work-card:nth-child(2) .work-card__media,
  .work-card:nth-child(3) .work-card__media{
    width:520px;
    max-width:100%;
    height:520px;
    aspect-ratio:1;
    margin-inline:auto;
    transform:none;
  }
}

/* Shared stacked liquid-mask size: OUR BUSINESS and all three work cards. */
@media(max-width:1023px){
  .page-top{
    --top-stacked-liquid-size:clamp(320px,calc(28.395vw + 229.518px),520px);
  }

  .business__visual,
  .work-card:nth-child(1) .work-card__media,
  .work-card:nth-child(2) .work-card__media,
  .work-card:nth-child(3) .work-card__media{
    width:min(var(--top-stacked-liquid-size),calc(100vw - 40px));
    height:auto;
    aspect-ratio:1;
  }
}

@media(min-width:376px) and (max-width:767px){
  .work-card h3,
  .work-card:nth-child(2) h3,
  .work-card:nth-child(3) h3{
    margin-top:clamp(18px,2.5vw,24px);
  }
}

@media(min-width:1024px) and (max-width:1439px){
  .work-card:nth-child(1) .work-card__media,
  .work-card:nth-child(2) .work-card__media{
    width:clamp(400px,calc(20.192vw + 193.234px),484px);
    height:auto;
    aspect-ratio:484 / 479;
  }

  .work-card:nth-child(3) .work-card__media{
    width:clamp(400px,calc(20.913vw + 185.889px),487px);
    height:auto;
    aspect-ratio:487 / 482;
  }

  .work-card:nth-child(1) .work-card__media{
    margin-left:calc(-77.692px - 1.202vw);
  }

  .work-card:nth-child(2) .work-card__media{
    margin-left:calc(-173.692px + 8.173vw);
  }

  .work-card:nth-child(3) .work-card__media{
    margin-left:calc(-200.585px + 10.799vw);
  }
}

/* 横並び時は1440px版のカード構成を同じ比率で縮小する */
@media(min-width:1024px) and (max-width:1439px){
  .page-top .workstyle{
    --workstyle-edge-gap:clamp(16px,1.25vw,18px);
    --workstyle-row-scale:clamp(.705,calc((50vw - var(--workstyle-edge-gap)) / 703.5px),1);
  }

  .page-top .workstyle__grid{
    width:1120px;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:81px;
    margin-top:-7px;
    margin-right:auto;
    margin-left:auto;
    zoom:var(--workstyle-row-scale);
  }

  .page-top .work-card:nth-child(1) .work-card__media{
    width:484px;
    height:479px;
    margin-left:-95px;
    translate:-47px 0;
  }

  .page-top .work-card:nth-child(2) .work-card__media{
    width:484px;
    height:479px;
    margin-left:-56px;
    translate:-30px 0;
  }

  .page-top .work-card:nth-child(3) .work-card__media{
    width:487px;
    height:482px;
    margin-left:-44px;
    translate:-13px 0;
  }

  .page-top .work-card h3,
  .page-top .work-card:nth-child(3) h3{
    margin-top:-37px;
    font-size:26px;
    line-height:52px;
  }

  .page-top .work-card:nth-child(3) h3{
    margin-top:-40px;
  }

  .page-top .work-card__en{
    margin-top:9px;
    font-size:13px;
    line-height:16px;
    letter-spacing:.154em;
  }

  .page-top .work-card:nth-child(1) h3,
  .page-top .work-card:nth-child(1) .work-card__en,
  .page-top .work-card:nth-child(1)>p:last-of-type,
  .page-top .work-card:nth-child(1) .more{
    translate:-47px 0;
  }

  .page-top .work-card:nth-child(2) h3,
  .page-top .work-card:nth-child(2) .work-card__en,
  .page-top .work-card:nth-child(2)>p:last-of-type,
  .page-top .work-card:nth-child(2) .more{
    translate:-30px 0;
  }

  .page-top .work-card:nth-child(3) h3,
  .page-top .work-card:nth-child(3) .work-card__en,
  .page-top .work-card:nth-child(3)>p:last-of-type,
  .page-top .work-card:nth-child(3) .more{
    translate:-13px 0;
  }

  .page-top .work-card:nth-child(1)>p:last-of-type,
  .page-top .work-card:nth-child(2)>p:last-of-type,
  .page-top .work-card:nth-child(3)>p:last-of-type{
    width:100%;
    max-width:100%;
    min-height:60px;
    margin-top:17px;
    overflow-wrap:normal;
    font-size:15px;
    line-height:30px;
    letter-spacing:1px;
  }

  .page-top .work-card .more{
    margin-top:13px;
    font-size:17.879px;
    line-height:35.758px;
  }

  .page-top .work-card:nth-child(1) .more{margin-left:234px}
  .page-top .work-card:nth-child(2) .more{margin-left:232px}
  .page-top .work-card:nth-child(3) .more{margin-left:223px}
}

/* 縦並び時もSP基準からタブレット上限まで滑らかに拡大する */
@media(min-width:376px) and (max-width:1023px){
  .page-top .work-card:nth-child(1) .work-card__media,
  .page-top .work-card:nth-child(2) .work-card__media,
  .page-top .work-card:nth-child(3) .work-card__media{
    width:min(var(--top-stacked-liquid-size),calc(100vw - 40px));
    height:auto;
    aspect-ratio:1;
  }

  .page-top .work-card:nth-child(1) .work-card__media,
  .page-top .work-card:nth-child(2) .work-card__media{
    height:auto;
  }

  .page-top .work-card:nth-child(3) .work-card__media{
    height:auto;
  }

  .page-top .work-card h3,
  .page-top .work-card:nth-child(2) h3,
  .page-top .work-card:nth-child(3) h3{
    margin-top:clamp(18px,2.5vw,24px);
    font-size:clamp(20px,calc(1.08vw + 15.949px),27px);
    line-height:clamp(40px,calc(1.852vw + 33.056px),52px);
  }

  .page-top .work-card__en{
    margin-top:clamp(2px,calc(1.08vw - 2.05px),9px);
    font-size:clamp(11px,calc(.309vw + 9.843px),13px);
    line-height:clamp(13px,calc(.463vw + 11.264px),16px);
  }

  .page-top .work-card>p:last-of-type{
    min-height:0;
    margin-top:clamp(12px,calc(.772vw + 9.106px),17px);
    font-size:clamp(14px,calc(.463vw + 12.264px),17px);
    line-height:clamp(28px,calc(.926vw + 24.528px),34px);
  }

  .page-top .work-card .more{
    margin-top:clamp(10px,calc(.463vw + 8.264px),13px);
    font-size:clamp(16px,calc(.29vw + 14.913px),17.879px);
    line-height:clamp(35.758px,calc(36.14px - .0373vw),36px);
  }

  .page-top .work-card:nth-child(1) h3,
  .page-top .work-card:nth-child(1) .work-card__en,
  .page-top .work-card:nth-child(1)>p:last-of-type{
    left:clamp(0px,calc(.463vw - 1.736px),3px);
  }

  .page-top .work-card:nth-child(2) h3,
  .page-top .work-card:nth-child(2) .work-card__en{
    left:clamp(0px,calc(.617vw - 2.315px),4px);
  }

  .page-top .work-card:nth-child(2)>p:last-of-type{
    left:clamp(0px,calc(.154vw - .579px),1px);
  }

  .page-top .work-card:nth-child(3) h3,
  .page-top .work-card:nth-child(3) .work-card__en,
  .page-top .work-card:nth-child(3)>p:last-of-type{
    left:clamp(-1px,calc(.579px - .154vw),0px);
  }
}

/* PC横並び: マスク中心を基準にカード内の全要素を一体で配置する */
@media(min-width:1024px){
  .page-top .work-card{
    translate:var(--work-card-shift-x,0) var(--work-card-shift-y,0);
  }

  .page-top .work-card:nth-child(1){
    --work-card-shift-x:-47px;
    --work-card-shift-y:0px;
  }

  .page-top .work-card:nth-child(2){
    --work-card-shift-x:-26.328px;
    --work-card-shift-y:0px;
  }

  .page-top .work-card:nth-child(3){
    --work-card-shift-x:19.836px;
    --work-card-shift-y:-1.5px;
  }

  .page-top .work-card .work-card__media,
  .page-top .work-card h3,
  .page-top .work-card .work-card__en,
  .page-top .work-card>p:last-of-type,
  .page-top .work-card .more{
    translate:none !important;
  }

  .page-top .work-card:nth-child(1) h3,
  .page-top .work-card:nth-child(1) .work-card__en,
  .page-top .work-card:nth-child(1)>p:last-of-type{
    left:-33px;
  }

  .page-top .work-card:nth-child(2) h3,
  .page-top .work-card:nth-child(2) .work-card__en,
  .page-top .work-card:nth-child(2)>p:last-of-type{
    left:6px;
  }

  .page-top .work-card:nth-child(3) h3,
  .page-top .work-card:nth-child(3) .work-card__en,
  .page-top .work-card:nth-child(3)>p:last-of-type{
    left:19.5px;
  }

  .page-top .work-card:nth-child(1)>p:last-of-type,
  .page-top .work-card:nth-child(2)>p:last-of-type,
  .page-top .work-card:nth-child(3)>p:last-of-type{
    width:360px;
    max-width:none;
  }
}

/* Stacked work cards: let each MA reserve its own space and stay centered. */
@media(max-width:1023px){
  .page-top .workstyle{
    --stacked-ma-space-before:clamp(20px,calc(1.543vw + 14.214px),30px);
    --stacked-ma-space-after:clamp(18px,calc(1.543vw + 12.214px),28px);
  }

  .page-top .workstyle__grid{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    row-gap:0;
    margin-top:var(--stacked-ma-space-before);
  }

  .page-top .work-card{
    display:flex;
    flex-direction:column;
    min-width:0;
    margin-bottom:0;
  }

  .page-top .work-card + .work-card{
    margin-top:var(--stacked-ma-space-before);
  }

  .page-top .work-card:nth-child(1) .work-card__media,
  .page-top .work-card:nth-child(2) .work-card__media,
  .page-top .work-card:nth-child(3) .work-card__media{
    flex:none;
    margin-top:0;
    margin-right:auto;
    margin-bottom:0;
    margin-left:auto;
    transform:none;
    translate:none;
  }

  .page-top .work-card h3,
  .page-top .work-card:nth-child(2) h3,
  .page-top .work-card:nth-child(3) h3{
    margin-top:var(--stacked-ma-space-after);
  }
}

/* Keep the stacked interview CTA after the illustration list. */
@media(max-width:1023px){
  .interview__layout{
    display:flex;
    flex-direction:column;
  }

  .interview__intro{
    display:contents;
  }

  .interview__list{
    order:1;
  }

  .interview__button{
    order:2;
  }
}

/*
 * TOP section rhythm
 * Keep the 375px / 1440px reference spacing as the endpoints and bridge every
 * section boundary continuously between them. Each boundary has one owner so
 * adjacent padding does not accidentally create a doubled gap.
 */
.page-top{
  --top-space-business-start:clamp(10px,calc(8.451vw - 21.691px),100px);
  --top-space-business-end:clamp(40px,calc(5.634vw + 18.873px),100px);
  --top-space-workstyle-photo:clamp(67px,calc(7.23vw + 39.888px),144px);
  --top-space-photo-jobs:clamp(66px,calc(6.948vw + 39.945px),140px);
  --top-space-jobs-faq:clamp(86px,calc(3.192vw + 74.028px),120px);
  --top-space-faq-interview:clamp(82px,calc(145.549px - 4.413vw),129px);
  --top-space-interview-start:clamp(10px,calc(9.859vw - 26.972px),115px);
  --top-space-interview-contact:clamp(64px,calc(70.22px - .432vw),68.6px);
  --top-space-contact-footer:clamp(34px,calc(2.817vw + 23.437px),64px);
}

.page-top .business{
  padding-top:var(--top-space-business-start);
  padding-bottom:var(--top-space-business-end);
}

.page-top .workstyle__wide-photo{
  margin-top:var(--top-space-workstyle-photo);
}

.page-top .jobs{
  padding-top:var(--top-space-photo-jobs);
  padding-bottom:var(--top-space-jobs-faq);
}

.page-top .faq{
  padding-top:0;
  padding-bottom:var(--top-space-faq-interview);
}

.page-top .interview{
  padding-top:var(--top-space-interview-start);
  padding-bottom:var(--top-space-interview-contact);
}

.page-top .contact{
  padding-top:0;
  padding-bottom:var(--top-space-contact-footer);
}

/* Keep the TOP navigation aligned with the fixed CONTACT control. */
body.page-top .site-header__nav{
  right:var(--fixed-header-control-right);
}

/*
 * PC INTERVIEW: pin the complete left column while only the interview cards
 * continue scrolling. 122px matches the visible top edge of the MESSAGE page
 * title (125px positioning with its shared -3px title transform).
 */
@media(min-width:1024px){
  .page-top .interview__intro{
    --interview-title-align-shift:clamp(
      0px,
      calc(
        max(var(--page-inline-gutter),calc((100vw - 1120px) / 2))
        - max(var(--page-inline-gutter),calc((100vw - 1230px) / 2))
      ),
      55px
    );
    position:sticky;
    z-index:1;
    top:122px;
    align-self:start;
    translate:var(--interview-title-align-shift) 0;
  }

  .page-top .interview__button{
    position:static;
    margin:56px 0 0 7px;
  }
}

/* Shared title-to-card spacing for TOP JOBS and FAQ. */
.page-top .jobs__list,
.page-top .faq__list{
  margin-top:clamp(33px,calc(22.604px + 2.772vw),50.964px);
}

@media(max-width:767px){
  .page-top .business__lead,
  .page-top .interview__intro>p:not(.section-label):not(.interview__muted){
    margin-top:35px;
  }
}

@media(max-width:768px){
  .page-top .faq__inner{
    display:flex;
    flex-direction:column;
  }

  .page-top .faq__heading{
    display:contents;
  }

  .page-top .faq__list{
    order:1;
  }

  .page-top .faq__list-button{
    position:static;
    order:2;
    margin:51px auto 0;
  }
}
/* FAQ accordion motion is handled entirely by CSS; JS only toggles is-open. */
.page-top .faq-answer{
  --faq-answer-open-padding:30px;
  interpolate-size:allow-keywords;
  height:0;
  padding-bottom:0;
  overflow:clip;
  visibility:hidden;
  opacity:0;
  transition:
    height .2s cubic-bezier(.45,0,.55,1),
    padding-bottom .2s cubic-bezier(.45,0,.55,1),
    opacity .2s ease,
    visibility 0s linear .2s;
}

.page-top .faq-item.is-open .faq-answer{
  height:auto;
  padding-bottom:var(--faq-answer-open-padding);
  visibility:visible;
  opacity:1;
  transition-delay:0s;
}

@media(max-width:767px){
  .page-top .faq-answer{
    --faq-answer-open-padding:20px;
  }
}

/* Shared divider color. */
.page-top .interview-card:not(:last-child)::after{border-bottom-color:#c9c9c9}

/* The full-height source photo supplies the overscan behind the Figma-sized crop. */
.page-top .workstyle__wide-photo{width:100vw;height:600px;aspect-ratio:auto;--wide-photo-parallax-y:0px;}
.page-top .workstyle__wide-photo-image{position:absolute;top:50%;left:50%;width:100%;height:calc(100% + 220px);max-width:none;object-fit:cover;object-position:center;transform:translate3d(-50%,calc(-50% + var(--wide-photo-parallax-y)),0);}
.page-top .workstyle__wide-photo.is-parallax-active .workstyle__wide-photo-image{will-change:transform;}
@media(max-width:767px){.page-top .workstyle__wide-photo{height:300px;}.page-top .workstyle__wide-photo-image{height:calc(100% + 56px);}}

/* Hide reveal targets from the first paint, before the scroll observer runs. */
html.visual-reveal-ready .page-top :is(
  .hero-story__art img,
  .business__visual,
  .workstyle__grid > .work-card,
  .jobs__list > :is(article,li,a),
  .interview__list > :is(article,li,a)
):not(.is-visual-revealed){opacity:0!important;filter:blur(10px)!important;}

/* Local white haze behind each illustration; the animated background stays intact. */
.hero-story__art{
  isolation:isolate;
  pointer-events:none;
}
.hero-story__art::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-45%;
  /* Offset soft lobes form an uneven, wave-like silhouette. */
  background:
    radial-gradient(ellipse 38% 27% at 30% 40%,
      rgba(255,255,255,.94) 15%,rgba(255,255,255,.65) 42%,rgba(255,255,255,0) 100%),
    radial-gradient(ellipse 32% 39% at 57% 34%,
      rgba(255,255,255,.96) 18%,rgba(255,255,255,.6) 48%,rgba(255,255,255,0) 100%),
    radial-gradient(ellipse 35% 27% at 72% 58%,
      rgba(255,255,255,.92) 12%,rgba(255,255,255,.6) 42%,rgba(255,255,255,0) 100%),
    radial-gradient(ellipse 31% 28% at 39% 68%,
      rgba(255,255,255,.9) 10%,rgba(255,255,255,.55) 42%,rgba(255,255,255,0) 100%),
    radial-gradient(ellipse 32% 30% at 50% 51%,
      rgba(255,255,255,.98) 15%,rgba(255,255,255,0) 100%);
  filter:blur(6px);
  transform:rotate(-9deg);
}
.hero-story__art--gifts::before{
  transform:rotate(16deg) scaleX(-1);
}
.hero-story__art--kitchen::before{
  transform:rotate(-17deg) scaleY(-1);
}
.hero-story__art img{
  display:block;
  width:100%;
  height:auto;
}

/* 人物・掲載順によらず、同じ画像枠と中央配置を使う。 */
.interview-card img{justify-self:center;margin-left:auto;margin-right:auto;transform:none}

/* PCの導入文は最長の一文も句点まで同じ行に収める。 */
@media(min-width:1024px){
  .hero-story__body{width:550px}
}

/* ぼかしはセクション下端を越えて自然に消す。横方向だけをクリップする。 */
.hero-story{overflow-x:clip;overflow-y:visible}
/* スマホの導入文は文字を縮小せず、指定した位置で改行する。 */
.hero-story__break-sp{display:none}
@media(max-width:767px){
  .hero-story__break-sp{display:initial}
}

/* スマホでは本文の高さに続けてイラストとボタンを配置する。 */
.hero-story__art--kitchen-sp{display:none}
@media(max-width:767px){
  .hero-story{
    height:auto;
    min-height:0;
    padding-top:clamp(624px,calc(60.97vw + 395.36px),863.407px);
    padding-bottom:90px;
  }
  .hero-story__body{
    --hero-story-body-left:clamp(20.957px,calc(26.28vw - 77.59px),124px);
    position:relative;
    top:auto;
    left:auto;
    margin-left:var(--hero-story-body-left);
  }
  .hero-story__art--gifts{
    width:45vw;
    right:-5vw;
    left:auto;
  }
  .hero-story__art--kitchen{display:none}
  .hero-story__art--kitchen-sp{
    display:block;
    position:relative;
    left:calc(50vw - var(--hero-story-body-left) - 50%);
    width:75.5vw;
    margin:40px calc(50% - 37.75vw) 0;
  }
  .hero-story__art--kitchen-sp::before{transform:rotate(-17deg) scaleY(-1)}
  .hero-story__body .gradient-button{
    position:relative;
    top:auto;
    left:calc(50vw - var(--hero-story-body-left) - 50%);
    margin:24px auto 0;
  }
}