html {
  width: 100%;
  height: 100%;
  /* 画面を拡大している場合はfont-sizeを変更して大きさを揃える */
  /* 16px / 1.5 = 10.6667px (拡大率150%の場合)*/
  /* font-size: 10.6667px;  */
}

body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

#root {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
}

.flex-h-full {
  height: 100%;
  display: flex;
}


.loading{
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: calc(infinity);
  background-color: #fff;
  opacity: 1;
  animation-fill-mode: both;
}
/* ifx-react-ui のLoadingSpinnerより引用 */
.loading-item-wrapper {
  width: 2.875rem; /* 46px -> 2.875rem */
  height: 2.875rem; /* 46px -> 2.875rem */
  display: inline-block;
}

.loading-item {
  position: relative;
  left: 1.125rem; /* 18px -> 1.125rem */
  top: 1.125rem; /* 18px -> 1.125rem */
  width: 0.625rem; /* 10px -> 0.625rem */
  height: 0.625rem; /* 10px -> 0.625rem */
  border-radius: 0.3125rem; /* 5px -> 0.3125rem */
  background-color: transparent;
  color: transparent;
  box-shadow: 
    rgb(64, 148, 241) 0rem -1.125rem 0rem 0rem, /* 0px, -18px -> 0rem, -1.125rem */
    rgb(64, 148, 241) 0.795rem -0.795rem 0rem 0rem, /* 12.7279px -> 0.795rem */
    rgb(64, 148, 241) 1.125rem 0rem 0rem 0rem, /* 18px -> 1.125rem */
    rgb(64, 148, 241) 0.795rem 0.795rem 0rem 0rem, /* 12.7279px -> 0.795rem */
    rgb(64, 148, 241) 0rem 1.125rem 0rem 0rem, /* 18px -> 1.125rem */
    rgb(64, 148, 241) -0.795rem 0.795rem 0rem 0rem, /* 12.7279px -> 0.795rem */
    rgba(64, 148, 241, 0) -1.125rem 0rem 0rem 0rem, /* 18px -> 1.125rem */
    rgba(64, 148, 241, 0) -0.795rem -0.795rem 0rem 0rem; /* 12.7279px -> 0.795rem */
  animation-duration: 1.5s;
  animation-timing-function: linear;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-name: animateSpinnerDefault;
  animation-timeline: auto;
  animation-range: normal;
}

@keyframes animateSpinnerDefault {
  0%, 100% {
    box-shadow: 
      0rem -1.125rem 0 0 #4094F1, /* 0px, -18px -> 0rem, -1.125rem */
      0.795rem -0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      0rem 1.125rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> -0.795rem */
      -1.125rem 0rem 0 0 #4094F100, /* 18px -> 1.125rem */
      -0.795rem -0.795rem 0 0 #4094F100; /* 12.72792px -> -0.795rem */
  }
  12.5% {
    box-shadow: 
      0rem -1.125rem 0 0 #4094F100, /* 18px -> 1.125rem */
      0.795rem -0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      0rem 1.125rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      -1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem -0.795rem 0 0 #4094F100; /* 12.72792px -> -0.795rem */
  }
  25% {
    box-shadow: 
      0rem -1.125rem 0 0 #4094F100, /* 18px -> 1.125rem */
      0.795rem -0.795rem 0 0 #4094F100, /* 12.72792px -> 0.795rem */
      1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      0rem 1.125rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      -1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem -0.795rem 0 0 #4094F1; /* 12.72792px -> -0.795rem */
  }
  37.5% {
    box-shadow: 
      0rem -1.125rem 0 0 #4094F1, /* 18px -> 1.125rem */
      0.795rem -0.795rem 0 0 #4094F100, /* 12.72792px -> 0.795rem */
      1.125rem 0rem 0 0 #4094F100, /* 18px -> 1.125rem */
      0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      0rem 1.125rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      -1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem -0.795rem 0 0 #4094F1; /* 12.72792px -> -0.795rem */
  }
  50% {
    box-shadow: 
      0rem -1.125rem 0 0 #4094F1, /* 18px -> 1.125rem */
      0.795rem -0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      1.125rem 0rem 0 0 #4094F100, /* 18px -> 1.125rem */
      0.795rem 0.795rem 0 0 #4094F100, /* 12.72792px -> 0.795rem */
      0rem 1.125rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      -1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem -0.795rem 0 0 #4094F1; /* 12.72792px -> -0.795rem */
  }
  62.5% {
    box-shadow: 
      0rem -1.125rem 0 0 #4094F1, /* 18px -> 1.125rem */
      0.795rem -0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      0.795rem 0.795rem 0 0 #4094F100, /* 12.72792px -> 0.795rem */
      0rem 1.125rem 0 0 #4094F100, /* 18px -> 1.125rem */
      -0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      -1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem -0.795rem 0 0 #4094F1; /* 12.72792px -> -0.795rem */
  }
  75% {
    box-shadow: 
      0rem -1.125rem 0 0 #4094F1, /* 18px -> 1.125rem */
      0.795rem -0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      0rem 1.125rem 0 0 #4094F100, /* 18px -> 1.125rem */
      -0.795rem 0.795rem 0 0 #4094F100, /* 12.72792px -> 0.795rem */
      -1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem -0.795rem 0 0 #4094F1; /* 12.72792px -> -0.795rem */
  }
  87.5% {
    box-shadow: 
      0rem -1.125rem 0 0 #4094F1, /* 18px -> 1.125rem */
      0.795rem -0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      1.125rem 0rem 0 0 #4094F1, /* 18px -> 1.125rem */
      0.795rem 0.795rem 0 0 #4094F1, /* 12.72792px -> 0.795rem */
      0rem 1.125rem 0 0 #4094F1, /* 18px -> 1.125rem */
      -0.795rem 0.795rem 0 0 #4094F100, /* 12.72792px -> 0.795rem */
      -1.125rem 0rem 0 0 #4094F100, /* 18px -> 1.125rem */
      -0.795rem -0.795rem 0 0 #4094F1; /* 12.72792px -> -0.795rem */
  }
}

/* maplibre copyright部分 */
.maplibregl-ctrl-attrib-inner {
  line-height: 1.5rem;
  font-size: 0.75rem;
}