@charset "UTF-8";

/* sass */
html:has(.basicmodal[open]) { overflow: hidden; }

.basicmodal { /*reset*/ width: unset; max-width: unset; height: unset; max-height: unset; padding: unset; color: unset; background-color: unset; border: unset; overflow: unset; /*basic setting*/ position: fixed; top: 0; left: 0; right: 0; bottom: 0; text-align: center; overflow: auto; background: rgba(0, 0, 0, 0.8); }

@keyframes modalFadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }

.basicmodal[open] { animation: modalFadeIn 0.3s; }

.basicmodal.closing { opacity: 0; transition: opacity 0.3s; }

.basicmodal::-ms-backdrop { display: none; }

.basicmodal::backdrop { display: none; }

.basicmodal__inner { width: 100%; display: flex; align-items: center; min-height: 100vh; pointer-events: none; text-align: left; }

.basicmodal__inner > * { pointer-events: auto; margin: auto; }

.img-wrap img { max-width: 100%; height: auto; }

.wide-image img { width: 100%; height: auto; }

.wide-image button { display: block; width: 100%; }

.w186 { width: 186px; }

.no-br { display: inline-block; }

.u-mgt12 { margin-top: 12px !important; }

.u-mgl20 { margin-left: 20px !important; }

button { cursor: pointer; }

.adj-sp-mr3 { margin-right: -3px !important; }

.header .l-header { padding: 8px 8px 0; }

