@charset "utf-8";
/* ↓↓↓ fv ↓↓↓ */
.fv {
  width: 100%;
  padding-top: 80px;
  height: 470px;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .fv {
    max-height: 87.47vw;
    padding-top: 70px;
  }
}

.fv .inner {
  position: relative; 
  width: 100%;
  height: 100%;
}

.fv .inner .fv-image {
  width: 100%;
  height: 100%;
}

.fv .inner .fv-image img {
  height: 100%;
  object-fit: cover;
  object-position: center;
}

@media screen and (max-width: 768px) {
  .fv .inner .fv-image img {
    object-position: bottom;
  }
}

.fv .inner .title {
  position: absolute;
  transform: translate(-50%, -50%);
  top: 55%;
  left: 50%;
  color: #fff;
  font-size: 4rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  z-index: 1;
}

@media screen and (max-width: 768px) {
  .fv .inner .title {
    font-size: calc((40 - 24) * ((100vw - 375px) / (768 - 375)) + 24px);
  }
}

.fv .inner .wave {
  position: absolute;
  width: 100vw;
  left: 0;
  bottom: -1px;
  z-index: 1;
}

.fv .inner .breadcrumb  {
  width: 100%;
}

/* ↑↑↑ fv ↑↑↑ */

main {
  overflow: hidden;
}

/* ↓↓↓ access ↓↓↓ */
.access {
  position: relative;
}

.access .container {
  max-width: 1280px;
  margin: 0 auto;
}

.access .container .inner {
  padding: 80px 20px 15.625vw;
}

@media screen and (max-width: 768px) {
  .access .container .inner {
    padding: 32px 0 26.6667vw;
  }
}

.access .container .access-box {
  max-width: 1068px;
  margin: 40px auto 0;
}

@media screen and (max-width: 768px) {
  .access .container .access-box {
    margin: 30px auto 0;
  }
}

.access .container .access-box .address-group {
  text-align: center;
  font-size: 1.7rem;
  font-weight: 700;
}

@media screen and (max-width: 768px) {
  .access .container .access-box .address-group {
    max-width: 520px;
    width: 80.534%;
    margin: 0 auto;
  }
}

.access .container .access-box .address-group .address {
  line-height: 2.5;
}

.access .container .access-box .access-list {
  display: flex;
  justify-content: space-between;
  margin: 48px auto 50px;
}

@media screen and (max-width: 768px) {
  .access .container .access-box .access-list {
    max-width: 520px;
    width: 80.534%;
    margin: 8.534% auto 50px;
    flex-direction: column;
  }
}

.access .container .access-box .access-list .item {
  width: calc((100% - 24px) / 2);
  border-radius: 15px;
  background-color: #F5F4F4;
  padding: 40px 4.495%;
}

@media screen and (max-width: 768px) {
  .access .container .access-box .access-list .item {
    width: 100%;
    padding: 32px 20px;
  }
  .access .container .access-box .access-list .item:not(:last-child) {
    margin-bottom: 8px;
  }
}

.access .container .access-box .access-list .item .how {
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--oyugiwa-red);
  margin-bottom: 24px;
}

@media screen and (max-width: 768px) {
  .access .container .access-box .access-list .item .how {
    font-size: 2rem;
  }
}

.access .container .access-box .access-list .item .how img {
  width: 50px;
  margin-right: 16px;
}

.access .container .access-box .access-list .item .text {
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  margin-bottom: 10px;
  text-align: justify;
}

.access .container .access-box .google-map {
  margin: 30px auto 0;
}

.access .container .access-box .google-map .map {
  width: 100%;
  height: 500px;
}

.access .container .access-box .access-list .item .text .parking {
  width: 24px;
  margin-right: 8px;
}

.access .container .access-box .more-btn {
  width: 302px;
  margin: 0 auto;
}
/* ↑↑↑ access ↑↑↑ */