@media screen and (min-width: 768px) {
  br.sp {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  br.pc {
    display: none;
  }
}

@media screen and (min-width: 768px) {
  section.train .wrap,
  section.airport .wrap,
  section.taxi .wrap {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    max-width: 1240px;
    padding: 0 20px;
    width: auto;
  }
}

section.train figure,
section.airport figure,
section.taxi figure {
  margin: 0;
}

section.train {
  overflow: hidden;
  position: relative;
  z-index: 1;
}

@media screen and (min-width: 768px) {
  section.train {
    margin: 100px 0 0;
  }
}

@media screen and (max-width: 768px) {
  section.train {
    background: url("../imgs/sp/back-img.png") 0 65.64103vw no-repeat;
    background-size: 69.23077vw auto;
    margin: 20.51282vw 0 0;
  }
}

@media screen and (min-width: 768px) {
  section.train:before {
    aspect-ratio: 1;
    border: solid #e9f5f2 300px;
    border-radius: 50%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    content: '';
    display: block;
    position: absolute;
    right: calc(50% - 130px);
    top: 110px;
    width: 1230px;
    z-index: -1;
  }
}

@media screen and (min-width: 768px) {
  section.train .ttl {
    font-size: 40px;
    font-weight: 500;
    line-height: 60px;
    padding: 18px 0;
  }
}

@media screen and (max-width: 768px) {
  section.train .ttl {
    font-size: 7.17949vw;
    font-weight: 400;
    line-height: 1.6;
    margin-bottom: -.3em;
    text-align: center;
  }
}

section.train .ttl strong {
  font-family: "Bodoni Moda", serif;
  font-weight: 400;
  line-height: 1;
}

@media screen and (min-width: 768px) {
  section.train .ttl strong {
    font-size: 60px;
  }
}

@media screen and (max-width: 768px) {
  section.train .ttl strong {
    font-size: 10.25641vw;
  }
}

section.train p {
  line-height: 2;
}

@media screen and (min-width: 768px) {
  section.train p {
    font-size: 20px;
    font-weight: 600;
    margin: 60px 0 0;
  }
}

@media screen and (max-width: 768px) {
  section.train p {
    font-size: 3.58974vw;
    margin: 10.25641vw 0 0;
  }
}

section.train .spots {
  color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-family: "Bodoni Moda", serif;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

@media screen and (min-width: 768px) {
  section.train .spots {
    margin: 88px auto 0;
    max-width: 1440px;
  }
}

@media screen and (max-width: 768px) {
  section.train .spots {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 2.05128vw;
    margin: 12.82051vw 0 0;
  }
}

section.train .spots .item {
  display: grid;
}

@media screen and (min-width: 768px) {
  section.train .spots .item {
    width: calc((100% - 24px) / 4);
  }
}

@media screen and (max-width: 768px) {
  section.train .spots .item {
    width: calc(50% - 100vw * 4 / 390);
  }
}

section.train .spots .item .image {
  display: grid;
  grid-area: 1/1;
}

section.train .spots .item .image img {
  grid-area: 1/1;
}

section.train .spots .item .image figcaption {
  align-self: flex-end;
  grid-area: 1/1;
  justify-self: flex-end;
  line-height: 1;
  padding: 1em;
}

@media screen and (min-width: 768px) {
  section.train .spots .item .image figcaption {
    font-size: 10px;
  }
}

@media screen and (max-width: 768px) {
  section.train .spots .item .image figcaption {
    font-size: 2.5641vw;
  }
}

section.train .spots .item .text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  font-family: "Bodoni Moda", serif;
  grid-area: 1/1;
  justify-self: center;
  line-height: .75;
  text-align: center;
}

@media screen and (min-width: 768px) {
  section.train .spots .item .text {
    -ms-flex-item-align: center;
        align-self: center;
    gap: 26px;
  }
}

@media screen and (max-width: 768px) {
  section.train .spots .item .text {
    gap: 6.66667vw;
    padding: 18.46154vw 0 0;
  }
}

@media screen and (min-width: 768px) {
  section.train .spots .item .text .name {
    font-size: 32px;
  }
}

@media screen and (max-width: 768px) {
  section.train .spots .item .text .name {
    font-size: 6.66667vw;
  }
}

@media screen and (min-width: 768px) {
  section.train .spots .item .text .time {
    font-size: 30px;
  }
}

@media screen and (max-width: 768px) {
  section.train .spots .item .text .time {
    font-size: 6.15385vw;
  }
}

@media screen and (min-width: 768px) {
  section.train .spots .item .text .time span {
    font-size: 20px;
  }
}

@media screen and (max-width: 768px) {
  section.train .spots .item .text .time span {
    font-size: 3.58974vw;
  }
}

@media screen and (min-width: 768px) {
  section.train .map {
    margin: 120px auto 0;
    max-width: 1120px;
  }
}

@media screen and (max-width: 768px) {
  section.train .map {
    margin: 20.51282vw -6.41026vw 0;
    position: relative;
  }
  section.train .map:before {
    aspect-ratio: 1;
    background: url("../imgs/sp/ic-suggest.png") 0 0/contain no-repeat;
    content: '';
    display: block;
    left: 5.12821vw;
    position: absolute;
    top: -6.66667vw;
    width: 12.82051vw;
  }
}

@media screen and (min-width: 768px) {
  section.train .column {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin: 140px 0 0;
  }
}

@media screen and (max-width: 768px) {
  section.train .column {
    margin: 25.64103vw 0 0;
  }
}

@media screen and (min-width: 768px) {
  section.train .column .text {
    width: 35.83333%;
  }
}

@media screen and (min-width: 768px) {
  section.train .column .text .ttl {
    font-size: 28px;
    line-height: 45px;
    padding: 0;
  }
}

@media screen and (max-width: 768px) {
  section.train .column .text .ttl {
    font-size: 6.15385vw;
    line-height: 1.6;
    margin: -.3em 0;
  }
}

section.train .column .text p {
  font-weight: 400;
}

@media screen and (min-width: 768px) {
  section.train .column .text p {
    font-size: 16px;
    margin: 32px 0 0;
  }
}

@media screen and (max-width: 768px) {
  section.train .column .text p {
    font-size: 3.58974vw;
    margin: 7.69231vw 0 0;
  }
}

section.train .column .image {
  display: grid;
}

@media screen and (min-width: 768px) {
  section.train .column .image {
    margin: 0 -10% 0 0;
    width: 72%;
  }
}

@media screen and (max-width: 768px) {
  section.train .column .image {
    margin: 10.25641vw 0 0;
  }
}

section.train .column .image img {
  grid-area: 1/1;
  width: 100%;
}

section.train .column .image figcaption {
  align-self: flex-end;
  color: #ffffff;
  grid-area: 1/1;
  justify-self: flex-end;
  padding: 1em;
}

@media screen and (min-width: 768px) {
  section.train .column .image figcaption {
    font-size: 10px;
  }
}

@media screen and (max-width: 768px) {
  section.train .column .image figcaption {
    font-size: 2.5641vw;
  }
}

section.airport {
  overflow: hidden;
  position: relative;
  z-index: 1;
}

@media screen and (min-width: 768px) {
  section.airport {
    margin: 140px 0 0;
    padding: 0 0 140px;
  }
}

@media screen and (max-width: 768px) {
  section.airport {
    background: url("../imgs/sp/back-img-2.png") 100% 100% no-repeat;
    background-size: 86.15385vw auto;
    margin: 15.38462vw 0 0;
    padding: 0 0 25.64103vw;
  }
}

@media screen and (min-width: 768px) {
  section.airport:before {
    aspect-ratio: 1;
    border: solid #eeecef 320px;
    border-radius: 50%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    content: '';
    display: block;
    left: calc(50% - 400px);
    position: absolute;
    top: 485px;
    width: 1320px;
    z-index: -1;
  }
}

section.airport .spots {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 20px 0;
  margin: 0 auto;
  max-width: 1440px;
}

@media screen and (max-width: 768px) {
  section.airport .spots {
    gap: 1.53846vw 0;
  }
}

section.airport .spots .image {
  display: grid;
}

section.airport .spots .image img {
  grid-area: 1/1;
}

section.airport .spots .image figcaption {
  color: #ffffff;
  grid-area: 1/1;
}

section.airport .spots .image figcaption.name {
  font-family: "Bodoni Moda", serif;
  line-height: .75;
}

@media screen and (min-width: 768px) {
  section.airport .spots .image figcaption.name {
    -ms-flex-item-align: end;
        align-self: flex-end;
    font-size: 48px;
    padding: 20px;
  }
}

@media screen and (max-width: 768px) {
  section.airport .spots .image figcaption.name {
    -ms-flex-item-align: start;
        align-self: flex-start;
    font-size: 5.12821vw;
    justify-self: flex-start;
    padding: 2.05128vw;
  }
}

section.airport .spots .image figcaption.note {
  -ms-flex-item-align: end;
      align-self: flex-end;
  padding: 1em;
}

@media screen and (min-width: 768px) {
  section.airport .spots .image figcaption.note {
    font-size: 10px;
  }
}

@media screen and (max-width: 768px) {
  section.airport .spots .image figcaption.note {
    font-size: 2.5641vw;
    justify-self: flex-end;
  }
}

section.airport .spots .image--01, section.airport .spots .image--04 {
  width: 60%;
}

@media screen and (min-width: 768px) {
  section.airport .spots .image--01 .name, section.airport .spots .image--03 .name {
    justify-self: flex-end;
  }
}

@media screen and (min-width: 768px) {
  section.airport .spots .image--01 .note, section.airport .spots .image--03 .note {
    justify-self: flex-start;
  }
}

section.airport .spots .image--02, section.airport .spots .image--03 {
  width: 40%;
}

@media screen and (max-width: 768px) {
  section.airport .spots .image--03 .name {
    justify-self: flex-end;
  }
}

@media screen and (min-width: 768px) {
  section.airport .spots .image--02 .name, section.airport .spots .image--04 .name {
    justify-self: flex-start;
  }
}

@media screen and (min-width: 768px) {
  section.airport .spots .image--02 .note, section.airport .spots .image--04 .note {
    justify-self: flex-end;
  }
}

@media screen and (min-width: 768px) {
  section.airport .body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin: 140px 0 0;
  }
}

