@charset "utf-8";
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; background-color: var(--df-color-bg); color: var(--df-color-text); font-family: var(--df-font-sans); font-size: var(--df-font-size-body); line-height: var(--df-line-height-body); overflow-wrap: anywhere; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
:focus-visible { outline-width: 3px; outline-style: solid; outline-color: var(--df-color-accent); outline-offset: 3px; }
html.df-header-menu-open { overflow: hidden; }

/* Top page body copy size: retained here because Sibloo regenerates page CSS. */
.top-page-main .top-hero-copy>p:not(.df-eyebrow),
.top-page-main .top-intro-body p,
.top-page-main .top-audience-inner>p:last-child,
.top-page-main .top-services .df-section-lead,
.top-page-main .top-works .df-section-lead,
.top-page-main .top-flow .df-section-lead,
.top-page-main .top-contact-inner>p:not(.df-eyebrow) {
  font-size: clamp(14px, 1.1vw, 15px);
}

/* Keep lower-page hero headings aligned with the top-page hero. */
.lower-hero h1 {
  margin: 0;
  font-size: clamp(38px, 5vw, 66px);
  font-weight: 800;
  letter-spacing: .02em;
  line-height: 1.25;
  text-wrap: balance;
}

@media (min-width: 960px) {
  .lower-hero h1 {
    font-size: clamp(42px, 4vw, 60px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .top-page-main .top-hero-slide { animation: none; }
  .df-button:hover,
  .df-button:focus-visible,
  .df-button:active,
  .df-header .df-header-cta:hover,
  .df-header .df-header-cta:focus-visible,
  .df-header .df-header-cta:active,
  .formBtn:hover,
  .formBtn:focus-visible,
  .formBtn:active { transform: none; }
}

.contact-page.contact-page .contact-company-info p:nth-of-type(3) {
  word-break: keep-all;
}

.contact-page.contact-page .pp-toggle-label {
  color: var(--df-color-primary);
}

.contact-page.contact-page .pp-body {
  background: var(--df-color-bg);
}

.df-header .df-header-phone-content::after {
  content: "平日9:00~17:00";
  font-size: 11px;
  line-height: 1.1;
  letter-spacing: .04em;
}

/* Shared layout must also be available when template editor CSS is omitted. */
.df-header-inner,
.df-header-brand {
  display: flex;
}

.df-header-logo,
.df-footer-logo {
  display: block;
}

.df-header-logo-image {
  display: block;
  width: 100%;
  height: auto;
}

.df-header-logo-image-yellow {
  position: absolute;
  top: 0;
  left: 0;
}

.df-header .df-header-phone {
  font-weight: 800;
  letter-spacing: 0.03em;
}

.df-header .df-header-cta {
  padding-right: 20px;
  padding-left: 20px;
  border-radius: 12px;
  font-weight: 800;
}

.df-header-logo-image-white,
.df-header-logo-image-yellow {
  display: none;
}

@media (min-width: 960px) {
  .df-header-logo-image-white,
  .df-header-logo-image-yellow {
    display: block;
  }
}

.df-header-menu {
  position: fixed;
  display: flex;
  flex-direction: column;
}

.df-header-nav-links {
  display: flex;
  flex-direction: column;
}

.df-footer-logo {
  width: clamp(208px, 52vw, 300px);
}

.top-page-main .top-service-card-heading {
  display: flex;
  min-height: 40px;
  align-items: center;
}

.df-footer-nav {
  display: flex;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  .df-footer-nav {
    justify-content: flex-end;
  }
}