@import url('./fonts.css');

/* stylelint-disable length-zero-no-unit */
:root {
  --lib-core--font-family-primary: 'IBM Plex Sans JP';
  --header-height: 60px;
  --sub-SiteMenu-height: 48px;
  --total-header-height: calc(var(--header-height) + var(--sub-SiteMenu-height));
  --pfizer-primary-color: #0000C9;
  --pfizer-second-color: #2101c9;
  --white: #fff;
  --black: #000;
  --gray-color-2: #d9d9d9;
  --border: 1px solid #ddd;
  --shadow-color: 0px 4px 8px 0px #0000001a;
  --shadow-color-2: 0px 3px 6px 0px #00000029;
  --site-link-background-1: #81a5ce;
  --site-link-background-2: #56b9b8;
  --site-link-background-3: #c85f76;
  --site-link-background-4: #f2989e;
  --site-link-background-5: #0164ad;
  --sub-site-menu-primary-color: var(--pfizer-primary-color);
  --active-link-color: #0495fb;
}

@media (min-width: 1000px) {
  :root {
    --header-height: 100px;
  }
}

html {
  -webkit-tap-highlight-color: transparent;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--text-color);
  line-height: var(--site-line-height);
  /* stylelint-disable-next-line value-keyword-case */
  text-rendering: optimizeSpeed;
  opacity: 0;
  overflow-x: hidden;
  -webkit-tap-highlight-color: transparent;
}

.block,
.section {
  opacity: 0;
}

body.appear,
.section[data-section-status='loaded'],
.block[data-block-status='loaded'] {
  opacity: 1;
}

main {
  margin-top: var(--total-header-height);
}

sup {
  white-space: nowrap;
  unicode-bidi: isolate;
  font-size: 70%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  scroll-margin: var(--total-header-height);
}

p:last-child {
  margin-bottom: 0;
}

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