.pagevisual {
  background-image: url("../img/mission/mv.png");
  background-position: center top 100%;
}

@media screen and (max-width: 770px) {
  .pagevisual {
    background-image: url("../img/mission/mv.png");
    background-position: center top 0%;
  }
}
/*--------------------------------------------------------------------*/
section.message {
  padding: 60px 0 50px 0;
}

section.message .image:before {
  width: 40%;
  height: 100%;
  background-image: url("../img/dots.png");
  background-repeat: repeat;
  background-position: left center;
  background-size: auto;
  right: 0%;
  bottom: 0;
  transform: translate(70%, 25%);
  z-index: 0;
}

section.message .the_message {
  padding: 2em 0;
}

@media screen and (max-width: 770px) {
  section.message .image:before {
    background-image: url("../img/dots@2x.png");
    background-size: 8px;
  }
  section.message {
    padding: 30px 5vw;
  }
}
/*--------------------------------------------------------------------*/
section.company {
  padding: 50px 0 75px 0;
}

section.company .heading {
  margin-bottom: 3em;
}

section.company table {
  margin: 0 auto;
}

section.company tr {
  border-bottom: 1px dotted #CFCFCF;
}

section.company th {
  font-weight: inherit;
}

section.company .index {
  padding: 1em;
  padding-right: 4em;
}

section.company .value {
  padding: 1em 0;
}

@media screen and (max-width: 770px) {
  section.company {
    padding: 25px 5vw 37px 5vw;
  }
  section.company .heading {
    margin-bottom: 2em;
  }
  section.company th,
  section.company td {
    display: block;
  }
  section.company .index {
    padding: 1em;
    padding-right: 0;
  }
  section.company .value {
    padding: 1em;
    padding-top: 0;
    line-height: 2;
  }
}
/*--------------------------------------------------------------------*/
section.access {
  padding: 50px 0 150px 0;
}

section.access .gmap {
  padding-bottom: 3em;
}

section.access .direction {
  margin-bottom: 2em;
}

section.access .direction .index {
  padding-left: 1em;
  margin-bottom: 1em;
}

section.access .direction .index:before {
  width: 4px;
  height: 1em;
  background-color: #208EC7;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

section.access .notation {
  border: 5px solid #EEEEEE;
  padding: 3em;
}

@media screen and (max-width: 770px) {
  section.access {
    padding: 25px 5vw 75px 5vw;
  }
  section.access .gmap {
    padding-bottom: 3em;
  }
  section.access .gmap iframe {
    width: 100%;
    height: 320px;
  }
  section.access .direction .train {
    margin-bottom: 2em;
  }
}
section.introduction .message {
  padding-right: 7%;
}

section.introduction .title {
  margin-bottom: 1.5em;
  line-height: 1.2;
  padding-left: 1.2em;
  border-left: 4px solid #208EC7;
}

section.introduction .index {
  font-size: 4rem;
  margin-bottom: 1em;
  white-space: nowrap;
}

section.introduction .text p {
  margin-bottom: 2em;
}

@media screen and (max-width: 770px) {
  section.introduction .area {
    flex-direction: column-reverse;
  }
  section.introduction .inner {
    padding: 2em 5vw;
  }
  section.introduction .message {
    padding-right: 0;
  }
  section.introduction .index {
    font-size: 8vw;
    white-space: normal;
  }
}
section.introduction .message,
section.introduction .image {
  transform: translateY(50px);
  opacity: 0;
  transition: transform 2s, opacity 2s;
}

section.introduction .image {
  transition-delay: 0.4s;
}

section.introduction.-anim-start .message,
section.introduction.-anim-start .image {
  transform: translateY(0px);
  opacity: 1;
}

@media screen and (max-width: 770px) {
  section.introduction .message {
    transition-delay: 0.4s;
  }
  section.introduction .image {
    transition-delay: 0s;
    margin-bottom: 3em;
  }
}
section.introduction .image {
  position: relative;
  width: 1080px;
  max-width: 55vw;
  align-self: flex-start;
  margin-top: 143px;
  height: 656px;
}

section.introduction .image img {
  position: absolute;
  object-fit: cover;
  object-position: center top;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

@media screen and (max-width: 770px) {
  section.introduction .image {
    width: 100%;
    height: auto;
    max-width: none;
    max-height: 50vh;
    margin: 0 auto 3em;
    overflow: hidden;
  }
  section.introduction .image img {
    position: static;
    object-fit: cover;
    object-position: center top;
    width: 100%;
    height: 50vh;
    top: 0;
    left: 0;
  }
}
@media screen and (max-width: 500px) {
  section.introduction .image {
    max-width: 380px;
  }
  section.introduction .image img {
    transform: scale(1.5);
    transform-origin: center top;
  }
}