@media screen and (max-width: 768px) {
  section.airport .body {
    margin: 25.64103vw 0 0;
  }
}

@media screen and (min-width: 768px) {
  section.airport .body .text {
    width: 33%;
  }
}

@media screen and (min-width: 768px) {
  section.airport .body .text .ttl {
    font-size: 24px;
    line-height: 46px;
  }
}

@media screen and (max-width: 768px) {
  section.airport .body .text .ttl {
    font-size: 6.15385vw;
    line-height: 1.6;
    margin: -.3em 0;
    text-align: center;
  }
}

section.airport .body .text .ttl strong {
  font-family: "Bodoni Moda", serif;
  font-weight: inherit;
  line-height: 1;
}

@media screen and (min-width: 768px) {
  section.airport .body .text .ttl strong {
    font-size: 44px;
  }
}

@media screen and (max-width: 768px) {
  section.airport .body .text .ttl strong {
    font-size: 11.28205vw;
  }
}

section.airport .body .text p {
  line-height: 2;
}

@media screen and (min-width: 768px) {
  section.airport .body .text p {
    font-size: 14px;
    margin: 32px 0 0;
  }
}

@media screen and (max-width: 768px) {
  section.airport .body .text p {
    font-size: 3.58974vw;
    margin: 7.69231vw 0 0;
  }
}

