@charset "utf-8";

@media only screen and (min-width: 0px) and (max-width: 1260px) {

/* ────────────────────── *
 *                                              *
 * 地図                                         *
 *                                              *
 * ────────────────────── */

.contents #map {
    padding: 8.333333333333332%;
}
.contents #map #gmap {
    height: 79.36507936507937vw;
}

/* ────────────────────── *
 *                                              *
 * キャッチコピー                               *
 *                                              *
 * ────────────────────── */

.contents p#copy {
    font-size: 26px;
    margin: 0 auto 5%;
}

/* ────────────────────── *
 *                                              *
 * ページネーション                             *
 *                                              *
 * ────────────────────── */

.contents ul#pagination {
    margin: 0 auto 11.666666666666666%;
}

/* ────────────────────── *
 *                                              *
 * 見出し                                       *
 *                                              *
 * ────────────────────── */

.contents h2 {
    margin: 0 auto 5.833333333333333%;
}
.contents h3 {
    margin: 0 auto 4.166666666666666%;
}
.contents p.section-copy {
    margin: 0 auto 4.166666666666666%;
}

/* ────────────────────── *
 *                                              *
 * Flexbox                                      *
 *                                              *
 * ────────────────────── */

.contents .flexbox {
    margin: 0 auto 5.833333333333333%;
}
.contents .flexbox.end {
    margin: 0 auto 12.5%;
}
.contents .flexbox > p {
    width: 49.166666666666664%;
}
.contents .flexbox ul.half {
    width: 49.166666666666664%;
}
.contents .flexbox ul li {
    width: 23.75%;
    min-height: 0;
}
.contents .flexbox ul.half li {
    width: 48.30508474576271%;
    margin-bottom: 3.389830508474576%;
}
.contents .flexbox ul li dl dt {
    width: 87.71929824561403%;
}

/* ────────────────────── *
 *                                              *
 * 路線図                                       *
 *                                              *
 * ────────────────────── */

.contents #trainmap {
    margin: 0 auto 5.833333333333333%;
}

/* ────────────────────── *
 *                                              *
 * リニア新幹線                                 *
 *                                              *
 * ────────────────────── */

.contents #linear {
    padding: 8.25%;
    margin: 0 auto 5.833333333333333%;
}
.contents #linear dl {
    width: 57%;
}
.contents #linear figure {
    width: 38%;
}
.contents #linear figure figcaption {
    width: 38.94736842105263%;
    left: -15.789473684210526%;
    top: -4.761904761904762vw;
}

/* ────────────────────── *
 *                                              *
 * 高速アクセス                                 *
 *                                              *
 * ────────────────────── */

.contents #highway figure {
    width: 46.666666666666664%;
}
.contents #highway .txt {
    width: 50%;
}

}

@media only screen and (min-width: 0px) and (max-width: 640px) {

/* ────────────────────── *
 *                                              *
 * メインビジュアル                             *
 *                                              *
 * ────────────────────── */

#mainvisual {
    overflow: hidden;
}
#mainvisual img {
    width: 150%;
    margin-left: -25%;
}

/* ────────────────────── *
 *                                              *
 * コンテンツ                                   *
 *                                              *
 * ────────────────────── */

.contents {
    width: 60.0rem;
    padding: 10.0rem 0 0;
    margin: 0 auto 8.0rem;
}

/* ────────────────────── *
 *                                              *
 * 地図                                         *
 *                                              *
 * ────────────────────── */

.contents #map {
    padding: 3.0rem;
    margin: 0 auto 7.0rem;
}
.contents #map #gmap {
    height: 54.0rem;
    border: 1.0rem solid #fff;
}

/* ────────────────────── *
 *                                              *
 * キャッチコピー                               *
 *                                              *
 * ────────────────────── */

.contents p#copy {
    font-size: 3.0rem;
    margin: 0 auto 6.0rem;
}

/* ────────────────────── *
 *                                              *
 * ページネーション                             *
 *                                              *
 * ────────────────────── */

