@media only screen and (min-width: 768px) {
  .access-trainRoute,
  .access-trainStation,
  .access-car {
    padding-inline: 8.3333333333vw;
  }
}

.keyVisual .photo__image {
  width: 100%;
}

.introSect {
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 768px) {
  .introSect {
    height: 62.5vw;
    padding-top: 6.9444444444vw;
  }
}
@media only screen and (max-width: 767px) {
  .introSect {
    height: 800px;
    padding-top: 80px;
  }
}
.introSect__head {
  position: relative;
  z-index: 1;
}
.introSect__head .headingUnit {
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .introSect__head .headingUnit {
    margin-inline: auto;
    max-width: 480px;
  }
}
@media only screen and (max-width: 767px) {
  .introSect__head .headingUnit {
    padding-inline: 8.2051282051vw;
  }
}
@media only screen and (max-width: 767px) {
  .introSect__head .headingUnit .lead {
    text-align: left;
  }
}
.introSect__cont {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.introSect__cont .parallaxPhoto {
  height: 100%;
  width: 100%;
}
.introSect__cont .parallaxPhoto .photo {
  width: 100%;
  height: 100%;
}
.introSect__cont .parallaxPhoto .photo__image {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center top;
     object-position: center top;
}

@media only screen and (min-width: 768px) {
  .routeSect {
    margin-inline: auto;
    max-width: 1200px;
    padding-block: 160px;
  }
}
@media only screen and (max-width: 767px) {
  .routeSect {
    width: 100%;
    padding: 100px 5.1282051282vw;
  }
}
.routeSect__inner {
  display: flex;
}
@media only screen and (min-width: 768px) {
  .routeSect__inner {
    justify-content: space-between;
  }
}
@media only screen and (max-width: 767px) {
  .routeSect__inner {
    flex-direction: column-reverse;
    gap: 75px;
    width: 100%;
  }
}
@media only screen and (min-width: 768px) {
  .routeSect__head {
    width: 25.6944444444vw;
    max-width: 370px;
  }
}
@media only screen and (max-width: 767px) {
  .routeSect__head {
    width: 100%;
    padding-inline: 20px;
  }
}
.routeSect__head .headingUnit {
  color: rgba(255, 255, 255, 0.7);
  text-align: left;
}
.routeSect__head .headingUnit .headingLv4 {
  line-height: 1.5;
}
.routeSect__head .headingUnit .headingLv4:before {
  content: "";
  display: block;
  height: 0;
  width: 0;
  margin-top: calc((1 - 1.5) * 0.5em);
}
.routeSect__head .headingUnit .headingLv4:after {
  content: "";
  display: block;
  height: 0;
  width: 0;
  margin-bottom: calc((1 - 1.5) * 0.5em);
}
@media only screen and (max-width: 767px) {
  .routeSect__head .headingUnit .headingLv4 {
    font-size: 5.1282051282vw;
  }
}
@media only screen and (max-width: 767px) {
  .routeSect__head .headingUnit .lead {
    font-size: 3.3333333333vw;
  }
}
.routeSect__head .headingUnit--line .headingLv4 {
  position: relative;
}
@media only screen and (min-width: 768px) {
  .routeSect__head .headingUnit--line .headingLv4 {
    padding-bottom: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .routeSect__head .headingUnit--line .headingLv4 {
    padding-bottom: 24px;
  }
}
.routeSect__head .headingUnit--line .headingLv4::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.2) 100%);
}
@media only screen and (min-width: 768px) {
  .routeSect__head .headingUnit--line .lead {
    margin-top: 24px;
  }
}
@media only screen and (max-width: 767px) {
  .routeSect__head .headingUnit--line .lead {
    margin-top: 40px;
  }
}
@media only screen and (min-width: 768px) {
  .routeSect__cont {
    width: 50.2777777778vw;
    max-width: 724px;
  }
}
@media only screen and (max-width: 767px) {
  .routeSect__cont {
    width: 100%;
  }
}