section.airport .body .image {
  display: grid;
}

@media screen and (min-width: 768px) {
  section.airport .body .image {
    margin: 0 0 0 -10%;
    width: 72%;
  }
}

@media screen and (max-width: 768px) {
  section.airport .body .image {
    margin: 10.25641vw 0 0 -6.41026vw;
  }
}

section.airport .body .image img {
  grid-area: 1/1;
  width: 100%;
}

section.airport .body .image figcaption {
  align-self: flex-end;
  color: #ffffff;
  grid-area: 1/1;
  justify-self: flex-end;
  padding: 1em;
}

@media screen and (min-width: 768px) {
  section.airport .body .image figcaption {
    font-size: 10px;
  }
}

@media screen and (max-width: 768px) {
  section.airport .body .image figcaption {
    font-size: 2.5641vw;
  }
}

@media screen and (min-width: 768px) {
  section.airport .map {
    margin: 80px 0 0;
  }
}

@media screen and (max-width: 768px) {
  section.airport .map {
    margin: 15.38462vw -6.41026vw 0;
  }
}

section.airport .map img {
  width: 100%;
}

section.taxi {
  overflow: hidden;
}

@media screen and (min-width: 768px) {
  section.taxi {
    margin: 0 0 100px;
  }
}

@media screen and (max-width: 768px) {
  section.taxi {
    margin: 0 0 25.64103vw;
  }
}