.contents ul#pagination {
    margin: 0 auto 14.0rem;
    display: block;
}
.contents ul#pagination li {
    text-align: right;
    width: 100%;
}
.contents ul#pagination li:nth-child(1) {
    margin-bottom: 2.0rem;
}

/* ────────────────────── *
 *                                              *
 * 見出し                                       *
 *                                              *
 * ────────────────────── */

.contents h2 {
    width: 27.6rem;
    margin: 0 auto 7.0rem;
}
.contents h3 {
    padding: 0.5rem 0;
    margin: 0 auto 5.0rem;
}
.contents h3 img {
    width: 42.0rem;
}
.contents h4 {
    font-size: 2.4rem;
    padding: 2.0rem 0;
}
.contents p.section-copy {
    font-size: 2.8rem;
    margin: 0 auto 5.0rem;
}

/* ────────────────────── *
 *                                              *
 * Flexbox                                      *
 *                                              *
 * ────────────────────── */

.contents .flexbox {
    margin: 0 auto 5.0rem;
}
.contents .flexbox.end {
    margin: 0 auto 13.0rem;
}
.contents .flexbox > p {
    width: 100%;
    margin-bottom: 10.0rem;
}
.contents .flexbox > p img {
    width: 100%;
}
.contents .flexbox > p span.caption {
    line-height: 1.2;
    top: calc(100% + 1.0rem);
}
.contents .flexbox ul.half {
    width: 100%;
}
.contents .flexbox ul.centering {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.contents .flexbox ul li {
    width: 29.0rem;
    margin-top: 0;
    margin-bottom: 2.0rem;
}
.contents .flexbox ul.centering li {
    margin-left: 0;
    margin-right: 0;
}
.contents .flexbox.access ul li {
    margin-bottom: 4.0rem;
}
.contents .flexbox ul.half li {
    margin-bottom: 2.0rem;
}
.contents .flexbox ul li:nth-child(n+5) {
    margin-top: 2.0rem;
}
.contents .flexbox ul li img {
    width: 100%;
}
.contents .flexbox ul li dl {
    height: auto;
    padding: 1.0rem 0;
}
.contents .flexbox ul li dl dt {
    font-size: 2.6rem;
    width: 26.0rem;
    padding-bottom: 1.0rem;
    margin: 0 auto 1.0rem;
}
.contents .flexbox ul li dl dd {
    font-size: 2.0rem;
}

/* ────────────────────── *
 *                                              *
 * 路線図                                       *
 *                                              *
 * ────────────────────── */

.contents #trainmap {
    margin: 0 auto 7.0rem;
}

/* ────────────────────── *
 *                                              *
 * リニア新幹線                                 *
 *                                              *
 * ────────────────────── */

.contents #linear {
    padding: 3.9rem;
    margin: 0 auto 7.0rem;
    display: block;
}
.contents #linear dl {
    width: 100%;
    margin-bottom: 8.0rem;
}
.contents #linear dl dt {
    font-size: 3.2rem;
    margin-bottom: 1.5rem;
}
.contents #linear dl dd {
    font-size: 2.2rem;
}
.contents #linear dl dd span {
    font-size: 2.0rem;
}
.contents #linear dl dd p:nth-of-type(1) {
    margin-bottom: 2.0rem;
}
.contents #linear dl dd p:nth-of-type(2) {
    margin-bottom: 0.5rem;
}
.contents #linear figure {
    width: 100%;
}
.contents #linear figure img {
    width: 100%;
}
.contents #linear figure figcaption {
    width: 14.8rem;
    left: -5.0rem;
    top: -5.0rem;
}

/* ────────────────────── *
 *                                              *
 * 高速アクセス                                 *
 *                                              *
 * ────────────────────── */

.contents #highway {
    display: block;
}
.contents #highway figure {
    width: 100%;
}
.contents #highway figure img {
    width: 100%;
}
.contents #highway .txt {
    width: 100%;
    margin-bottom: 4.0rem;
}
.contents #highway .txt p {
    font-size: 2.2rem;
}
.contents #highway .txt p:nth-of-type(1) {
    margin-bottom: 2.0rem;
}

}