/* Corporate root = 10px; recruitment root = 16px. Keep each design in rem. */
body.corporate-header > header {
  top: 1.2rem; width: calc(100% - 2.4rem); min-height: 7.7rem;
  padding: 1.2rem 2.4rem; gap: 2.4rem; border: 0; border-radius: 100rem;
  background: rgb(255 255 255 / 75%);
  backdrop-filter: blur(1.6rem); -webkit-backdrop-filter: blur(1.6rem);
  transition: top .35s ease, background-color .35s ease, color .35s ease, box-shadow .35s ease;
}
body.corporate-header.is-header-hero:not(.menu-open) > header {top:3rem}
body.corporate-header > header .head-logo {position:relative;flex:0 0 30rem;min-width:0;isolation:isolate}
body.corporate-header > header .head-logo img {width:30rem;height:auto;max-height:none;filter:none}
body.corporate-header > header .head-logo::before {
  content:"";position:absolute;z-index:-1;left:-3.6rem;right:-2.4rem;top:50%;height:7.7rem;
  transform:translateY(-50%);border-radius:0 100rem 100rem 0;background:rgb(255 255 255 / 75%);
  backdrop-filter:blur(1.6rem);-webkit-backdrop-filter:blur(1.6rem);opacity:0;transition:opacity .35s ease;
}
body.corporate-header.is-header-hero:not(.menu-open) > header .head-logo::before {opacity:1}
body.corporate-header > header .head-nav {min-width:0}
body.corporate-header > header .head-nav-wrap {gap:1.6rem}
body.corporate-header .head-nav :is(.nav-item,.nav-btn-item,.nav-cta,.nav-box,.nav-box-wrap) :is(.en,.ja),
body.corporate-header .head-nav :is(.nav-box,.nav-box-wrap) a {font-size:1.8rem;font-weight:700}
body.corporate-header > header .head-nav .nav-cta {min-width:14rem}
body.corporate-header > header .head-nav .hover-switch {padding-inline:1.2rem;min-width:0}
body.corporate-header > header .head-nav .has-submenu > .nav-item {padding-right:2.8rem}
body.corporate-header .sns-link-wrap a {background:#fff}
body.corporate-header .sns-link-wrap img {filter:none!important}
body.corporate-header .head-nav .sns-link-wrap {gap:.8rem}
body.corporate-header .head-nav .sns-link-wrap a {width:4.8rem;height:4.8rem;flex:0 0 4.8rem;border:.1rem solid rgb(16 18 20 / 18%)}
/* Match the logo glass in the hero; use the shared header glass after scrolling. */
body.corporate-header > header .sns-link-wrap a {
 background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;
 transition:background-color .35s ease;
}
body.corporate-header.is-header-hero:not(.menu-open) > header .sns-link-wrap a {
 background:rgb(255 255 255 / 75%);
 backdrop-filter:blur(1.6rem);-webkit-backdrop-filter:blur(1.6rem);
}
body.corporate-header .head-nav .sns-link-wrap img {width:3.4rem;height:3.4rem;max-width:none;max-height:none;object-fit:contain}
body.corporate-header .fot-nav .sns-link-wrap img {width:2.6rem;height:2.6rem;max-width:none;max-height:none;object-fit:contain}
@media(min-width:48em) and (max-width:74.9375em){
 body.corporate-header > header{flex-wrap:wrap;gap:.8rem 1.6rem;padding:1.2rem 2.4rem;border-radius:7rem}
 body.corporate-header > header .head-nav{flex-basis:100%}
 body.corporate-header > header .head-nav-wrap{justify-content:space-between;gap:.8rem}
 body.corporate-header > header .head-nav .nav-cta{min-width:12rem;padding-inline:.8rem}
 body.corporate-header > header .head-logo::before{height:6rem}
 body.corporate-header:not(#top) .mv{padding-top:18rem}
}
@media(max-width:47.9375em){
 body.corporate-header > header{left:1.2rem;min-height:6.4rem;padding:.8rem 1.6rem;gap:1.2rem}
 body.corporate-header.is-header-hero:not(.menu-open) > header{top:1.6rem}
 body.corporate-header > header .head-logo{flex:0 1 30rem;max-width:calc(100% - 5.2rem)}
 body.corporate-header > header .head-logo img{width:100%}
 body.corporate-header > header .head-logo::before{left:-2.8rem;right:-1.2rem;height:6.4rem}
 body.corporate-header > header .menu-toggle{flex:0 0 4rem;border-radius:50%}
}
/* The recruitment header uses one coherent grid instead of competing flex wraps. */
body.recruit-site > header.header {
 display:grid;grid-template-columns:20.3125rem minmax(0,1fr) auto;align-items:center;
 height:6.25rem;min-height:0;gap:1.25rem;padding:0 0 0 2rem;flex-wrap:nowrap;
 position:sticky;top:var(--recruit-admin-offset,0);z-index:200;
}
body.recruit-site > .header .brand{width:20.3125rem;min-width:0;margin:0;grid-column:1;grid-row:1}
body.recruit-site > .header .brand img{width:100%;height:auto}
body.recruit-site > .header .desktop-nav {
 display:flex;position:static;order:initial;justify-content:center;gap:1rem;margin:0;padding:0;
 font-size:1.125rem;font-weight:700;letter-spacing:0;grid-column:2;grid-row:1;
}
body.recruit-site > .header .desktop-nav a,
body.recruit-site > .header .header-actions a{font-weight:700}
body.recruit-site > .header .header-actions{height:auto;grid-column:3;grid-row:1;align-self:stretch}
body.recruit-site > .header .header-actions a{width:6.25rem;font-size:1.125rem;letter-spacing:.03em}
body.recruit-site > .header .menu-toggle{display:none}
@media(min-width:53.1875em) and (max-width:79.9375em){
 body.recruit-site > header.header{grid-template-columns:minmax(0,1fr) auto;height:auto;gap:0;padding-left:1.5rem}
 body.recruit-site > .header .brand{margin-block:1rem}
 body.recruit-site > .header .header-actions{grid-column:2;height:5rem}
 body.recruit-site > .header .desktop-nav{grid-column:1/-1;grid-row:2;padding:.75rem 1.5rem .75rem 0;gap:1.5rem}
}
@media(max-width:53.125em){
 body.recruit-site > header.header{grid-template-columns:minmax(0,1fr) auto auto;height:4.875rem;padding-left:1rem;gap:.75rem}
 body.recruit-site > .header .brand{width:100%;max-width:20.3125rem;margin:0}
 body.recruit-site > .header .header-actions{grid-column:2;grid-row:1;height:100%}
 body.recruit-site > .header .header-actions a{width:4.6875rem;font-size:1rem}
 body.recruit-site > .header .menu-toggle{display:block;grid-column:3;grid-row:1;width:3rem;padding:0}
 body.recruit-site > .header .desktop-nav{display:none}
 body.recruit-site > .header .desktop-nav.is-open{
  display:flex;position:absolute;top:100%;left:0;right:0;padding:1.375rem 1.625rem 1.875rem;
  margin:0;gap:0;flex-direction:column;align-items:stretch;justify-content:flex-start;
  max-height:calc(100dvh - 4.875rem - var(--recruit-admin-offset,0rem));overflow-y:auto;background:#fff;
 }
}
@media(max-width:33.75em){
 body.recruit-site > header.header{height:4.5rem;padding-left:.875rem;gap:.5rem}
 body.recruit-site > .header .header-actions .recruit-link{display:none}
 body.recruit-site > .header .header-actions a{width:4.375rem}
}
@media(prefers-reduced-motion:reduce){
 body.corporate-header > header,body.corporate-header > header .head-logo::before,body.corporate-header > header .sns-link-wrap a{transition:none}
}

@media (min-width:48em) and (max-width:82.4375em){
body.corporate-header .head-nav {
    position: fixed !important;
    inset: 0 !important;
    z-index: 1050 !important;
    width: 100vw !important;
    height: 100dvh !important;
    padding: var(--s5) var(--s3) 9.6rem !important;
    display: block !important;
    overflow-y: auto;
    color: #fff;
    background: rgba(3, 8, 13, .985) !important;
    transform: translateY(100%) !important;
    transition: transform .4s cubic-bezier(.22, .8, .24, 1);
}

body.corporate-header .head-nav.is-open { transform: translateY(0) !important; }

body.corporate-header .head-nav-wrap {
    width: 100%;
    min-height: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: var(--s3);
}

body.corporate-header .head-nav .nav,
body.corporate-header .head-nav .btn-nav { display: flex; flex-direction: column; gap: var(--s1); }

body.corporate-header .head-nav .nav > li,
body.corporate-header .head-nav .btn-nav > li { width: 100%; }

body.corporate-header .head-nav .nav-item {
    width: 100%;
    min-height: 5.6rem;
    padding: var(--s1) 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, .14);
}

/* SPではhover切替を使わず英語＋日本語を両方表示 */
body.corporate-header .head-nav .hover-switch { display: flex !important; flex-direction: column; align-items: flex-start; overflow: visible; }

body.corporate-header .head-nav .hover-switch > .en,
body.corporate-header .head-nav .hover-switch > .ja { opacity: 1 !important; transform: none !important; }

body.corporate-header .head-nav .nav-item .en { font-family: var(--font-en); font-size: 1.8rem; font-weight: 600; }

body.corporate-header .head-nav .nav-item .ja { margin-top: .4rem; color: rgba(255, 255, 255, .62); font-size: 1.8rem; font-weight: 500; }

/* Submenu indicator */
body.corporate-header .head-nav .nav > li.has-submenu > .nav-item {
    position: relative;
    padding-right: var(--s4);
}

body.corporate-header .head-nav .nav > li.has-submenu > .nav-item::after {
    content: "›";
    position: absolute;
    right: .4rem;
    top: 50%;
    color: rgba(255, 255, 255, .58);
    font-family: var(--font-en);
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1;
    transform: translateY(-50%) rotate(-90deg);
}

/* SPではCompany / Blogのサブメニューも常時表示 */
body.corporate-header .head-nav .nav-box,
body.corporate-header .head-nav .nav > li > .nav-box-wrap {
    position: static;
    width: 100%;
    margin: 0;
    padding: var(--s1) 0 var(--s2);
    display: block;
    opacity: 1;
    visibility: visible;
    color: #fff;
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .14);
    border-radius: 0;
    transform: none;
}

body.corporate-header .head-nav .nav-box-wrap {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .8rem 1.6rem;
}

body.corporate-header .head-nav .nav-box-wrap li { margin: 0 !important; }

body.corporate-header .head-nav .nav-box-wrap a {
    position: relative;
    padding-left: 1.2rem;
    display: block;
    color: rgba(255, 255, 255, .68);
    font-size: 1.6rem;
    line-height: 1.6;
}

body.corporate-header .head-nav .nav-box-wrap a::before {
    content: "-";
    position: absolute;
    left: 0;
    top: 0;
    color: rgba(255, 255, 255, .34);
}


/* Recruit / Contact */
body.corporate-header .head-nav .btn-nav { gap: var(--s1); }

body.corporate-header .head-nav .nav-cta {
    min-height: 5.6rem;
    padding: var(--s1) var(--s2);
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    align-items: center;
    gap: var(--s2);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .42);
    border-radius: var(--pill);
}