@media screen and (min-width: 768px) {
  section.taxi .body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

@media screen and (min-width: 768px) {
  section.taxi .body .text {
    width: 35.83333%;
  }
}

@media screen and (min-width: 768px) {
  section.taxi .body .text .ttl {
    font-size: 28px;
    font-weight: 500;
    line-height: 45px;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .body .text .ttl {
    font-size: 6.15385vw;
    line-height: 1.6;
    margin: -.3em 0;
    text-align: center;
  }
}

section.taxi .body .text p {
  line-height: 2;
}

@media screen and (min-width: 768px) {
  section.taxi .body .text p {
    font-size: 16px;
    margin: 32px 0 0;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .body .text p {
    font-size: 3.58974vw;
    margin: 7.69231vw 0 0;
  }
}

section.taxi .body .image {
  display: grid;
}

@media screen and (min-width: 768px) {
  section.taxi .body .image {
    margin: 0 -10% 0 0;
    width: 72%;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .body .image {
    margin: 10.25641vw -6.41026vw 0 0;
  }
}

section.taxi .body .image img {
  grid-area: 1/1;
  width: 100%;
}

section.taxi .body .image figcaption {
  align-self: flex-end;
  color: #ffffff;
  grid-area: 1/1;
  justify-self: flex-end;
  padding: 1em;
}

@media screen and (min-width: 768px) {
  section.taxi .body .image figcaption {
    padding: 10px;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .body .image figcaption {
    font-size: 2.5641vw;
  }
}

@media screen and (min-width: 768px) {
  section.taxi .simulation {
    background: linear-gradient(transparent 27px, #e8e7e5 27px);
    margin: 54px 0 0;
    padding: 0 0 56px;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(6.92308vw, transparent), color-stop(6.92308vw, #e8e7e5));
    background: linear-gradient(transparent 6.92308vw, #e8e7e5 6.92308vw);
    margin: 11.28205vw 0 0;
    padding: 0 0 11.79487vw;
  }
}

section.taxi .simulation:before {
  aspect-ratio: 1;
  background: #ffffff url("../imgs/ico-taxi.png") 50% 50% no-repeat;
  background-size: 49.36709% auto;
  border: #e8e7e5 solid;
  border-radius: 50%;
  content: '';
  display: block;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

@media screen and (min-width: 768px) {
  section.taxi .simulation:before {
    border-width: 6px;
    width: 79px;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation:before {
    border-width: 1.53846vw;
    width: 20.51282vw;
  }
}

section.taxi .simulation .name {
  line-height: 1;
  text-align: center;
}

@media screen and (min-width: 768px) {
  section.taxi .simulation .name {
    font-size: 18px;
    margin: 14px 0 0;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation .name {
    font-size: 4.61538vw;
    margin: 3.58974vw 0 0;
  }
}

@media screen and (min-width: 768px) {
  section.taxi .simulation .name .small {
    font-size: 14px;
    margin: 10px 0 0;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation .name .small {
    font-size: 3.58974vw;
    margin: 2.5641vw 0 0;
  }
}

section.taxi .simulation .list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  letter-spacing: .08em;
}

@media screen and (min-width: 768px) {
  section.taxi .simulation .list {
    font-size: 18px;
    gap: 20px;
    line-height: 1;
    margin: 38px auto 0;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation .list {
    font-size: 3.58974vw;
    gap: 2.5641vw;
    line-height: 2;
    margin: 9.74359vw 0 0;
    padding: 0 0 0 5.89744vw;
  }
}

section.taxi .simulation .list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media screen and (min-width: 768px) {
  section.taxi .simulation .list li {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 7px;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation .list li {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: 1.79487vw;
  }
}

section.taxi .simulation .list li:before {
  aspect-ratio: 1;
  background: #8f7352;
  border-radius: 50%;
  content: '';
  display: block;
}

@media screen and (min-width: 768px) {
  section.taxi .simulation .list li:before {
    width: 9px;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation .list li:before {
    margin: 3.46154vw 0 0;
    width: 2.30769vw;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation .price {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: calc(5 / 390 * 100vw);
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    margin-left: calc(15 / 390 * 100vw);
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation .data + .data {
    margin-top: calc(-5 / 390 * 100vw);
  }
}

section.taxi .simulation .station {
  display: inline-block;
}

@media screen and (min-width: 768px) {
  section.taxi .simulation .station {
    width: 65px;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation .station {
    line-height: 1;
    margin-top: calc(11 / 390 * 100vw);
    width: calc(65 / 390 * 100vw);
  }
}

section.taxi .simulation .num {
  color: #8f7352;
  display: inline-block;
  font-family: "Cinzel", serif;
  letter-spacing: 0;
}

@media screen and (min-width: 768px) {
  section.taxi .simulation .num {
    font-size: 26px;
    margin-left: 3px;
    margin-right: 2px;
    white-space: nowrap;
    width: 65px;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation .num {
    font-size: calc(24 / 390 * 100vw);
    line-height: 1;
  }
}

@media screen and (min-width: 768px) {
  section.taxi .simulation .small {
    font-size: 14px;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation .small {
    font-size: 10px;
    letter-spacing: 0;
  }
}

section.taxi .simulation .small .large {
  font-family: "Cinzel", serif;
}

@media screen and (min-width: 768px) {
  section.taxi .simulation .small .large {
    font-size: 18px;
    letter-spacing: 0;
  }
}

@media screen and (max-width: 768px) {
  section.taxi .simulation .small .large {
    font-size: calc(14 / 390 * 100vw);
  }
}