body {
  font-family: "Zen Kaku Gothic New", sans-serif;
  color: #353f45;
}
body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: #fff;
  z-index: 999;
  -webkit-animation: PageAnime-fade 0.8s forwards;
  animation: PageAnime-fade 0.8s forwards;
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}

@-webkit-keyframes PageAnime-fade {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}

@keyframes PageAnime-fade {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}
/*-----------------------------------
  utility
-----------------------------------*/
.u-display-none {
  display: none !important;
}

.u-font-jp {
  font-family: "Zen Kaku Gothic New", sans-serif;
}

.u-font-en {
  font-family: "Roboto", sans-serif;
}

.u-font-en__secound {
  font-family: "Charmonman", cursive;
}

.u-mt-0 {
  margin-top: 0 !important;
}

.u-mb-0 {
  margin-bottom: 0 !important;
}

.u-font-s {
  font-size: calc(13 / 16 * 1rem);
}
@media screen and (max-width: 767px) {
  .u-font-s {
    font-size: calc(12 / 16 * 1rem);
  }
}

.u-txt-center {
  text-align: center;
}

.u-txt-uppercase {
  text-transform: uppercase;
}

.u-flex-row {
  flex-direction: row;
}

.u-flex-column {
  flex-direction: column;
}

/*-----------------------------------
  layout
-----------------------------------*/
.l-root-container {
  display: grid;
  grid-template-rows: auto 1fr auto;
  grid-template-columns: 100%;
  min-height: 100vh;
}

:root {
  --vw: 1vw;
}

.l-wid100vw {
  width: calc(var(--vw) * 100);
  margin: 0 calc(50% - 50vw);
}

.l-content-container {
  width: 90%;
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
}

.l-content-block {
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
}
.l-content-block:not(:has(.l-content-block-l)) {
  width: 92%;
}
.l-content-block-s {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
.l-content-block-s:not(:has(.l-content-block)),
.l-content-block-s:not(:has(.l-content-block-l)) {
  width: 88%;
}

.l-content-block-l {
  width: 88%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

.l-content-block-xs {
  width: 88%;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.l-column-1 {
  width: 88%;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
}

.l-column-1.-wide {
  width: 88%;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

.l-column-1.-narrow {
  width: 88%;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

.l-column-2.-sidebar {
  width: 88%;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  gap: 2rem;
  justify-content: space-between;
}
.l-column-2.-sidebar .l-column-2__content {
  width: 75%;
  max-width: 672px;
}
.l-column-2.-sidebar .l-column-2__sidebar {
  width: 25%;
  max-width: 230px;
}
@media screen and (max-width: 960px) {
  .l-column-2.-sidebar {
    flex-wrap: wrap;
    gap: calc(80 / 16 * 1rem);
  }
  .l-column-2.-sidebar .l-column-2__sidebar,
  .l-column-2.-sidebar .l-column-2__content {
    width: 100%;
    max-width: 100%;
  }
}
@media screen and (max-width: 480px) {
  main {
    margin-top: 64px;
  }
}
.breadcrumb {
  background-color: #eff8ff;
}
.breadcrumb_inner {
  font-size: calc(11 / 16 * 1rem);
  width: 88%;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
  padding: 0.8rem 0 0.25rem;
}

/*# sourceMappingURL=base.css.map */
main {
  margin-top: 88px;
  letter-spacing: 0.075em;
  line-height: 1.625;
  font-weight: 500;
}
.l-column-2_containar {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1024px) {
  main {
    margin-top: 102px;
  }
}
@media screen and (max-width: 960px) {
  main {
    margin-top: 80px;
  }
}
@media screen and (max-width: 1024px) {
  main {
    margin-top: 80px;
  }
  .breadcrumb_inner {
    padding: 0.25rem 0;
  }
}
@media screen and (max-width: 480px) {
  main {
    margin-top: 64px;
  }
}