body.corporate-header .nav-btn-icon { font-size: 2rem; }

body.corporate-header .nav-btn-copy { display: flex; align-items: center; gap: var(--s2); }

body.corporate-header .nav-btn-copy > .en { font-family: var(--font-en); font-size: 1.8rem; font-weight: 600; }

body.corporate-header .nav-btn-copy > .ja { color: rgba(255, 255, 255, .68); font-size: 1.8rem; font-weight: 700; }

/* SNS */
body.corporate-header .head-nav .sns-link-wrap { display: flex; gap: var(--s1); margin-top: var(--s1); }

body.corporate-header .head-nav .sns-link-wrap a { width: 3.2rem; height: 3.2rem; display: grid; place-items: center; overflow: hidden; background: #111; border-radius: 50%; }

body.corporate-header .head-nav .sns-link-wrap img { width: 1.8rem; max-height: 1.8rem; }


}
/* Flow header first; one fixed instance enters after the hero, without cloning links. */
body.corporate-header {--header-x:-50%;--site-header-height:7.7rem}
body.recruit-site {--header-x:0%;--site-header-height:6.25rem}
.site-header-spacer{height:0;pointer-events:none}
body.recruit-site.is-header-fixed > .site-header-spacer{height:var(--site-header-height)}
body.corporate-header > header,
body.recruit-site > header.header {
 position:relative!important;bottom:auto;z-index:1100;margin-top:0!important;
 transform:translate(var(--header-x),0)!important;
 opacity:1!important;visibility:visible!important;pointer-events:auto!important;
 transition:none;
}
body.corporate-header > header {
 left:50%;top:3rem!important;margin-bottom:calc(-1 * var(--site-header-height));
 flex-wrap:nowrap;min-height:7.7rem;border-radius:100rem;
}
body.recruit-site > header.header{top:0!important;left:0}
body.corporate-header.is-header-fixed > header,
body.recruit-site.is-header-fixed > header.header {
 position:fixed!important;top:calc(var(--header-admin-offset,0rem) + 1.2rem)!important;
 margin-bottom:0;
 transform:translate(var(--header-x),calc(-100% - 5rem - var(--header-admin-offset,0rem)))!important;
 opacity:1!important;visibility:hidden!important;pointer-events:none!important;
 transition:transform .5s cubic-bezier(.22,.8,.24,1),visibility .5s;
}
body.recruit-site.is-header-fixed > header.header{top:var(--header-admin-offset,0rem)!important;width:100%}
body.corporate-header.is-header-fixed.is-header-visible > header,
body.recruit-site.is-header-fixed.is-header-visible > header.header {
 transform:translate(var(--header-x),0)!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;
}
@media(max-width:82.4375em){
 body.corporate-header > header{height:6.4rem;min-height:6.4rem;padding:0 0 0 1.6rem;gap:1.2rem;top:1.6rem!important}
 body.corporate-header.is-header-fixed > header{top:calc(var(--header-admin-offset,0rem) + 1.2rem)!important}
 body.corporate-header > header .head-logo{flex:0 1 30rem;max-width:calc(100% - 7.6rem)}
 body.corporate-header > header .head-logo img{width:100%}
 body.corporate-header > header .head-logo::before{left:-2.8rem;right:-1.2rem;height:6.4rem}
 body.corporate-header > header .menu-toggle {
  display:grid;place-items:center;align-self:stretch;flex:0 0 6.4rem;width:6.4rem;height:100%;
  margin-left:auto;border-radius:100rem;background:transparent!important;color:inherit;position:relative;z-index:1;
 }
 body.corporate-header.is-header-hero:not(.menu-open) > header .menu-toggle{
  background:rgb(255 255 255 / 75%)!important;color:#101214;backdrop-filter:blur(1.6rem);-webkit-backdrop-filter:blur(1.6rem);
 }
 body.corporate-header > header .menu-toggle .material-symbols-rounded{font-size:2.4rem}
 body.corporate-header .head-nav{padding-top:11rem!important}
 body.corporate-header .head-nav:not(.is-open){visibility:hidden}
 body.corporate-header .head-nav.is-open{visibility:visible}
 body.corporate-header .head-nav :is(.nav,.btn-nav){width:100%}
 body.corporate-header .head-nav .nav-box::after{display:none}
 body.corporate-header .head-nav .nav-btn-copy > :is(.en,.ja){opacity:1;transform:none}
 body.corporate-header .head-nav .nav-box{pointer-events:auto}
 body.corporate-header .head-nav .sns-link-wrap a{background:#fff;width:4.8rem;height:4.8rem}
 body.corporate-header .head-nav .sns-link-wrap img{width:3.4rem;height:3.4rem;max-height:none}
 body.corporate-header:not(#top) .mv{padding-top:10rem}
}
@media(max-width:79.9375em){ body.recruit-site > header.header{grid-template-columns:minmax(0,1fr) auto auto;height:4.875rem;padding-left:1rem;gap:0}
 body.recruit-site > .header .brand{width:100%;max-width:20.3125rem;margin:0;padding-right:.75rem}
 body.recruit-site > .header .header-actions{grid-column:2;grid-row:1;height:100%}
 body.recruit-site > .header .header-actions a{width:4.6875rem;font-size:1rem}
 body.recruit-site > .header .menu-toggle{display:block;grid-column:3;grid-row:1;width:4.875rem;height:100%;padding:0;align-self:stretch;background:transparent;border:0;color:var(--green)}
 body.recruit-site > .header .desktop-nav{display:none}
 body.recruit-site > .header .desktop-nav.is-open{
  display:flex;position:absolute;top:100%;left:0;right:0;padding:1.375rem 1.625rem 1.875rem;
  margin:0;gap:0;flex-direction:column;align-items:stretch;justify-content:flex-start;
  max-height:calc(100dvh - 4.875rem - var(--header-admin-offset,0rem));overflow-y:auto;background:#fff;
  box-shadow:0 .625rem 1.125rem #00281015;
 }
 body.recruit-site > .header .desktop-nav.is-open > a{padding:.9375rem .5rem;border-bottom:.0625rem solid var(--line)}
}
@media(max-width:33.75em){
 body.recruit-site > header.header{height:4.5rem;padding-left:.875rem}
 body.recruit-site > .header .menu-toggle{width:4.5rem}
 body.recruit-site > .header .header-actions a{width:4.375rem}
}
@media(prefers-reduced-motion:reduce){body.corporate-header.is-header-fixed > header,body.recruit-site.is-header-fixed > header.header{transition:none}}
/* Keep Bold when tablet navigation inherits the mobile menu layout. */
body.corporate-header .head-nav :is(.nav-item,.nav-cta) :is(.en,.ja){font-weight:700}

/* Prepare the complete capsule off screen; do not cross-fade the hero logo tab. */
body.is-header-preparing > header{transition:none!important}
body.corporate-header.is-header-fixed > header .head-logo::before{display:none;transition:none}
body.corporate-header.is-header-fixed > header .sns-link-wrap a{transition:none}
#top.corporate-header .mv .c-ttl > .en{font-size:2.4rem;line-height:1.5}

/* Corporate navigation: 23px Bold. Recruitment retains its original sizing. */
body.corporate-header .head-nav :is(.nav-item,.nav-btn-item,.nav-cta,.nav-box,.nav-box-wrap) :is(.en,.ja),
body.corporate-header .head-nav :is(.nav-box,.nav-box-wrap) a,
body.corporate-header .head-nav .nav-btn-copy > :is(.en,.ja){font-size:2.3rem;font-weight:700;line-height:1.4}
@media(min-width:82.5em) and (max-width:99.9375em){
 body.corporate-header > header{gap:2rem}
 body.corporate-header > header .head-nav-wrap{gap:1rem}
 body.corporate-header > header .head-nav .hover-switch{padding-inline:.8rem}
 body.corporate-header > header .head-nav .nav-cta{min-width:13rem}
}

/* Contain decorative strips without creating horizontal page scrolling. */
body.corporate-header{overflow-x:clip}
@media(max-width:82.4375em){
 body.corporate-header .head-nav{
  box-sizing:border-box;width:100%!important;max-width:100%!important;left:0!important;right:0!important;
  padding-top:max(14rem,calc(var(--site-header-height,6.4rem) + var(--header-admin-offset,0rem) + 5rem))!important;
  padding-inline:clamp(2rem,5vw,4rem)!important;
  overflow-x:hidden;overscroll-behavior:contain;
 }
 body.corporate-header .head-nav-wrap{min-width:0;max-width:100%;min-height:0}
 body.corporate-header .head-nav :is(.nav-item,.nav-btn-item,.nav-cta,.nav-box,.nav-box-wrap) :is(.en,.ja),
 body.corporate-header .head-nav :is(.nav-box,.nav-box-wrap) a,
 body.corporate-header .head-nav .nav-btn-copy > :is(.en,.ja){font-size:2.1rem;line-height:1.5}
 body.corporate-header .head-nav :is(.nav-item,.nav-cta,.nav-box,.nav-box-wrap){max-width:100%;min-width:0}
}

/* Mobile Safari: constrain the root viewport as well as body overflow. */
@media(max-width:47.9375em){
 html:has(>body.corporate-header){width:100%;max-width:100%;overflow-x:hidden}
 body.corporate-header{width:100%;max-width:100%;min-width:0;overflow-x:hidden}
 body.corporate-header>main{width:100%;max-width:100%;min-width:0;overflow-x:clip}
 body.corporate-header main>.inner,
 body.corporate-header main>section{min-width:0;max-width:100%}
 body.corporate-header .head-nav{width:100%!important;max-width:100%!important;margin:0!important}
 body.corporate-header :is(.ks-tiktok-row,.blog-list-wrap,.cInfiniteText){max-width:100%}
}

/* A flow header must not create a translated horizontal scroll origin on phones. */
@media(max-width:47.9375em){
 html:has(>body.corporate-header),body.corporate-header{overflow-x:clip}
 body.corporate-header{--header-x:0%;margin-inline:0}
 body.corporate-header > header{left:auto!important;right:auto!important;margin-inline:auto;width:calc(100% - 2.4rem);max-width:calc(100% - 2.4rem)}
 body.corporate-header.is-header-fixed > header{left:1.2rem!important;right:1.2rem!important;margin-inline:0}
 body#top.corporate-header .head-nav{padding-top:max(14rem,calc(var(--site-header-height,6.4rem) + var(--header-admin-offset,0rem) + 5rem))!important}
}

/* Japanese navigation is quieter than the English labels. */
body.corporate-header .head-nav :is(.nav-item,.nav-btn-item,.nav-cta,.nav-box,.nav-box-wrap) .ja,
body.corporate-header .head-nav :is(.nav-box,.nav-box-wrap) a,
body.corporate-header .head-nav .nav-btn-copy > .ja{font-size:2rem;font-weight:500;line-height:1.5}

/* Phone navigation stays in its original design throughout scrolling. */
@media(max-width:47.9375em){
 body.corporate-header > header{position:fixed!important;left:1.2rem!important;right:1.2rem!important;top:calc(var(--header-admin-offset,0px) + 1.6rem)!important;margin:0;transform:none!important;transition:none!important}
 body.corporate-header:not(.menu-open)>header{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
 body.corporate-header:not(.menu-open)>header .head-logo::before{display:block;opacity:1}
 body.recruit-site > header.header{position:fixed!important;top:var(--header-admin-offset,0px)!important;width:100%;transform:none!important;transition:none!important}
 body.recruit-site>.site-header-spacer{height:var(--site-header-height)}
 /* Keep section controls in the document, avoiding a second fixed toolbar. */
 #company .sidenav{position:relative;top:auto;align-self:stretch;overflow-x:auto;background:#303a35;border-block:1px solid #ffffff26}
 #company .sidenav-wrap{padding:1.6rem;gap:.8rem}
 #company .sidenav a{font-size:1.6rem;min-height:4.4rem;color:#e0e5e2}
 #blog :is(.portal-side,.article-sidebar,.inside-side){position:static;top:auto;max-height:none;overflow:visible}
}
@media(min-width:48em){
 #company .sidenav,#blog .article-sidebar{top:var(--site-anchor-offset,12rem);max-height:calc(100dvh - var(--site-anchor-offset,12rem) - 2.4rem);overflow-y:auto;scrollbar-width:thin}
}
