/* WILLCARE / A concept recruitment button / 2026-10-08 */
.site-header .header-recruit {
  position:relative;
  flex:none;isolation:isolate;
  gap:9px;min-height:52px;
  padding:8px 11px;
  border:1.5px solid #ff8517;
  border-radius:999px;
  background:linear-gradient(120deg,#fff8dc 0%,#fff2da 58%,#ffe8d5 100%);
  color:#103f60;
  box-shadow:0 4px 14px #f18b2421;
  transition:transform .2s ease,box-shadow .2s ease;
}
.site-header .header-recruit .recruit-mark {
  display:grid;place-items:center;
  width:31px;height:34px;
  background:transparent;color:#f47c0a;
  border-radius:0;
}
.site-header .header-recruit .recruit-mark .icon {
  display:block;width:30px;height:30px;
  stroke-width:1.8;
}
.site-header .header-recruit .recruit-label {
  position:relative;
  display:block;
  padding-bottom:7px;
  font-size:15px;font-weight:700;
  line-height:1.3;letter-spacing:.02em;
}
.site-header .header-recruit .recruit-label small {
  font:700 8px/1.25 Arial,sans-serif;
  letter-spacing:.2em;margin-bottom:3px;
  color:#103f60;
}
.site-header .header-recruit .recruit-wave {
  display:block;
  position:absolute;left:0;bottom:0;
  width:100%;height:6px;
  color:#ff8619;
  pointer-events:none;
}
.site-header .header-recruit .recruit-arrow {
  width:29px;height:29px;
  background:#103f60;color:#fff;
}
.site-header .header-recruit .recruit-arrow .icon {
  display:block;width:16px;height:16px;
}
.site-header .header-recruit:focus-visible {
  outline:3px solid #2297da;outline-offset:4px;
}
@media(hover:hover) {
  .site-header .header-recruit[href]:hover {
    transform:translateY(-2px);
    box-shadow:0 7px 18px #ec7e2a33;
  }
}
@media(max-width:1360px) and (min-width:1181px) {
  .site-header .header-recruit { gap:7px;padding:7px 9px;min-height:48px; }
  .site-header .header-recruit .recruit-mark { width:26px;height:29px; }
  .site-header .header-recruit .recruit-mark .icon { width:26px;height:26px; }
  .site-header .header-recruit .recruit-label { font-size:14px; }
  .site-header .header-recruit .recruit-arrow { width:26px;height:26px; }
}
@media(max-width:760px) {
  .site-header { padding-left:14px;padding-right:14px;gap:7px; }
  .site-header .header-recruit { gap:7px;padding:8px 10px;min-height:48px; }
  .site-header .header-recruit .recruit-mark { width:26px;height:29px; }
  .site-header .header-recruit .recruit-mark .icon { display:block;width:26px;height:26px; }
  .site-header .header-recruit .recruit-label { font-size:14px;padding-bottom:7px; }
  .site-header .header-recruit .recruit-label small { display:none; }
  .site-header .header-recruit .recruit-arrow { width:26px;height:26px; }
  .site-header .header-recruit .recruit-arrow .icon { display:block;width:15px;height:15px; }
}
@media(max-width:420px) {
  .site-header .brand { gap:5px; }
  .site-header .brand img { width:34px;height:34px; }
  .site-header .brand>span { font-size:17.5px;letter-spacing:.03em; }
}
@media(max-width:360px) {
  .site-header { padding-left:10px;padding-right:10px;gap:6px; }
  .site-header .brand { gap:5px; }
  .site-header .brand img { width:30px;height:30px; }
  .site-header .brand>span { font-size:16px;letter-spacing:.04em; }
  .site-header .header-recruit { gap:6px;padding:8px 7px;min-height:46px; }
  .site-header .header-recruit .recruit-mark { width:22px;height:26px; }
  .site-header .header-recruit .recruit-mark .icon { display:block;width:22px;height:22px; }
  .site-header .header-recruit .recruit-label { font-size:14px;letter-spacing:0; }
  .site-header .header-recruit .recruit-arrow { width:24px;height:24px; }
  .site-header .header-recruit .recruit-arrow .icon { display:block;width:14px;height:14px; }
}
@media(max-width:340px) {
  .site-header .brand { gap:4px; }
  .site-header .brand img { width:28px;height:28px; }
  .site-header .brand>span { font-size:15px;letter-spacing:.03em; }
  .site-header .header-recruit .recruit-mark { width:20px; }
  .site-header .header-recruit .recruit-mark .icon { width:20px;height:20px; }
  .site-header .header-recruit .recruit-arrow { width:22px;height:22px; }
}
@media(prefers-reduced-motion:reduce) {
  .site-header .header-recruit,.site-header .header-recruit .recruit-arrow { transition:none; }
  .site-header .header-recruit[href]:hover { transform:none; }
}