.header .l-header .header-inner { position: relative; background-color: #004632; padding: 30px 0 23px; }

.header .l-header .logo-jr { position: absolute; top: 13px; left: 11px; width: 42px; }

.header .l-header .logo-jr img { max-width: 100%; height: auto; }

.header .l-header .hdg-lv1 { text-align: center; }

.header .l-header .hdg-lv1 img { width: 293px; height: auto; }

.header .l-header .img-wrap { text-align: center; margin: 22px 0 0; }

.header .l-header .img-wrap img { width: 93px; }

.footer { padding: 10px; }

.footer .copyright { text-align: center; }

.footer .copyright img { width: 40px; height: auto; }

.l-body-main { padding: 33px 20px 0; }

.hdg-lv2 { margin-top: 20px; font-family: "Hiragino Sans W8", "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; font-weight: 800; font-size: 2.6rem; line-height: 1.56; color: #ffffff; }

.hdg-lv2 + .txt-st { margin-top: 16px; }

.hdg-lv2-pt2 { font-family: "Hiragino Sans W6", "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; font-weight: 600; font-size: 1.7rem; line-height: 1.52; color: #ffffff; text-align: center; }

.hdg-lv3 { margin-top: 20px; font-family: "Hiragino Sans W8", "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; font-weight: 800; font-size: 2rem; line-height: 2; color: #ffffff; text-align: center; }

.l-body > .l-body-main:first-child > section:first-child > [class^=hdg]:first-child { margin-top: 0; }

.wrap-tab-area .item-tab-area { display: none; }

.wrap-tab-area .item-tab-area.tabActive { display: block; }

.btn-a { display: block; background-color: #004632; border: 1px solid #1E785A; border-radius: 23px; font-size: 1.5rem; line-height: 1.73; padding: 10px; text-align: center; }

.btn-a:link, .btn-a:visited, .btn-a:hover, .btn-a:active { color: #ffffff; text-decoration: none; }

.btn-b { background-color: #ff00ff; color: #ffffff; display: inline-block; border-radius: 9px; text-align: center; padding: 2px 10px 3px; line-height: 1; font-size: 1.2rem; }

.txt-st { font-size: 1.6rem; line-height: 1.7; }

.txt-caption { font-size: 1.4rem; line-height: 1.57; }

.txt-any { font-size: 1.4rem; line-height: 1.57; }

.txt-any > .mark { display: block; float: left; }

.txt-any > .detail { display: block; overflow: hidden; }

.txt-any::after { content: ""; clear: both; display: table; }

.txt-any.has-ruby > .mark { transform: translateY(0.4em); }

.txt-tap { margin: 20px auto 15px; border: 1px solid #ffffff; border-radius: 7px; width: fit-content; padding: 5px 10px 4px; font-size: 1.3rem; line-height: 1.5; }

.txt-tap::before { content: ""; display: inline-block; width: 0.8em; height: 0.8em; background-color: #ffffff; margin-right: 0.5em; clip-path: polygon(0 0, 100% 0%, 50% 100%, 0% 0%); vertical-align: middle; }

.lst-action { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 9px 11px; }

.lst-action > li { background-color: #5A5D60; border-radius: 3px; padding: 5px 8px 2px; text-align: center; font-size: 1.6rem; line-height: 1.5; display: flex; align-items: flex-end; }

.lst-feature { margin-top: 12px; }

.lst-feature > li { border: 1px solid #46484a; background-color: #343638; padding: 12px 10px 12px 15px; font-size: 2.2rem; }

.lst-feature > li .txt-feature { display: flex; align-items: center; min-height: 0px; font-size: 1.6rem; line-height: 1.56; }

.lst-feature > li .mark { display: block; font-family: "Hiragino Sans W7", "Helvetica Neue", Arial, "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; font-weight: 700; font-size: 2.2rem; margin-right: 5px; flex: 0 0 auto; width: 1em; }

.lst-feature > li .detail { display: block; font-size: 1.6rem; }

.lst-feature > li .img-wrap { margin-top: 14px; }

.lst-feature > li + li { margin-top: 8px; }

.lst-feature > li .lst-action { margin-left: calc(1em + 5px); }

.lst-feature > li.has-ruby .mark { transform: translateY(0.15em); }

.lst-tab-button { margin-top: 28px; display: flex; }

.lst-tab-button > li { width: 50%; }

.lst-tab-button > li .btn-chg-station { width: 100%; border: 1px solid #ffffff; color: #ffffff; background-color: #171717; font-family: "Hiragino Sans W7", "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; font-weight: 700; font-size: 2.2rem; padding: 20px 2px 16px; text-align: center; }

.lst-tab-button > li .btn-chg-station.tabActive { color: #000000; background-color: #ffffff; }

.lst-map-marked { margin-top: 16px; }

.lst-map-marked > li { display: flex; font-size: 1.5rem; }

.lst-map-marked > li > .mark { display: block; width: 17px; margin-top: 0.25em; margin-right: 4px; }

.lst-map-marked > li > .mark img { width: 100%; height: auto; }

.lst-map-marked > li > .detail { display: block; line-height: 1.7; }

.lst-map-marked > li.mark-w > .mark { width: 30px; }

.lst-map-marked > li.mark-w2 > .mark { width: 30px; text-align: right; }

.lst-map-marked > li.mark-w2 > .mark img { width: 17px; }

.lst-map-marked > li.has-ruby > .mark { transform: translateY(0.35em); }

.lst-map-marked > li + li { margin-top: 13px; }

.lst-map-marked > li .txt-sub { font-size: 1.2rem; }

.lst-map-marked > li .btn-b { margin-left: 5px; }

.lst-map-marked + .img-wrap, .lst-map-marked + .wide-image { margin-top: 9px; }

.lst-btn { margin-top: 12px; }

.lst-dot { margin-top: 16px; }

.lst-dot > li { font-size: 1.4rem; line-height: 2; padding-left: 1em; position: relative; }

.lst-dot > li::before { position: absolute; content: ""; display: inline-block; width: 3px; height: 3px; background-color: #ffffff; border-radius: 50%; left: calc(0.5em - 3px); top: 0.8em; margin-top: -2px; }

.lst-dot > li + li { margin-top: 10px; }

.lst-dot > li.has-ruby::before { transform: translateY(0.35em); }

.tbl-pt1 { margin-top: 58px; border-top: 1px solid #ffffff; width: 100%; table-layout: fixed; }

.tbl-pt1 tbody th, .tbl-pt1 tbody td { border-bottom: 1px solid #ffffff; font-weight: normal; font-size: 1.4rem; line-height: 1.4; padding: 13px 8px 5px; height: 62px; }

.tbl-pt1 tbody th { background-color: #3C3E40; }

.tbl-pt1 + [class^=txt] { margin-top: 8px; }

.wrap-tap-area { margin-top: 17px; }

.wrap-tap-area .btn-point { white-space: nowrap; overflow: hidden; text-indent: 120%; }

.wrap-tap-area .btn-point img { width: 100%; height: auto; display: none; }

.wrap-tap-area .scroll-map { width: 100%; overflow-x: auto; }

.wrap-tap-area .scroll-map .box-relative { min-width: 922px; margin: 0 auto; }

.wrap-tap-area .wrap-yokohama { position: relative; }

.wrap-tap-area .wrap-yokohama .btn-point { position: absolute; white-space: nowrap; overflow: hidden; text-indent: 120%; }

.wrap-tap-area .wrap-yokohama .btn-point.mapall { width: 100%; height: 100%; left: 0; top: 0; }

.wrap-tap-area .wrap-yokohama .btn-point img { display: none; }

.wrap-tap-area .wrap-tachikawa { position: relative; }

.wrap-tap-area .wrap-tachikawa .btn-point { position: absolute; white-space: nowrap; overflow: hidden; text-indent: 120%; }

.wrap-tap-area .wrap-tachikawa .btn-point.west { width: 12.55%; height: 7.5%; left: 40.74%; top: 47.45%; }

.wrap-tap-area .wrap-tachikawa .btn-point.east { width: 12.48%; height: 7.36%; left: 43.85%; top: 35.29%; }

.wrap-tap-area .wrap-tachikawa .btn-point.north { width: 10.72%; height: 6.36%; left: 0.97%; top: 14%; }

.wrap-tap-area .wrap-tachikawa .btn-point.south { width: 10.78%; height: 6.44%; left: 9.26%; top: 63.15%; }

.wrap-tap-area .wrap-tachikawa .btn-point.sign1 { width: 12.73%; height: 20.58%; left: 22.05%; top: 37.48%; }

.wrap-tap-area .wrap-tachikawa .btn-point.sign2 { width: 16.75%; height: 14.29%; left: 62.36%; top: 36%; }

.wrap-tap-area .wrap-tachikawa .btn-point.sign3 { width: 16.74%; height: 15.84%; left: 49.15%; top: 58.27%; }

.basicmodal .btn-close { display: block; position: fixed; z-index: 10; transform: translateZ(1px); width: 40px; height: 40px; background: transparent url(/image/btn-close.svg) center center no-repeat; background-size: 40px auto; top: 33px; right: 35px; }

.basicmodal .btn-close .text { display: block; overflow: hidden; white-space: nowrap; text-indent: 120%; }

.basicmodal .modal-scroll { max-width: 746px; padding-left: 20px; padding-right: 20px; }

.basicmodal .modal-scroll .txt-title { font-family: "Hiragino Sans W8", "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; font-weight: 800; font-size: 2.3rem; line-height: 1.9; color: #ffffff; }

.basicmodal .modal-scroll .txt-ex { font-size: 1.6rem; line-height: 1.7; }

.basicmodal .modal-scroll .item { background-color: #343638; border: 1px solid 46484A; padding: 20px 20px 0; }

.basicmodal .modal-scroll .item + .item { margin-top: 26px; }

.basicmodal .modal-scroll .img-wrap { margin-top: 20px; margin-bottom: 28px; margin-left: -20px; margin-right: -20px; }

.basicmodal .modal-scroll .img-wrap img { width: 100%; height: auto; }

.basicmodal .modal-scroll.scroll-x { max-width: initial; overflow-x: auto; width: 100%; padding-left: 0; padding-right: 0; }

.basicmodal .modal-scroll.scroll-x .scroll-inner { width: 1383px; margin-left: auto; margin-right: auto; }

.basicmodal.layout-yokohama .modal-scroll .wrap-yokohama { position: relative; width: 1383px; margin: 0 auto; }

.basicmodal.layout-yokohama .modal-scroll .wrap-yokohama .wide-image { width: auto; }

.basicmodal.layout-yokohama .modal-scroll .btn-point { position: absolute; white-space: nowrap; overflow: hidden; text-indent: 120%; }

.basicmodal.layout-yokohama .modal-scroll .btn-point.south { width: 4.05%; height: 5.41%; left: 5.28%; top: 24.03%; }

.basicmodal.layout-yokohama .modal-scroll .btn-point.c-south { width: 2.24%; height: 13.2%; left: 48.59%; top: 27.24%; }

.basicmodal.layout-yokohama .modal-scroll .btn-point.c-north { width: 2.32%; height: 13.37%; left: 55.31%; top: 28.08%; }

.basicmodal.layout-yokohama .modal-scroll .btn-point.cial { width: 6.22%; height: 5.08%; left: 56.04%; top: 14.55%; }

.basicmodal.layout-yokohama .modal-scroll .btn-point.north { width: 4.05%; height: 5.25%; left: 90.38%; top: 33.84%; }

.basicmodal.layout-yokohama .modal-scroll .btn-point.sign4 { width: 3.83%; height: 11.84%; left: 63.99%; top: 7.95%; }

.basicmodal.layout-yokohama .modal-scroll .btn-point.sign2 { width: 5.28%; height: 8.97%; left: 43.17%; top: 40.44%; }

.basicmodal.layout-yokohama .modal-scroll .btn-point.sign1 { width: 5.49%; height: 9.14%; left: 15.33%; top: 32.32%; }

.basicmodal.layout-yokohama .modal-scroll .btn-point.sign5 { width: 4.91%; height: 9.14%; left: 83.8%; top: 28.08%; }

.basicmodal.layout-yokohama .modal-scroll .btn-point.sign3 { width: 5.5%; height: 8.8%; left: 52.64%; top: 41.62%; }

.basicmodal.layout-yokohama .modal-scroll .btn-point img { visibility: hidden; display: none; }

.sec-opinion { margin: 167px -20px 0; background-color: #004632; padding: 40px 18px 22px; }

.sec-opinion .inner-opinion { background-color: #343638; border: 1px solid #46484a; padding: 6px 28px 20px; }