* {
  box-sizing: border-box;
  position: relative; }

.sp-only {
  display: none; }

.pc-only {
  display: block; }

.exlight {
  font-weight: 200; }

.light {
  font-weight: 300; }

.regular {
  font-weight: 400; }

.medium {
  font-weight: 500; }

.semibold {
  font-weight: 600; }

.bold {
  font-weight: 700; }

.black {
  font-weight: 900; }

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

.jp {
  font-family: 'Noto Sans JP', sans-serif; }

html, body {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

body {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 14px;
  background: no-repeat url("../images/main.png") 50% 50%;
  background-size: cover; }

.telLink {
  color: #333;
  text-decoration: none; }

.is-eventNone {
  pointer-events: none; }

.wrapper {
  position: relative;
  z-index: 2; }

hr {
  border: 0;
  box-shadow: 0;
  margin: 0;
  padding: 0; }

h1 {
  position: fixed;
  text-align: left;
  font-size: 1.5rem;
  font-family: monospace;
  width: 50%;
  top: 1em;
  z-index: 9999;
  left: 1em; }
  h1 em {
    font-weight: bold; }

.container {
  max-height: 100vh;
  overflow-y: scroll;
  -ms-scroll-snap-type: y mandatory;
  scroll-snap-type: y mandatory; }

.container.proximity {
  -ms-scroll-snap-type: y proximity;
  scroll-snap-type: y proximity; }

.container > ul > li {
  color: #333;
  scroll-snap-align: start;
  overflow: hidden;
  display: block;
  background: lightgray; }
  .container > ul > li:first-child {
    background: transparent;
    display: block;
    width: 100%;
    height: 100vh; }

.video-container {
  width: 100%;
  height: 100vh;
  position: fixed;
  z-index: 1; }

.full_img {
  height: 100%;
  object-fit: cover;
  display: block; }

.hero_video {
  display: block;
  width: 100vw;
  height: 120vh;
  margin-top: -4%;
  position: fixed;
  z-index: 1; }

.section {
  background: lightgray;
  box-sizing: border-box;
  position: relative;
  display: block;
  min-height: 100vh; }
  .section .inner {
    max-width: 1280px;
    margin: 0 auto; }
  .section.about_us {
    background: url(../images/about_bg.png) center center no-repeat;
    background-size: cover; }
    .section.about_us .inner {
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: space-around; }
      .section.about_us .inner .about_anim,
      .section.about_us .inner .about_list {
        width: 50%; }

.section.about_us .about_anim {
  position: relative; }

.section.about_us .about_us_circ {
  position: absolute;
  max-width: 100%;
  top: 126px;
  left: 124px;
  z-index: 1; }

.section.about_us .about_us_ttl {
  position: absolute;
  z-index: 2;
  left: 238px;
  top: 290px;
  opacity: 0; }

.section.about_us > hr {
  height: 3px;
  width: 100%;
  background-color: #E84653;
  position: absolute;
  bottom: 0;
  display: block; }
  .section.about_us > hr::after {
    height: 3px;
    position: absolute;
    width: 50%;
    right: 0;
    bottom: 0;
    background-color: #74B4E3;
    content: ""; }

.about_list ul {
  display: block;
  padding-left: 4em;
  opacity: 0; }
  .about_list ul li {
    padding: 0.75em;
    text-align: left;
    display: flex; }
    .about_list ul li h3 {
      color: #6C6C6C;
      font-size: 13px;
      letter-spacing: 0.2em;
      width: 120px; }
    .about_list ul li p {
      color: #404040;
      font-size: 14px; }

.section.access {
  background: url(../images/access_bg.png) center center no-repeat;
  background-size: cover;
  padding: 0; }
  .section.access .access_info {
    background: url(../images/access_dot_bg.png) 0 80% no-repeat;
    background-size: cover;
    opacity: 0;
    padding: 40px 0; }

.section.access > div > div {
  padding: 80px;
  padding-bottom: 40px; }

.section.access h2 {
  font-size: 28px;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 0 10px #CCC;
  margin-bottom: 2em;
  opacity: 0; }

.section.access h2 span {
  display: block;
  font-size: 13px;
  margin-top: 1em; }

.section.access h3 {
  font-size: 16px;
  line-height: 1.6em;
  opacity: 0;
  text-align: center; }

.section.access h4, .section.access p {
  text-align: left; }

.section.access h4 {
  font-size: 13px;
  margin-bottom: 0.25em; }

.section.access p {
  font-size: 14px;
  margin-bottom: 100px;
  line-height: 2; }

.section.access > div hr {
  height: 60px;
  width: 60px;
  display: block;
  background: url(../images/dots.png) center center no-repeat;
  background-size: contain;
  margin-left: 0.5em; }

.section.access > hr {
  height: 3px;
  width: 100%;
  background-color: #8FAB52;
  position: absolute;
  bottom: 0;
  display: block; }
  .section.access > hr::after {
    height: 3px;
    position: absolute;
    width: 50%;
    right: 0;
    bottom: 0;
    background-color: #F5AC48;
    content: ""; }

.section.talk_to_us {
  background: url(../images/talk_to_us_bg.png) center center no-repeat;
  background-size: cover; }
  .section.talk_to_us .talk_to_us_ttl {
    position: absolute;
    z-index: 2;
    left: 75px;
    top: 107px;
    opacity: 0; }
  .section.talk_to_us .inner {
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 100%;
    min-height: 100vh; }
    .section.talk_to_us .inner div {
      width: 50%; }

.section.talk_to_us img {
  display: block;
  margin: 0 auto; }

.section.talk_to_us form .form_group {
  padding: 10px 0;
  display: flex;
  align-items: center;
  width: 100%; }

.section.talk_to_us form {
  opacity: 0; }

.section.talk_to_us form .form_group label {
  width: 120px;
  display: inline-block;
  text-transform: uppercase;
  font-size: 13px;
  text-align: right;
  padding-right: 40px; }

.section.talk_to_us form .form_group input, .section.talk_to_us form .form_group textarea {
  background: rgba(0, 0, 0, 0);
  border: 1px solid #b3b3b3;
  width: 65%;
  padding: 0.75em; }

.section.talk_to_us form .form_group textarea {
  height: 240px; }

.section.talk_to_us form button[type="submit"] {
  align-items: center;
  background: #343434;
  border: 1px solid #343434;
  border-radius: 0;
  color: #FFF;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  letter-spacing: 0.15em;
  text-align: center;
  text-transform: uppercase;
  justify-content: center;
  margin: 40px auto 0;
  transition: 0.3s;
  width: 240px;
  height: 48px; }

.section.talk_to_us form button[type="submit"]:hover {
  background: transparent;
  color: #343434; }

.section.talk_to_us .talk_to_us_anim {
  width: 307px;
  height: 356px;
  margin: 0 auto; }

.section.talk_to_us > hr {
  height: 3px;
  width: 100%;
  background-color: #92D0D2;
  position: absolute;
  bottom: 0;
  display: block; }
  .section.talk_to_us > hr::after {
    height: 3px;
    position: absolute;
    width: 50%;
    right: 0;
    bottom: 0;
    background-color: #6580BF;
    content: ""; }

.section.talk_to_us .talk_to_us_square {
  margin-top: 30px; }

.google_map {
  border: 0;
  width: 100vw;
  height: 35vh;
  display: block;
  background: lightgray;
  z-index: 999;
  position: relative; }

@media (min-aspect-ratio: 16 / 9) {
  iframe {
    /* height = 100 * (9 / 16) = 56.25 */
    height: 56.25vw; } }
@media (max-aspect-ratio: 16 / 9) {
  iframe {
    /* width = 100 / (9 / 16) = 177.777777 */
    width: 177.78vh; } }
@media screen and (max-width: 768px) {
  .sp-only {
    display: block; }

  .pc-only {
    display: none; }

  h1 img {
    width: 100%; }

  .hero_video {
    height: 100vh;
    margin-top: 0;
    width: 1500px;
    left: -555px; }

  .container > ul > li:first-child {
    height: 100vh; }

  .full_img {
    height: auto;
    width: 100%; }

  .section.access .access_info {
    padding-left: 30px;
    padding-right: 30px; }
  .section.access .titleBox {
    padding-bottom: 80px; }

  .section.about_us {
    display: flex; }
    .section.about_us .inner {
      display: block; }
      .section.about_us .inner .about_anim,
      .section.about_us .inner .about_list {
        width: 100%; }

  .section.about_us .about_anim {
    position: relative;
    left: -200px;
    top: -160px; }

  .about_list ul {
    padding-left: 0; }

  .about_list ul li {
    flex-direction: column;
    padding-bottom: 20px;
    padding-top: 0; }

  .about_list ul li p {
    margin-top: 10px;
    font-size: 14px; }

  .section.about_us .about_us_ttl {
    left: 220px;
    top: 280px; }

  .section.about_us .about_list {
    margin-top: -140px; }

  .section.access > div:first-child {
    flex-direction: column-reverse;
    display: flex; }

  .section.talk_to_us .inner {
    flex-wrap: wrap; }
    .section.talk_to_us .inner div {
      width: 100%; }
      .section.talk_to_us .inner div .talk_to_us_anim {
        width: 50%;
        margin: 0 auto; }
  .section.talk_to_us form {
    padding-bottom: 80px; }

  .section.talk_to_us form button[type="submit"] {
    margin: 0 auto !important;
    margin-top: 40px !important; }

  .section.talk_to_us form .form_group input,
  .section.talk_to_us form .form_group textarea {
    width: 72%; } }
@media screen and (max-width: 480px) {
  .section.about_us .inner {
    padding-bottom: 80px; }
    .section.about_us .inner .about_anim,
    .section.about_us .inner .about_list {
      width: 90%;
      margin-left: auto;
      margin-right: auto; }

  .section.about_us .about_list {
    margin-top: -200px; }

  .section.access .titleBox {
    padding: 80px 10%; }

  .section.access h4 {
    margin-bottom: 0.75em; }
  .section.access .access_info {
    padding-left: 0;
    padding-right: 0; }
    .section.access .access_info .inner {
      padding: 40px 10%; }

  .section.access > div hr {
    background: url(../images/dots.png) center 45% no-repeat;
    background-size: contain; }

  .section.talk_to_us .inner {
    padding-top: 60px; }

  .section.talk_to_us .inner div .talk_to_us_anim {
    width: 307px; }

  .section.talk_to_us form {
    padding-top: 40px; }
    .section.talk_to_us form .form_group {
      display: block;
      margin: 0 auto;
      width: 80%; }
      .section.talk_to_us form .form_group label {
        margin-bottom: 1em;
        text-align: left; }
      .section.talk_to_us form .form_group input, .section.talk_to_us form .form_group textarea {
        width: 100%; } }