:root {
  --u:min(.0694444444vw,1px);
  --pink:#e499b2;
  --ink:#222;
  --blue:#69c9dd;
  --gradient:url('../images/gradient.webp');
  --header-height:calc(106 * var(--u))
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:auto;
  scroll-padding-top:20px
}

body {
  margin:0;
  color:var(--ink);
  font-family:'Source Han Sans JP','Noto Sans JP',sans-serif;
  font-weight:400;
  font-size:16px
}

button,a {
  -webkit-tap-highlight-color:transparent
}

button {
  font:inherit;
  color:inherit;
  cursor:pointer
}

button {
  border:0;
  background:none;
  padding:0
}

a {
  color:inherit;
  text-decoration:none
}

img {
  display:block;
  max-width:100%
}

h1,h2,h3,p {
  margin:0
}

button:focus-visible,a:focus-visible {
  outline:3px solid #236582;
  outline-offset:5px
}

button:hover .arrow,a:hover .arrow {
  transform:translateX(4px)
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}

.skip-link {
  position:fixed;
  z-index:100;
  top:0;
  left:1rem;
  transform:translateY(-150%);
  background:#fff;
  padding:1rem
}

.skip-link:focus {
  transform:translateY(0)
}

.mobile-only,.mobile-photo {
  display:none
}

.section {
  position:relative;
  width:100%;
  height:calc(var(--height) * var(--u));
  isolation:isolate
}

.section-art {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:-1;
  pointer-events:none;
  object-fit:fill
}

.recruit-top,.site-footer,.site-header {
  max-width:1440px;
  margin-inline:auto
}

.site-header {
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:var(--header-height);
  z-index:5;
  display:flex;
  justify-content:space-between;
  align-items:center
}

.header-logo {
  width:calc(273 * var(--u));
  height:var(--header-height);
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:0 0 calc(10 * var(--u)) 0;
  background:#fff
}

.header-logo img {
  width:calc(215 * var(--u))
}

.site-header nav {
  display:flex;
  align-items:center;
  gap:calc(25 * var(--u));
  padding-right:calc(32 * var(--u));
  font-size:calc(15 * var(--u));
  font-weight:700
}

.recruit-link {
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:calc(14 * var(--u));
  border-radius:30px;
  background:#fff;
  padding:calc(12 * var(--u)) calc(26 * var(--u))
}

.menu-toggle {
  display:none
}

.standard-page {
  max-width:1100px;
  margin:auto;
  padding:180px 24px 80px;
  min-height:70vh
}


.section-art img {
  width:100%;
  height:100%;
  object-fit:fill;
}
