@import url("./topimg.css");
@import url("./estimate-comple.css");
@import url("./request-menu.css");
@import url("./floating-menu.css");
@import url("./floating-request-menu.css?v=20260701-no-iframe");
@import url("./mobile-fixed-footer.css");
@import url("./image-link-buttons.css");

body div#container_wide {
  width: 100%;
  margin-top: 110px;
}

@media (max-width: 760px) {
  body div#container_wide {
    margin-top: 75px;
  }
}

body div#container_wide+div#container_top {
  margin-top: 0 !important;
}

/* 旧ボタンは非表示 */
a.estimate-button {
  display: none;
}

/* 閉じるボタン */
.request-modal__close-form {
  position: absolute;
  z-index: 5;
  top: var(--space-5);
  right: var(--space-5);
  margin: var(--space-0);
}

.request-modal__close {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  padding: var(--space-0);
  border: 1px solid var(--border-blue-soft);
  border-radius: var(--radius-circle);
  color: var(--color-blue);
  background: var(--surface-white-90);
  box-shadow: var(--shadow-soft);
  cursor: pointer;
}

.request-modal__close:hover,
.request-modal__close:focus-visible {
  color: var(--color-blue);
}

.request-modal__close:focus-visible {
  outline: 3px solid var(--color-yellow);
  outline-offset: 3px;
}

.request-modal__close svg {
  width: 1em;
  height: 1em;
}

:root {
  --font-sans: "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif;
  --font-symbol: Arial, sans-serif;

  --color-white: #fff;
  --color-navy: #09274f;
  --color-blue: #075fc8;
  --color-blue-dark: #0758bb;
  --color-blue-vivid: #0879dc;
  --color-yellow: #ffd44f;
  --color-yellow-vivid: #fff500;
  --color-orange: #f56a22;
  --color-orange-strong: #ff7a13;
  --color-green: #098a52;
  --color-blue-soft: #eaf3ff;
  --color-blue-pale: #f4f9ff;
  --color-gold: #f6d85f;
  --color-gold-light: #ffeb89;
  --color-gray-900: #172033;
  --color-gray-700: #2f3d52;
  --color-gray-300: #d7e3f4;
  --color-device-base-from: #d9dde5;
  --color-device-base-to: #aeb6c4;
  --device-map-green: rgba(9,138,82,.26);
  --device-map-blue: rgba(7,95,200,.12);
  --device-map-gold: rgba(246,216,95,.22);
  --color-overlay: rgba(13, 22, 37, .72);
  --surface-white-70: rgba(255,255,255,.7);
  --surface-white-72: rgba(255,255,255,.72);
  --surface-white-80: rgba(255,255,255,.8);
  --surface-white-90: rgba(255,255,255,.9);
  --color-page-bg: #fff;
  --color-hero-bg: #eff9ff;
  --color-text-muted: #375470;

  --navy: var(--color-navy);
  --blue: var(--color-blue);
  --yellow: var(--color-yellow);
  --orange: var(--color-orange);
  --green: var(--color-green);

  --container-width: 1000px;
  --container-gutter-pc: 40px;
  --container-gutter-tablet: 32px;
  --container-gutter-sp: 24px;
  --container-gutter-xs: 18px;

  --space-0: 0;
  --space-1: 4px;
  --space-2: 6px;
  --space-3: 8px;
  --space-4: 10px;
  --space-5: 12px;
  --space-6: 14px;
  --space-7: 16px;
  --space-8: 18px;
  --space-9: 20px;
  --space-10: 24px;
  --space-11: 28px;
  --space-12: 32px;
  --space-13: 40px;
  --space-14: 54px;

  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 15px;
  --radius-xl: 20px;
  --radius-pill: 999px;
  --radius-circle: 50%;

  --shadow-soft: 0 8px 20px rgba(20,91,151,.08);
  --shadow-card: 0 7px 18px rgba(10,51,89,.1);
  --shadow-card-hover: 0 12px 24px rgba(10,51,89,.18);
  --shadow-icon: 0 4px 8px rgba(0,0,0,.15);
  --shadow-assurance: 0 5px 12px rgba(19,70,112,.12);
  --shadow-person: drop-shadow(0 14px 22px rgba(17,75,125,.14));
  --shadow-speech: drop-shadow(0 7px 12px rgba(7,74,150,.18));
  --shadow-modal: 0 26px 80px rgba(5, 23, 48, .24);
  --shadow-blue-button: 0 10px 22px rgba(7, 95, 200, .28);
  --shadow-blue-button-hover: 0 16px 30px rgba(7, 95, 200, .38);
  --shadow-outline-button-hover: 0 12px 26px rgba(7, 95, 200, .18);
  --shadow-inner-soft: inset 0 1px 0 rgba(255,255,255,.8);
  --button-shine: linear-gradient(120deg, transparent 0%, rgba(255,255,255,.18) 35%, rgba(255,255,255,.62) 50%, rgba(255,255,255,.18) 65%, transparent 100%);

  --border-blue-soft: rgba(7,95,200,.14);
  --border-blue-line: rgba(7,95,200,.15);
  --border-blue-strong: rgba(7,95,200,.42);

  --motion-fast: .2s ease;
  --motion-base: .25s ease-out;
  --motion-fade: .28s ease;
  --motion-enter: .6s cubic-bezier(.2,.8,.2,1);
  --motion-enter-slow: .8s cubic-bezier(.2,.8,.2,1);

  --visual-x: 0px;
  --visual-y: 0px;
}

:where(.hero, .request-menu-page, .estimate-complete-page, .floating-menu-page, .mobile-fixed-footer-page, .image-link-buttons-page),
:where(.hero, .request-menu-page, .estimate-complete-page, .floating-menu-page, .mobile-fixed-footer-page, .image-link-buttons-page) * {
  box-sizing: border-box;
  letter-spacing: 0;
}

:where(.hero, .request-menu-page, .estimate-complete-page, .floating-menu-page, .mobile-fixed-footer-page, .image-link-buttons-page) {
  color: var(--color-navy);
  font-family: var(--font-sans)!important;
  line-height: 1.5;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

:where(.hero, .request-menu-page, .estimate-complete-page, .floating-menu-page, .mobile-fixed-footer-page, .image-link-buttons-page) :where(h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, figure, blockquote) {
  margin: var(--space-0);
  padding: var(--space-0);
  border: 0;
  color: inherit;
  font: inherit;
  letter-spacing: 0;
}

:where(.hero, .request-menu-page, .estimate-complete-page, .floating-menu-page, .mobile-fixed-footer-page, .image-link-buttons-page) :where(ul, ol) {
  list-style: none;
}

:where(.hero, .request-menu-page, .estimate-complete-page, .floating-menu-page, .mobile-fixed-footer-page, .image-link-buttons-page) :where(a) {
  color: inherit;
  text-decoration: none;
}

:where(.hero, .request-menu-page, .estimate-complete-page, .floating-menu-page, .mobile-fixed-footer-page, .image-link-buttons-page) :where(button, input, select, textarea) {
  color: inherit;
  font: inherit;
}

:where(.hero, .request-menu-page, .estimate-complete-page, .floating-menu-page, .mobile-fixed-footer-page, .image-link-buttons-page) :where(button) {
  border: 0;
  background: transparent;
  cursor: pointer;
}

:where(.hero, .request-menu-page, .estimate-complete-page, .floating-menu-page, .mobile-fixed-footer-page, .image-link-buttons-page) :where(img, svg) {
  display: block;
  max-width: 100%;
}