* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  list-style: none;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 700;
  font-style: normal;
  color: white;
}

body {
  overflow-x: hidden;
  scrollbar-width: none;
}

a {
  color: #fff;
  text-decoration: none;
}
a:hover {
  color: yellow;
}
@media (width <= 768px) {
  a {
    -webkit-text-decoration: underline dotted yellow;
            text-decoration: underline dotted yellow;
  }
}

div.all_background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: linear-gradient(to bottom, rgb(26, 91, 189) 0%, rgb(4, 161, 209) 100%);
  background-attachment: fixed;
}

.p-header {
  box-sizing: content-box;
  width: 100%;
  height: 8vh;
  padding-bottom: 2vh;
  position: fixed;
  top: 0;
  z-index: 200;
  opacity: 1;
  display: flex;
  justify-content: space-between;
  background: linear-gradient(to bottom, rgb(26, 91, 189) 0%, rgb(4, 161, 209) 100%);
  background-attachment: fixed;
  -webkit-mask-image: linear-gradient(to bottom, black 62%, transparent 100%);
          mask-image: linear-gradient(to bottom, black 62%, transparent 100%);
}
@media (width <= 768px) {
  .p-header {
    height: 16vw;
  }
}
.p-header__logo {
  position: relative;
  width: 8vh;
  height: 100%;
}
@media (width <= 768px) {
  .p-header__logo {
    width: 16vw;
  }
}
.p-header__logo img {
  position: absolute;
  height: 5vh;
  width: auto;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
@media (width <= 768px) {
  .p-header__logo img {
    height: 6vw;
  }
}
.p-header__nav {
  position: relative;
  width: 8vh;
  height: 100%;
}
@media (width <= 768px) {
  .p-header__nav {
    width: 16vw;
  }
}
.p-header__nav img {
  position: absolute;
  height: 7vh;
  width: auto;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
@media (width <= 768px) {
  .p-header__nav img {
    height: 9vw;
  }
}
.p-header__nav__list {
  display: flex;
  margin: 0;
}
.p-header__nav__list li {
  width: 130px;
  display: inline-block;
  margin-right: 20px;
  text-align: center;
}
.p-header__nav__list li a {
  display: inline-block;
  padding: 20px;
}

div.layer {
  position: absolute;
  width: 100vw;
  left: 0;
  top: 0;
  z-index: 1;
}
div.layer div.top-section {
  width: 100vw;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  z-index: 100;
  position: fixed;
  pointer-events: none;
}
div.layer div.top-section div.hero-logo {
  pointer-events: none;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
  z-index: 99;
  opacity: 1;
}
@media (width <= 768px) {
  div.layer div.top-section div.hero-logo {
    flex-direction: column;
  }
}
div.layer div.top-section div.hero-logo #logo-1 {
  -webkit-mask-image: url(/images/logos/logo_KAKKU_01_K.svg);
          mask-image: url(/images/logos/logo_KAKKU_01_K.svg);
}
div.layer div.top-section div.hero-logo #logo-2 {
  -webkit-mask-image: url(/images/logos/logo_KAKKU_02_A.svg);
          mask-image: url(/images/logos/logo_KAKKU_02_A.svg);
}
div.layer div.top-section div.hero-logo #logo-3 {
  -webkit-mask-image: url(/images/logos/logo_KAKKU_03_K.svg);
          mask-image: url(/images/logos/logo_KAKKU_03_K.svg);
}
div.layer div.top-section div.hero-logo #logo-4 {
  -webkit-mask-image: url(/images/logos/logo_KAKKU_04_K.svg);
          mask-image: url(/images/logos/logo_KAKKU_04_K.svg);
}
div.layer div.top-section div.hero-logo #logo-5 {
  -webkit-mask-image: url(/images/logos/logo_KAKKU_05_U.svg);
          mask-image: url(/images/logos/logo_KAKKU_05_U.svg);
}
div.layer div.top-section div.hero-logo .logo {
  width: calc((100vw - 4vw * 6) / 5);
  height: calc((100vw - 4vw * 6) / 5 * 1.086);
  margin: 0 4vw 0 0;
  background-image: linear-gradient(to bottom, rgb(30, 153, 235), rgb(18, 94, 165));
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: 100% auto;
          mask-size: 100% auto;
}
div.layer div.top-section div.hero-logo .logo:first-child {
  margin: 0 4vw 0 4vw;
}
@media (width <= 768px) {
  div.layer div.top-section div.hero-logo .logo {
    width: calc((100vh - 4vh * 6) / 5 / 1.086);
    height: calc((100vh - 4vh * 6) / 5);
    -webkit-mask-size: auto 100%;
            mask-size: auto 100%;
    margin: 0 0 4vh 0;
  }
  div.layer div.top-section div.hero-logo .logo:first-child {
    margin: 4vh 0 4vh 0;
  }
}
div.layer div.top-section div.hero-logo div.top-yomi {
  position: fixed;
  height: auto;
  width: calc((100vw - 4vw * 6) / 5);
  padding: 0 calc(4vw * 0.2) 0 calc(4vw * 0.2);
  top: calc((50vh + ((100vw - 4vw * 6) / 5 * 1.086 * 0.5)) + 4vw * 0.5);
  right: 4vw;
  z-index: 70;
  opacity: 0;
}
@media (width <= 768px) {
  div.layer div.top-section div.hero-logo div.top-yomi {
    width: calc((100vh - 4vh * 6)/5/1.086 * 0.9);
    top: 50%;
    left: calc(50vw + (100vh - 4vh * 6) / 5 / 1.086 / 2 + 1.5vw);
    transform: translate(0, -50%);
  }
}
div.layer div.top-section div.hero-logo div.top-yomi h2 {
  color: rgb(230, 230, 230);
  font-size: 1.5vw;
  -moz-text-align-last: justify;
       text-align-last: justify;
  font-family: "M PLUS Rounded 1c";
  font-style: normal;
  font-weight: 700;
}
@media (width <= 768px) {
  div.layer div.top-section div.hero-logo div.top-yomi h2 {
    font-size: 1.5vh;
  }
}
div.layer div.top-section div.clouds .cloud {
  position: absolute;
}

