/* The supplied cat-and-tree identity keeps its natural illustration colors. */

@font-face {
  font-family: "Gajumaru Copy";
  src: url("../fonts/klee-one-copy.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

.gajumaru-hero-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
  color: var(--foreground);
  container-type: inline-size;
}
.gajumaru-hero-copy__jp {
  font-size: clamp(24px, 8cqw, 46px);
}
.gajumaru-hero-copy__en {
  font-family: Ubuntu, "Helvetica Neue", sans-serif;
  font-size: clamp(12px, 1.15vw, 17px);
  line-height: 1.5;
  letter-spacing: .06em;
}
.message .box_text .title.gajumaru-message-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  max-width: 500px;
  color: var(--primary);
  container-type: inline-size;
}
.gajumaru-message-copy__jp {
  font-size: clamp(20px, 8cqw, 38px);
}
.gajumaru-hero-copy__jp,
.gajumaru-message-copy__jp {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .22em;
  padding: .5em .55em;
  max-width: 100%;
  font-family: "Gajumaru Copy", "Hiragino Maru Gothic ProN", sans-serif;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: .02em;
}
.gajumaru-copy-line {
  display: block;
  padding: .04em .2em .13em;
  background: #fff;
  white-space: nowrap;
}
.gajumaru-hero-copy__jp::before,
.gajumaru-message-copy__jp::before,
.gajumaru-hero-copy__jp::after,
.gajumaru-message-copy__jp::after {
  position: absolute;
  color: var(--primary);
  font-family: Georgia, serif;
  font-size: 1.8em;
  font-weight: 700;
  line-height: 1;
}
.gajumaru-hero-copy__jp::before,
.gajumaru-message-copy__jp::before {
  content: "\201c" / "";
  top: -.08em;
  left: 0;
}
.gajumaru-hero-copy__jp::after,
.gajumaru-message-copy__jp::after {
  content: "\201d" / "";
  right: -.02em;
  bottom: -.26em;
}
.gajumaru-hero-copy__en,
.gajumaru-message-copy__en {
  background: #fff;
  padding: .35em .65em;
  margin-left: .55em;
  font-weight: 400;
}
.gajumaru-message-copy__en {
  font-family: Ubuntu, "Helvetica Neue", sans-serif;
  font-size: clamp(12px, 1.05vw, 15px);
  line-height: 1.5;
  letter-spacing: .04em;
}

@media (max-width: 800px) {
  .gajumaru-hero-copy { gap: 10px; }
  .gajumaru-hero-copy__jp {
    font-size: clamp(22px, 8cqw, 32px);
  }
  .gajumaru-hero-copy__en {
    max-width: 28em;
    font-size: 12px;
  }
  .message .box_text .title.gajumaru-message-copy {
    gap: 12px;
    max-width: none;
  }
  .gajumaru-message-copy__jp {
    font-size: clamp(20px, 8cqw, 32px);
  }
  .gajumaru-message-copy__en { font-size: 12px; }
}