@media only screen and (min-width: 768px) {
  .stationSect {
    width: calc(83.3333333333px * 1vw);
    max-width: 1200px;
    margin-inline: auto;
    padding-bottom: 160px;
  }
}
@media only screen and (max-width: 767px) {
  .stationSect {
    padding-inline: 8.2051282051vw;
    padding-bottom: 30.7692307692vw;
  }
}
@media only screen and (min-width: 768px) {
  .stationSect__thumbnailList {
    width: 100%;
    display: flex;
    justify-content: space-between;
  }
}
@media only screen and (max-width: 767px) {
  .stationSect__thumbnailList {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 3.8461538462vw;
  }
}
.stationSect__thumbnailItem {
  position: relative;
}
@media only screen and (min-width: 768px) {
  .stationSect__thumbnailItem {
    width: 19.7916666667vw;
    max-width: 285px;
  }
}
@media only screen and (max-width: 767px) {
  .stationSect__thumbnailItem {
    width: 100%;
  }
}
.stationSect__thumbnailTitle {
  position: absolute;
  font-family: "EB Garamond", serif;
  color: #ffffff;
  z-index: 1;
}
@media only screen and (min-width: 768px) {
  .stationSect__thumbnailTitle {
    top: 20px;
    left: 20px;
    font-size: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .stationSect__thumbnailTitle {
    top: 10px;
    left: 10px;
    font-size: 3.5897435897vw;
  }
}
@media only screen and (min-width: 768px) {
  .stationSect__inner {
    display: flex;
    justify-content: space-between;
    margin-top: 56px;
  }
}
@media only screen and (max-width: 767px) {
  .stationSect__inner {
    margin-top: 14.358974359vw;
  }
}

@media only screen and (max-width: 767px) {
  .stationList {
    padding-inline: 2.0512820513vw;
  }
}
@media only screen and (max-width: 767px) {
  .stationList + * {
    margin-top: 18.9743589744vw;
  }
}
.stationList__head {
  line-height: 1.5;
}
.stationList__head:before {
  content: "";
  display: block;
  height: 0;
  width: 0;
  margin-top: calc((1 - 1.5) * 0.5em);
}
.stationList__head:after {
  content: "";
  display: block;
  height: 0;
  width: 0;
  margin-bottom: calc((1 - 1.5) * 0.5em);
}
.stationList__head {
  text-align: left;
  color: rgba(255, 255, 255, 0.7);
  font-feature-settings: "halt" on;
  position: relative;
}
@media only screen and (min-width: 768px) {
  .stationList__head {
    padding-left: 32px;
    padding-block: 10px 15px;
    font-size: 16px;
  }
}
@media print, screen and (min-width: 768px) and (max-width: 1200px) {
  .stationList__head {
    padding-left: 2.6666666667vw;
    padding-block: 0.8333333333vw 1.25vw;
    font-size: 1.3333333333vw;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__head {
    padding-left: 8.2051282051vw;
    padding-block: 10px 15px;
    font-size: 4.1025641026vw;
  }
}
.stationList__head::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 100%;
  background-color: #999999;
}
.stationList__head .num {
  font-family: "EB Garamond", serif;
  line-height: 0;
}
@media only screen and (min-width: 768px) {
  .stationList__head .num {
    font-size: 40px;
  }
}
@media print, screen and (min-width: 768px) and (max-width: 1200px) {
  .stationList__head .num {
    font-size: 3.3333333333vw;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__head .num {
    font-size: 10.2564102564vw;
  }
}
.stationList__head .gradientOrange {
  background: linear-gradient(277deg, #F7CBA8 -54.27%, #9F4F23 155.12%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media only screen and (min-width: 768px) {
  .stationList__head + * {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__head + * {
    margin-top: 8.2051282051vw;
  }
}
@media only screen and (min-width: 768px) {
  .stationList__cont {
    display: flex;
    justify-content: space-between;
    max-width: 750px;
    width: 52.0833333333vw;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__cont {
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__inner {
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__inner + .stationList__inner {
    margin-top: 12.8205128205vw;
  }
}
.stationList__item {
  position: relative;
}
@media only screen and (min-width: 768px) {
  .stationList__item {
    max-width: 360px;
    width: 25vw;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__item {
    width: 100%;
  }
}
@media only screen and (min-width: 768px) {
  .stationList__item + * {
    margin-top: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__item + * {
    margin-top: 11.0256410256vw;
  }
}
.stationList__itemWrap {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  position: relative;
}
@media only screen and (min-width: 768px) {
  .stationList__itemWrap {
    gap: 0.9722222222vw;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__itemWrap {
    gap: 5.1282051282vw;
  }
}
@media only screen and (min-width: 768px) {
  .stationList__itemWrap--small .stationList__name .large {
    font-size: 24px;
  }
}
@media print, screen and (min-width: 768px) and (max-width: 1200px) {
  .stationList__itemWrap--small .stationList__name .large {
    font-size: 2vw;
  }
}
.stationList__name {
  line-height: 1;
}
.stationList__name:before {
  content: "";
  display: block;
  height: 0;
  width: 0;
  margin-top: calc((1 - 1) * 0.5em);
}
.stationList__name:after {
  content: "";
  display: block;
  height: 0;
  width: 0;
  margin-bottom: calc((1 - 1) * 0.5em);
}
.stationList__name {
  color: rgba(255, 255, 255, 0.7);
  position: relative;
  flex-shrink: 0;
}
@media only screen and (min-width: 768px) {
  .stationList__name {
    font-size: 16px;
  }
}
@media print, screen and (min-width: 768px) and (max-width: 1200px) {
  .stationList__name {
    font-size: 1.3333333333vw;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__name {
    font-size: 4.1025641026vw;
  }
}
@media only screen and (min-width: 768px) {
  .stationList__name .large {
    font-size: 28px;
  }
}
@media print, screen and (min-width: 768px) and (max-width: 1200px) {
  .stationList__name .large {
    font-size: 2.3333333333vw;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__name .large {
    font-size: 6.1538461538vw;
  }
}
.stationList__dot {
  align-self: center;
  height: 12px;
  flex: 1;
  border-bottom: 4px dotted #999999;
}
.stationList__time {
  text-align: right;
  width: -moz-fit-content;
  width: fit-content;
  color: rgba(255, 255, 255, 0.7);
}
@media only screen and (min-width: 768px) {
  .stationList__time {
    font-size: 16px;
  }
}
@media print, screen and (min-width: 768px) and (max-width: 1200px) {
  .stationList__time {
    font-size: 1.3333333333vw;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__time {
    white-space: nowrap;
    font-size: 4.1025641026vw;
  }
}
.stationList__time .gradientOrange {
  background: linear-gradient(277deg, #F7CBA8 -54.27%, #9F4F23 155.12%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.stationList__time .num {
  font-family: "EB Garamond", serif;
  line-height: 0;
}
@media only screen and (min-width: 768px) {
  .stationList__time .num {
    padding-inline: 7px;
    font-size: 45px;
  }
}
@media print, screen and (min-width: 768px) and (max-width: 1200px) {
  .stationList__time .num {
    padding-inline: 0.5833333333vw;
    font-size: 3.75vw;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__time .num {
    padding-inline: 1.7948717949vw;
    font-size: 8.2051282051vw;
  }
}
.stationList__line {
  color: #999999;
}
@media only screen and (min-width: 768px) {
  .stationList__line {
    font-size: 12px;
    margin-top: 10px;
  }
}
@media print, screen and (min-width: 768px) and (max-width: 1200px) {
  .stationList__line {
    font-size: 1vw;
  }
}
@media only screen and (max-width: 767px) {
  .stationList__line {
    font-size: 3.0769230769vw;
    margin-top: 2.5641025641vw;
  }
}

.access-car {
  background: url("../img/bg-content-02@1.5x.jpg") no-repeat center/cover;
}
@media only screen and (min-width: 768px) {
  .access-car {
    padding-block: 120px;
  }
}
@media only screen and (max-width: 767px) {
  .access-car {
    padding-block: 80px;
    padding-inline: 8.2051282051vw;
  }
}

@media only screen and (min-width: 768px) {
  .carSect {
    margin-inline: auto;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
  }
}

@media only screen and (min-width: 768px) {
  .carBox {
    width: 38.8888888889vw;
    max-width: 560px;
  }
}
@media only screen and (max-width: 767px) {
  .carBox {
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .carBox + * {
    margin-top: 25.641025641vw;
  }
}
.carBox__head {
  border-bottom: 1px solid rgba(255, 255, 255, 0.8);
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.05) 100%);
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.5;
}
.carBox__head:before {
  content: "";
  display: block;
  height: 0;
  width: 0;
  margin-top: calc((1 - 1.5) * 0.5em);
}
.carBox__head:after {
  content: "";
  display: block;
  height: 0;
  width: 0;
  margin-bottom: calc((1 - 1.5) * 0.5em);
}
@media only screen and (min-width: 768px) {
  .carBox__head {
    padding: 20px 10px;
    font-size: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .carBox__head {
    padding: 5.1282051282vw 2.5641025641vw;
    font-size: 5.1282051282vw;
  }
}
@media only screen and (min-width: 768px) {
  .carBox__head + * {
    margin-top: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .carBox__head + * {
    margin-top: 10.2564102564vw;
  }
}
.carBox__lead {
  line-height: 2.2;
}
.carBox__lead:before {
  content: "";
  display: block;
  height: 0;
  width: 0;
  margin-top: calc((1 - 2.2) * 0.5em);
}
.carBox__lead:after {
  content: "";
  display: block;
  height: 0;
  width: 0;
  margin-bottom: calc((1 - 2.2) * 0.5em);
}
.carBox__lead {
  color: rgba(255, 255, 255, 0.7);
}
@media only screen and (min-width: 768px) {
  .carBox__lead {
    font-size: 13px;
  }
}
@media only screen and (max-width: 767px) {
  .carBox__lead {
    font-size: 3.3333333333vw;
  }
}
@media only screen and (min-width: 768px) {
  .carBox__cont {
    margin-top: 56px;
  }
}
@media only screen and (max-width: 767px) {
  .carBox__cont {
    margin-top: 14.358974359vw;
  }
}
@media only screen and (max-width: 767px) {
  .carBox__cont .photo + .photo {
    margin-top: 8.2051282051vw;
  }
}
.carBox__cont + .cap {
  margin-top: 20px;
}
.carBox__time {
  color: rgba(255, 255, 255, 0.7);
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .carBox__time {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .carBox__time {
    margin-top: 5.1282051282vw;
  }
}
.carBox__time .interchange {
  display: block;
  letter-spacing: 0.03em;
}
@media only screen and (min-width: 768px) {
  .carBox__time .interchange {
    font-size: 18px;
  }
}
@media only screen and (max-width: 767px) {
  .carBox__time .interchange {
    font-size: 3.8461538462vw;
  }
}
.carBox__time .time {
  display: block;
  border-top: 1px solid #999999;
  letter-spacing: 0.03em;
}
@media only screen and (min-width: 768px) {
  .carBox__time .time {
    font-size: 16px;
    margin-top: 10px;
    padding-top: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .carBox__time .time {
    margin-top: 2.0512820513vw;
    padding-top: 2.0512820513vw;
    font-size: 3.3333333333vw;
  }
}
.carBox__time .time .num {
  font-family: "EB Garamond", serif;
  line-height: 0;
}
@media only screen and (min-width: 768px) {
  .carBox__time .time .num {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .carBox__time .time .num {
    font-size: 5.641025641vw;
  }
}
@media only screen and (min-width: 768px) {
  .carBox--car .carBox__cont {
    display: flex;
    justify-content: space-between;
    width: 100%;
    gap: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .carBox--car .carBox__cont {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8.2051282051vw 5.1282051282vw;
  }
}
@media only screen and (min-width: 768px) {
  .carBox--taxi .carBox__cont {
    display: flex;
    justify-content: space-between;
    width: 100%;
    gap: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .carBox--taxi .carBox__cont {
    width: 100%;
  }
}