div.contents {
  z-index: 50;
  position: relative;
  width: 80vw;
  top: 600vh;
  margin: 0 auto;
}
div.contents__normal {
  display: grid;
  gap: 6vw;
  grid-template-columns: 1fr 2fr;
  margin-bottom: 5%;
}
@media (width <= 768px) {
  div.contents__normal {
    grid-template-columns: 1fr;
    margin-bottom: 14%;
  }
}
div.contents__normal .title {
  text-align: right;
  font-size: 1.3vw;
  -webkit-text-decoration: yellow wavy underline;
          text-decoration: yellow wavy underline;
}
@media (width <= 768px) {
  div.contents__normal .title {
    text-align: left;
    font-size: 1.8vh;
  }
}
div.contents__normal .inner {
  font-size: 2vw;
}
@media (width <= 768px) {
  div.contents__normal .inner {
    text-align: left;
    font-size: 2vh;
  }
}
div.contents__normal .inner ul li {
  list-style: square;
  margin-bottom: 1.5vw;
  margin-left: 1em;
}
div.contents__normal .inner p {
  margin-bottom: 1.5vw;
}
div.contents__normal .inner div.form-btn {
  display: inline-block;
  background-color: rgb(0, 64, 155);
  border-radius: 0.5vw;
  padding: 1vw 2vw 1vw 2vw;
}
@media (width <= 768px) {
  div.contents__normal .inner div.form-btn {
    border-radius: 1vh;
    padding: 1vh 2vh 1vh 2vh;
  }
}
div.contents .marg {
  height: 10.5vw;
}

div.mito-city {
  position: fixed;
  width: 100vw;
  bottom: 0;
  z-index: 100;
}
@media (width <= 768px) {
  div.mito-city {
    overflow-x: hidden;
    right: 0;
    height: auto;
    width: 140%;
    bottom: 0;
  }
}
div.mito-city img {
  width: 100%;
}
@media (width <= 768px) {
  div.mito-city img {
    width: 160%;
  }
}
div.mito-city p.rights {
  position: fixed;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 700;
  font-style: normal;
  bottom: 0.3vh;
  left: 0.4vw;
  font-size: 1.4vh;
  color: white;
}

div.loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  display: flex;
  opacity: 1;
  background-color: #111;
  justify-content: center;
  width: 100%;
  align-items: center;
  z-index: 400;
  pointer-events: none;
}
div.loading-overlay svg {
  scale: 0.3;
}
div.loading-overlay svg circle {
  fill: #fff;
}

div.noise {
  position: fixed;
  z-index: 300;
  width: 100vw;
  height: 100vh;
  left: 0;
  top: 0;
  background-image: url(/images/various/my_noise_02.jpg);
  background-repeat: repeat-y;
  mix-blend-mode: overlay;
  scale: 1;
  opacity: 0.1;
  pointer-events: none;
}
/*# sourceMappingURL=style.css.map */