img.gajumaru-logo,
.footer_content_info .logo img.gajumaru-logo,
#service-details img.gajumaru-logo {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2071 / 759;
  object-fit: contain;
  filter: none;
  mix-blend-mode: multiply;
}
header .header_normal > .logo::before,
header .header_normal > .logo::after { display: none; }
header .header_normal > .logo { width: 270px; height: auto; top: 50px; left: 24px; }
header .header_normal .logo a.gajumaru-logo-link,
header .header_fixed .logo a.gajumaru-logo-link {
  position: static;
  display: block;
  width: 100%;
  height: auto;
  background: none;
  filter: none;
}
header .header_fixed .logo { width: 240px; height: auto; top: 14px; left: 24px; }
/* Preserve the original PNG's alpha; crop only its transparent canvas in CSS. */
header img.gajumaru-header-logo {
  aspect-ratio: 1536 / 400;
  object-fit: cover;
  object-position: 50% 48%;
  mix-blend-mode: normal;
}
.footer_content_info .logo { width: 320px; max-width: 100%; height: auto; margin-bottom: 0; }
.footer_content_nav { justify-content: flex-end; }
.footer_content_nav .copyright { margin-top: 0; }
.brand-heading {
  display: inline-flex;
  flex-direction: column;
  gap: .2em;
  color: var(--primary);
  font-family: 'Hiragino Maru Gothic ProN', 'Yu Gothic', sans-serif;
  font-size: clamp(24px, 2.5vw, 36px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .06em;
}
.brand-heading__name { font-size: .72em; font-weight: 500; }
.service .box_text .title .brand-heading { text-align: left; }
.staff .staff_title { gap: 18px; }
.staff .staff_title .title::after { display: none; }
.staff .staff_title .brand-heading { display: block; font-size: 30px; }
.staff .staff_title .brand-heading__name { font-size: inherit; }
.brand-office { color: var(--primary); line-height: 1.6; }
.brand-office__type { display: block; font-size: 15px; font-weight: 500; }
.brand-office__name { display: block; font-size: 28px; letter-spacing: .12em; font-weight: 700; }
.brand-nav-label { display: block; color: var(--primary); font-weight: 700; font-size: 19px; line-height: 1.4; white-space: nowrap; }
header .navigation_list .jp { height: auto !important; }
header .navigation_list .jp > * { display: none; }
header .navigation_list .jp::after {
  display: block;
  color: var(--foreground);
  font-size: 19px;
  font-weight: 500;
  line-height: 1.3;
  white-space: nowrap;
}
header .navigation_list .list_item01 .jp::after { content: "がじゅまるについて"; }
header .navigation_list .list_item02 .jp::after { content: "サービス紹介"; }
header .navigation_list .list_item04 .jp::after { content: "ACCESS"; }
header .navigation_list .list_item04 .en { display: none; }
.brand-button-label { display: block; font-size: 17px; font-weight: 700; line-height: 1.7; }
.illustrated-banner--recruit .illustrated-banner__title { font-size: 8cqw; }
.illustrated-banner--recruit .illustrated-banner__title > span { font-size: .68em; }
.footer_bnr .bnr_recruit { margin-left: auto; }
.station-mark { display: block; width: 200px; max-width: 100%; margin: auto; }
.care-network {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(180px,.8fr) minmax(0,1fr);
  grid-template-rows: auto auto auto;
  gap: 14px;
  align-items: center;
  color: var(--primary);
  text-align: center;
}
.care-network__node { display: flex; min-height: 120px; flex-direction: column; justify-content: center; gap: 12px; padding: 20px 12px; border: 1px solid var(--sage-mid); border-radius: 22px; background: var(--surface); }
.care-network__node strong { font-size: clamp(16px,1.8vw,24px); font-weight: 700; }
.care-network__node > span { color: var(--foreground); font-size: 15px; line-height: 1.7; }
.care-network__link { display: flex; flex-direction: column; align-items: center; font-size: 14px; line-height: 1.2; }
.care-network__link > span { font-size: 40px; font-weight: 300; }
.care-network__center { display: flex; flex-direction: column; gap: 12px; padding: 18px 0; font-size: 15px; font-weight: 500; line-height: 1.8; }
.care-network__center .station-mark { width: 240px; }
#service-details .use_insurance_tab .title { padding: 0 20px; line-height: 1.7; }
#service-details .use_insurance_tab .box_img { margin-top: 28px; padding: 28px; }
.insurance-flow { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; color: var(--foreground); }
.insurance-flow__step { display: flex; align-items: flex-start; gap: 20px; padding: 22px 0; }
.insurance-flow__step + .insurance-flow__step { border-top: 1px solid var(--sage-mid); }
.insurance-flow__number { display: grid; place-items: center; flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%; color: white; background: var(--primary); font-size: 20px; }
.insurance-flow__detail { flex: 1; min-width: 0; }
.insurance-flow__detail h4 { margin: 4px 0 20px; color: var(--primary); font-size: 18px; font-weight: 700; line-height: 1.7; }
.insurance-flow__route { display: grid; grid-template-columns: minmax(0,1fr) 36px minmax(0,1fr); gap: 16px; align-items: center; }
.insurance-flow__role { display: flex; justify-content: center; align-items: center; min-height: 95px; padding: 16px; border: 1px solid var(--sage); border-radius: 16px; background: var(--surface); text-align: center; font-size: 17px; line-height: 1.7; }
.insurance-flow__role small { display: block; margin-top: 6px; font-size: 12px; }
.insurance-flow__role .station-mark { width: 180px; }
.insurance-flow__targets { display: grid; gap: 10px; }
.insurance-flow__arrow { font-size: 32px; color: var(--primary); text-align: center; }
@media (min-width:1025px) and (max-width:1240px) {
  header .header_normal > .logo { width: 260px; top: 31px; left: 22px; }
  header .header_normal .header_inner { padding-left: 300px; }
}
@media (max-width:1024px) {
  header .header_normal { height: 110px; padding-top: 19px; }
  header .header_normal > .logo,
  header .header_normal .header_inner .logo {
    position: relative;
    top: auto;
    left: auto;
    width: min(245px, calc(100% - 100px));
    height: auto;
    margin: 0 0 12px 5%;
  }
  header .header_normal .header_inner .logo { margin-top: 19px; margin-bottom: 32px; }
}
@media (max-width:800px) {
  .footer_content_info { margin-bottom: 24px; }
  .footer_content_nav .copyright { margin-top: 0; }
  .brand-heading { font-size: 24px; }
  .staff .staff_title .brand-heading { font-size: 24px; }
  .staff .staff_title .en { margin-top: 14px; }
  #service-details .care_title .title,
  #service-details .use_title .title { max-width: 94%; }
  .brand-office__name { font-size: 25px; }
  .care-network { grid-template-columns: minmax(0,1fr) minmax(60px,.6fr) minmax(0,1fr); gap: 8px; }
  .care-network__node { min-height: 120px; padding: 14px 8px; gap: 8px; border-radius: 16px; }
  .care-network__node strong { font-size: 15px; line-height: 1.7; }
  .care-network__node > span { font-size: 12px; }
  .care-network__center { grid-column: 1 / -1; grid-row: 2; padding: 10px 22%; }
  .care-network__center .station-mark { width: 200px; }
  .care-network__link--left { grid-column: 1; grid-row: 2; justify-self: start; width: 45%; z-index: 1; }
  .care-network__link--right { grid-column: 3; grid-row: 2; justify-self: end; width: 45%; z-index: 1; }
  .care-network__node--care { grid-column: 1; grid-row: 3; }
  .care-network__link--bottom { grid-column: 2; grid-row: 3; }
  .care-network__node--plan { grid-column: 3; grid-row: 3; }
  #service-details .use_insurance_tab .box_img { padding: 10px 14px; }
  .insurance-flow__step { gap: 10px; padding: 22px 0; }
  .insurance-flow__number { width: 28px; height: 28px; font-size: 16px; }
  .insurance-flow__detail h4 { font-size: 16px; margin: 0 0 14px; }
  .insurance-flow__route { grid-template-columns: minmax(0,1fr); gap: 4px; }
  .insurance-flow__role { min-height: 68px; padding: 12px; font-size: 15px; }
  .insurance-flow__arrow { transform: rotate(90deg); font-size: 28px; line-height: 1.1; }
}

@media (max-width:1024px) {
  header .header_normal .header_inner .navigation .jp:has(.brand-nav-label) { height: auto; }
}