@charset "utf-8";
/* CSS Document */

 :root {
	--size-12: clamp(10px, calc(10vmin / 4), 12px);
  --size-14: clamp(12px, calc(10vmin / 4), 14px);
  --size-16: clamp(14px, calc(10vmin / 4), 16px);
		}
nav {
  pointer-events: initial;
  font-size: var(--size-16);
}
.nav-list {
  display: flex;
		align-items: flex-end;
}
.nav-item {
  --icon-w: calc(25em / 16);
}
.nav-item.-pamphlet {
  --icon-w:calc(20em / 16);
}
.nav-item.-guidance {
  --icon-w:calc(30em / 16);
}
.nav-item.-online {
  --icon-w:calc(26em / 16);
}
.nav-item.-online .st0 {
  fill-rule: evenodd;
}
.nav-icon {
  flex-basis: var(--icon-w);
  line-height: 1;
  flex-shrink: 0;
		display: flex;
    justify-content: center;
    align-items: flex-end;
}
.nav-icon svg {
  width: 100%;
}
.nav-icon svg .st0 {
  fill: var(--color-icon);
}
.nav-link {
  color: var(--color-nav);
  display: block;
}
 .nav {
    --color-nav:#4f63a0;
    --color-icon:#4f63a0;
				}
.nav {
    position: fixed;
    z-index: 101;
    opacity: 0;
}

@media print, screen and (max-width: 1200px) {
  .nav {
    --color-nav:#fff;
    --color-icon:#fff;
/*    left: 0;
    bottom: 0;
    background-color: var(--primary);
    width: 100%;
    padding-bottom: env(safe-area-inset-bottom);
    position: fixed;*/
  }
  .nav-item {
    font-size: 2.5vmin;
    flex-basis: 25%;
    text-align: center;
  }
  .nav-item:nth-of-type(n + 2) {
    border-left: 1px #fff solid;
  }
  .nav-link {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.25em;
  }
  .nav-text {
    display: block;
    flex-basis: 100%;
    line-height: 1;
  }
  .nav-link {
    padding: 0.8em 0.1em;
  }
  .nav-icon {
    line-height: 1;
  }
}
@media print, screen and (min-width: 1201px) {
  .nav {
    line-height: 1.2;
				        right: clamp(15px, 5.5555555556vw, 5.5555555556vw);
        top: 15px;
								max-width: 40%;
								margin-left: 60%;
  }
		.nav-icon svg {
  width: 30%;
}
.nav-icon svg#nav-icon3 {
  width: 36%;
		}
  .nav-list {
    display: flex;
  /*  gap: 1em clamp(1em, 2.3529411765vw, 40px);*/
    align-items: center;
        justify-content: space-around;
  }
  .nav-link {
    background-color: transparent;
    transition: 0.3s background-color ease-in-out;
    display: flex;
    align-items: center;
   /* gap: 10px;*/
    color: var(--color-nav);
    font-weight: 500;
  }
  .nav-link:hover {
    text-decoration: none;
    opacity: 1;
    color: var(--primary);
  }
  .nav-link:hover .st0 {
    fill: var(--primary);
  }
  .nav-text {
    white-space: nowrap;
  }
		  .nav-item {
    font-size: 1.5vmin;
    flex-basis: 25%;
    text-align: center;
  }
}
.catchloaded .nav {
  animation: fade_in 1s 2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}