/*! destyle.css v4.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.css */
/* Reset box-model and set borders */
/* ============================================ */
*, ::before, ::after { box-sizing: border-box; border-style: solid; border-width: 0; }

/* Document */
/* ============================================ */
/** 1. Correct the line height in all browsers. 2. Prevent adjustments of font size after orientation changes in iOS. 3. Remove gray overlay on links for iOS. */
html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -webkit-tap-highlight-color: transparent; /* 3*/ }

/* Sections */
/* ============================================ */
/** Remove the margin in all browsers. */
body { margin: 0; }

/** Render the `main` element consistently in IE. */
main { display: block; }

/* Vertical rhythm */
/* ============================================ */
p, table, blockquote, address, pre, iframe, form, figure, dl { margin: 0; }

/* Headings */
/* ============================================ */
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; margin: 0; }

/* Lists (enumeration) */
/* ============================================ */
ul, ol { margin: 0; padding: 0; list-style: none; }

/* Lists (definition) */
/* ============================================ */
dt { font-weight: bold; }

dd { margin-left: 0; }

/* Grouping content */
/* ============================================ */
/** 1. Add the correct box sizing in Firefox. 2. Show the overflow in Edge and IE. */
hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ border-top-width: 1px; margin: 0; clear: both; color: inherit; }

/** 1. Correct the inheritance and scaling of font size in all browsers. 2. Correct the odd `em` font sizing in all browsers. */
pre { font-family: monospace, monospace; /* 1 */ font-size: inherit; /* 2 */ }

address { font-style: inherit; }

/* Text-level semantics */
/* ============================================ */
/** Remove the gray background on active links in IE 10. */
a { background-color: transparent; text-decoration: none; color: inherit; }

/** 1. Remove the bottom border in Chrome 57- 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */
abbr[title] { text-decoration: underline dotted; /* 2 */ }

/** Add the correct font weight in Chrome, Edge, and Safari. */
b, strong { font-weight: bolder; }

/** 1. Correct the inheritance and scaling of font size in all browsers. 2. Correct the odd `em` font sizing in all browsers. */
code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: inherit; /* 2 */ }

/** Add the correct font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` elements from affecting the line height in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sub { bottom: -0.25em; }

sup { top: -0.5em; }

/* Replaced content */
/* ============================================ */
/** Prevent vertical alignment issues. */
svg, img, embed, object, iframe { vertical-align: bottom; }

/* Forms */
/* ============================================ */
/** Reset form fields to make them styleable. 1. Make form elements stylable across systems iOS especially. 2. Inherit text-transform from parent. */
button, input, optgroup, select, textarea { -webkit-appearance: none; /* 1 */ appearance: none; vertical-align: middle; color: inherit; font: inherit; background: transparent; padding: 0; margin: 0; border-radius: 0; text-align: inherit; text-transform: inherit; /* 2 */ }

/** Correct cursors for clickable elements. */
button, [type="button"], [type="reset"], [type="submit"] { cursor: pointer; }

button:disabled, [type="button"]:disabled, [type="reset"]:disabled, [type="submit"]:disabled { cursor: default; }

/** Improve outlines for Firefox and unify style with input elements & buttons. */
:-moz-focusring { outline: auto; }

select:disabled { opacity: inherit; }

/** Remove padding */
option { padding: 0; }

/** Reset to invisible */
fieldset { margin: 0; padding: 0; min-width: 0; }

legend { padding: 0; }

/** Add the correct vertical alignment in Chrome, Firefox, and Opera. */
progress { vertical-align: baseline; }

/** Remove the default vertical scrollbar in IE 10+. */
textarea { overflow: auto; }

/** Correct the cursor style of increment and decrement buttons in Chrome. */
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }

/** Correct the outline style in Safari. */
[type="search"] { outline-offset: -2px; /* 1 */ }

/** Remove the inner padding in Chrome and Safari on macOS. */
[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** 1. Correct the inability to style clickable types in iOS and Safari. 2. Fix font inheritance. */
::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }

/** Fix appearance for Firefox */
[type="number"] { -moz-appearance: textfield; }

/** Clickable labels */
label[for] { cursor: pointer; }

/* Interactive */
/* ============================================ */
/* Add the correct display in Edge, IE 10+, and Firefox. */
details { display: block; }

/* Add the correct display in all browsers. */
summary { display: list-item; }

/* Remove outline for editable content. */
[contenteditable]:focus { outline: auto; }

/* Tables */
/* ============================================ */
/**
1. Correct table border color inheritance in all Chrome and Safari.
*/
table { border-color: inherit; /* 1 */ border-collapse: collapse; }

caption { text-align: left; }

td, th { vertical-align: top; padding: 0; }

th { text-align: left; font-weight: bold; }

.access-head { background: #fff; }
@media screen and (max-width: 768px) { .access-head { position: relative; z-index: 1; } }

.subnav-s { max-width: 700px; }
.subnav-s ul li { width: 32%; }

.img video { width: 100%; height: auto; }

.section { background-color: #f2efe4; position: relative; z-index: 1; padding-top: 60px; overflow-x: hidden; }

.inner { font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; max-width: 1050px; }
.inner .category-name img { width: 100%; height: auto; }
.inner .komidashi { font-size: 22px; line-height: 1.6; font-feature-settings: "palt"; }
.inner * + .lead { margin-top: 30px; }

@media screen and (max-width: 768px) { .inner .station .text { text-align: center; }
  .inner .station .text img { height: 70px !important; width: auto; } }
@media screen and (max-width: 480px) { .inner .komidashi { font-size: 5vw; }
  .inner * + .lead { margin-top: 20px; }
  .inner .station .text img { height: 50px !important; } }
/*******************************

train

*******************************/
#train .block:not(:first-child) { margin-top: 80px; }
#train .block .komidashi { text-align: center; }
#train .block .komidashi + * { margin-top: 20px; }
#train .block .komidashi .large { font-size: 150%; font-weight: normal; }
#train .block01 { display: grid; grid-template-columns: 0.67fr 1fr; grid-template-rows: repeat(2, auto) 1fr auto; column-gap: 5.71%; }
#train .block01 .category-name { width: clamp(175px, 25vw, 329px); }
#train .block01 .img { grid-row: span 4; }
#train .block01 .picture { grid-row-start: 4; text-align: right; }
#train .block01 .picture img { width: 35%; height: auto; }
#train .block04 .station-list { display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 26px; }
#train .block04 .station .text { text-align: center; margin-top: 10px; }
#train .block04 .station .text img { max-width: 100%; height: auto; }
#train .block04 .station .note { line-height: 1.2; margin-top: 10px; }
#train .block05 { background-color: #7b9497; padding: 40px 50px; color: #fff; display: grid; grid-template-columns: 0.6fr 1fr; column-gap: 50px; }
#train .block05 .komidashi { text-align: left; order: 1; align-self: flex-end; }
#train .block05 .lead { order: 3; }
#train .block05 .lead .note { margin-top: 1rem; line-height: 1.4; display: block; }
#train .block05 .img-wrap { order: 2; grid-row: span 2; }
#train .block06, #train .block07 { display: grid; grid-template-columns: 1fr 0.98fr; align-items: flex-start; column-gap: 36px; }
#train .block06 .komidashi, #train .block07 .komidashi { grid-column: span 2; }
#train .block06 .komidashi + *, #train .block07 .komidashi + * { margin-top: 0; }
#train .block06 .from-station, #train .block07 .from-station { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 26px; }
#train .block06 .from-station .komidashi, #train .block07 .from-station .komidashi { margin-bottom: 20px; font-size: 18px; line-height: 1.2; }
#train .block06 .from-station .station .text, #train .block07 .from-station .station .text { margin-top: 10px; }
#train .block06 .from-station .station .text img, #train .block07 .from-station .station .text img { max-width: 100%; height: auto; }
#train .block06 .from-station .station .note, #train .block07 .from-station .station .note { margin-top: 10px; }
#train .block06::before { display: inline-block; content: ''; height: 1px; width: 206px; background-color: #829395; margin-bottom: 80px; margin-inline: auto; grid-column: span 2; }
#train .block06 > .komidashi { margin-bottom: 40px; }
#train .block07 > .komidashi { margin-bottom: 15px; order: 1; }
#train .block07 > .note { grid-column: span 2; text-align: center; margin-bottom: 40px; order: 2; word-break: break-all; }
#train .block07 .image-photo { order: 4; }
#train .block07 .from-station { order: 3; }
#train .block07 .from-station .komidashi { text-align: left; }
#train .block07 .from-station .komidashi .large { display: block; }

@media screen and (max-width: 768px) { #train .block .komidashi { text-align: left; }
  #train .block01 { grid-template-columns: 1fr; grid-template-rows: inherit; }
  #train .block01 .category-name { margin-inline: auto; }
  #train .block01 .img { grid-row: span 1; margin-top: 30px; }
  #train .block01 .picture { grid-row-start: inherit; }
  #train .block01 .picture img { width: 25%; }
  #train .block02 { margin-top: -10% !important; }
  #train .block02 .komidashi { padding-right: 25%; }
  #train .block02 .img, #train .block03 .img { overflow-x: scroll; }
  #train .block02 .img .scroll, #train .block03 .img .scroll { background-color: #fff; padding: 20px; width: 200%; }
  #train .block04 .komidashi { text-align: center; }
  #train .block04 .station-list { grid-template-columns: repeat(2, 1fr); column-gap: 20px; row-gap: 20px; }
  #train .block05 { grid-template-columns: 1fr; padding: 30px 25px 25px; }
  #train .block05 .lead { order: 2; }
  #train .block05 .img { order: 3; grid-row: span 1; margin-top: 25px; }
  #train .block06, #train .block07 { display: grid; grid-template-columns: 1fr; }
  #train .block06 .komidashi, #train .block07 .komidashi { grid-column: span 1; }
  #train .block06 .from-station, #train .block07 .from-station { column-gap: 20px; margin-top: 40px; }
  #train .block06::before { display: none; }
  #train .block06 > .komidashi { margin-bottom: 20px; }
  #train .block06 .from-station .komidashi { grid-column: span 2; text-align: center; }
  #train .block07 > .komidashi { grid-column: span 1; }
  #train .block07 > .note { grid-column: span 1; text-align: left; margin-bottom: 20px; }
  #train .block07 .image-photo { order: 3; }
  #train .block07 .from-station { order: 4; } }
@media screen and (max-width: 480px) { #train { padding-top: 0; }
  #train .block:not(:first-child) { margin-top: 50px; }
  #train .block02 { margin-top: -30% !important; }
  #train .block06 .from-station .komidashi, #train .block07 .from-station .komidashi { font-size: 13px; } }
/*******************************

to-tachikawa

*******************************/
#to-tachikawa::before { display: block; content: ''; height: 1px; width: 206px; background-color: #829395; margin-bottom: 60px; margin-inline: auto; }
#to-tachikawa .category-name { width: clamp(167px, 25vw, 335px); margin-inline: auto; }
#to-tachikawa .block { margin-top: 80px; }
#to-tachikawa .lead { margin-top: 20px; }
#to-tachikawa .block-header { color: #fff; display: grid; background-color: #a19856; }
#to-tachikawa .block-header .name { display: grid; place-content: center; }
#to-tachikawa .block00 .komidashi { text-align: center; margin-bottom: 4rem; }
#to-tachikawa .block01 { margin-top: 60px; }
#to-tachikawa .block01 .block-header { grid-template-columns: 0.34fr 1fr; }
#to-tachikawa .block01 .block-header .name { padding: 0 20px; }
#to-tachikawa .block01 .block-header .name img { max-width: 120px; width: 100%; height: auto; }
#to-tachikawa .block01 .block-body { display: grid; grid-template-columns: 0.77fr 1fr; column-gap: 6.19%; margin-top: 40px; }
#to-tachikawa .block01 .block-body .conceptual-diagram { grid-column: span 2; margin-bottom: 40px; }
#to-tachikawa .block01 .block-body .conceptual-diagram .cap { text-align: right; margin-top: 5px; }
#to-tachikawa .block01 .block-body .video { width: 100%; cursor: pointer; }
#to-tachikawa .block01 .block-body .video .movie-ttl { width: 80%; max-width: 360px; margin: 0 auto 2rem; }
#to-tachikawa .block01 .block-body .copy { display: grid; grid-template-columns: 1fr 61px; }
#to-tachikawa .block01 .block-body .copy .komidashi, #to-tachikawa .block01 .block-body .copy .point { grid-column: span 2; }
#to-tachikawa .block01 .block-body .copy .picture { align-self: flex-end; }
#to-tachikawa .block01 .block-body .copy .note { grid-column: span 2; order: 5; padding-top: 1rem; }
#to-tachikawa .block01 .block-body .video img { width: 100%; height: auto; }
#to-tachikawa .block01 .block-body > .note { grid-column: span 2; margin-top: 30px; }
#to-tachikawa .block02 .block-header { grid-template-columns: auto 1fr; column-gap: 6.19%; padding: 45px; }
#to-tachikawa .block02 .block-body { padding: 0 45px 45px; background-color: #a19856; display: grid; grid-template-columns: 1fr 18.54%; column-gap: 30px; }
#to-tachikawa .block02 .block-body .conceptual-diagram { grid-column: span 2; margin-bottom: 40px; }
#to-tachikawa .block02 .block-body .conceptual-diagram .cap-list { display: flex; flex-wrap: wrap; justify-content: space-between; color: #fff; }
#to-tachikawa .block02 .block-body .conceptual-diagram .cap-list .cap { margin-top: 5px; }
#to-tachikawa .block02 .block-body .detail { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; background-color: #fff; padding: 25px; }
#to-tachikawa .block02 .block-body .detail .title { grid-column: span 2; font-size: 18px; }
#to-tachikawa .block02 .block-body .detail .parking-list { display: flex; flex-direction: column; row-gap: 10px; }
#to-tachikawa .block02 .block-body .detail .parking .name { font-size: 16px; display: flex; align-items: center; }
#to-tachikawa .block02 .block-body .detail .parking .name .number { background-color: #3a6493; width: 18px; height: 18px; color: #fff; display: grid; place-content: center; border-radius: 50%; }
#to-tachikawa .block02 .block-body .detail .parking .distance { font-size: 14px; margin-top: 5px; }
#to-tachikawa .block02 .block-body .picture { align-self: flex-end; }
#to-tachikawa .block02 .block-body > .note { color: #fff; grid-column: span 2; margin-top: 30px; }
#to-tachikawa .block03 .block-header { grid-template-columns: 1fr 0.34fr; }
#to-tachikawa .block03 .block-header .name { order: 2; padding: 0 20px; }
#to-tachikawa .block03 .block-header .name img { max-width: 143px; width: 100%; height: auto; }
#to-tachikawa .block03 .block-header .img { order: 1; }
#to-tachikawa .block03 .block-body { display: grid; grid-template-columns: 1fr 0.81fr; margin-top: 40px; column-gap: 8.47%; }
#to-tachikawa .block03 .block-body .conceptual-diagram { grid-column: span 2; margin-bottom: 40px; }
#to-tachikawa .block03 .block-body .conceptual-diagram .cap { text-align: right; margin-top: 5px; }
#to-tachikawa .block03 .block-body .lead, #to-tachikawa .block03 .block-body .note { padding-right: 80px; }
#to-tachikawa .block03 .block-body .note { margin-top: 20px; }
#to-tachikawa .block03 .block-body .picture { width: 21.69%; margin-left: auto; margin-top: -30px; }
#to-tachikawa .block03 .block-body .picture img { width: 100%; height: auto; }

@media screen and (max-width: 768px) { #to-tachikawa::before { width: 120px; }
  #to-tachikawa .block01 { margin-top: 40px; }
  #to-tachikawa .block01 .block-header { margin: 0 calc(50% - 50vw); }
  #to-tachikawa .block01 .block-body { grid-template-columns: 1fr; margin-top: 20px; }
  #to-tachikawa .block01 .block-body .conceptual-diagram { grid-column: span 1; }
  #to-tachikawa .block01 .block-body .conceptual-diagram .img { overflow-x: scroll; margin: 0 calc(50% - 50vw); }
  #to-tachikawa .block01 .block-body .conceptual-diagram .img .scroll { width: 200%; }
  #to-tachikawa .block01 .block-body .copy { grid-template-columns: 61px 1fr; column-gap: 20px; }
  #to-tachikawa .block01 .block-body .copy .komidashi { order: 2; grid-column: span 1; align-self: flex-end; }
  #to-tachikawa .block01 .block-body .copy .lead { order: 3; }
  #to-tachikawa .block01 .block-body .copy .point { order: 4; grid-column: span 2; margin-top: 20px; }
  #to-tachikawa .block01 .block-body .copy .picture { order: 1; grid-row: span 2; }
  #to-tachikawa .block01 .block-body .video { margin-top: 30px; }
  #to-tachikawa .block01 .block-body > .note { grid-column: span 1; }
  #to-tachikawa .block02 { margin: 80px calc(50% - 50vw) 0; }
  #to-tachikawa .block02 .block-header { grid-template-columns: 1fr 24%; column-gap: 5px; padding: 30px 35px; }
  #to-tachikawa .block02 .block-header .name { grid-column: span 2; margin-right: auto; margin-bottom: 20px; }
  #to-tachikawa .block02 .block-header .picture { align-self: center; }
  #to-tachikawa .block02 .block-body { padding: 0 20px 20px; grid-template-columns: 1fr; }
  #to-tachikawa .block02 .block-body .conceptual-diagram { grid-column: span 1; }
  #to-tachikawa .block02 .block-body .conceptual-diagram .img { overflow-x: scroll; margin: 0 calc(50% - 50vw); }
  #to-tachikawa .block02 .block-body .conceptual-diagram .img .scroll { width: 200%; }
  #to-tachikawa .block02 .block-body .detail { grid-template-columns: 1fr; }
  #to-tachikawa .block02 .block-body .detail .title { grid-column: span 1; order: 1; text-align: center; }
  #to-tachikawa .block02 .block-body .detail .parking-list { order: 3; }
  #to-tachikawa .block02 .block-body .detail .map-image { order: 2; }
  #to-tachikawa .block02 .block-body > .note { grid-column: span 1; margin-top: 20px; }
  #to-tachikawa .block03 .block-header { margin: 0 calc(50% - 50vw); }
  #to-tachikawa .block03 .block-body { grid-template-columns: 1fr; }
  #to-tachikawa .block03 .block-body .conceptual-diagram { grid-column: span 1; }
  #to-tachikawa .block03 .block-body .conceptual-diagram .img { overflow-x: scroll; margin: 0 calc(50% - 50vw); }
  #to-tachikawa .block03 .block-body .conceptual-diagram .img .scroll { width: 200%; }
  #to-tachikawa .block03 .block-body .copy { display: grid; grid-template-columns: 1fr 20%; grid-template-rows: repeat(3, auto) 1fr; }
  #to-tachikawa .block03 .block-body .copy .komidashi { order: 1; }
  #to-tachikawa .block03 .block-body .copy .lead { order: 3; padding-right: 0; }
  #to-tachikawa .block03 .block-body .copy .note { order: 4; padding-right: 0; }
  #to-tachikawa .block03 .block-body .copy .picture { margin-top: 0; width: 100%; order: 2; grid-row: span 4; }
  #to-tachikawa .block03 .block-body .point { margin-top: 30px; } }
/*******************************

car

*******************************/
#car { padding-bottom: 80px; }
#car::before { display: block; content: ''; height: 1px; width: 206px; background-color: #829395; margin-bottom: 60px; margin-inline: auto; }
#car .category-name { width: clamp(141px, 25vw, 282px); }
#car .inner:has(.block01) { width: 100%; max-width: 100%; }
#car .block01 { width: 100%; padding-right: calc((100% - 1050px) / 2); margin-right: auto; display: grid; grid-template-columns: 1fr 0.37fr; column-gap: 6%; align-items: flex-start; }
#car .block01 .img { order: 1; grid-row: span 2; }
#car .block01 .copy { order: 2; }
#car .block01 .position { order: 3; margin-top: 50px; }
#car .block01 .position .img { margin-top: 10px; }
#car .block02 { margin-top: 80px; }
#car .block02 .station-list { max-width: 781px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 26px; margin-inline: auto; }
#car .block02 .station-list + .note { max-width: 781px; text-align: right; margin-top: 30px; margin-inline: auto; }
#car .block02 .station .text { text-align: center; margin-top: 10px; }
#car .block02 .station .text img { max-width: 100%; height: auto; }
#car .block03 { margin-top: 100px; }
#car .block03 .note { text-align: right; }

@media screen and (max-width: 1366px) { #car .block01 { padding-right: 50px; } }
@media screen and (max-width: 768px) { #car::before { width: 120px; }
  #car .category-name { margin-inline: auto; }
  #car .inner:has(.block01) { width: 90%; margin: 0 auto; }
  #car .block01 { grid-template-columns: 1fr; padding-right: 0; }
  #car .block01 .img { order: 2; grid-row: span 1; margin-top: 20px; }
  #car .block01 .copy { text-align: center; }
  #car .block01 .position { margin-top: 30px; }
  #car .block01 .position br { display: none; }
  #car .block02 { margin-top: 40px; }
  #car .block02 .station-list { grid-template-columns: repeat(2, 1fr); column-gap: 20px; gap: 30px 20px; }
  #car .block02 .station-list + .note { text-align: left; }
  #car .block02 .station .text img { height: 120px !important; width: auto !important; } }
@media screen and (max-width: 480px) { #car { padding-bottom: 20px; }
  #car .block03 { margin: 30px calc(50% - 50vw ) 0; padding-left: 10px; }
  #car .block03 .cap { padding-right: 5px; } }
/*******************************

limousine-bus

*******************************/
#limousine-bus { background-color: #fff; padding: 80px 0; }
#limousine-bus .category-name { width: clamp(181px, 25vw, 363px); margin-inline: auto; }
#limousine-bus .komidashi { text-align: center; margin-top: 40px; }
#limousine-bus .detail { display: grid; grid-template-columns: 0.93fr 1fr; align-items: flex-start; column-gap: 35px; margin-top: 40px; }
#limousine-bus .detail .image-photo { grid-row: span 2; }
#limousine-bus .note { margin-top: 20px; }

@media screen and (max-width: 768px) { #limousine-bus { padding: 50px 0; }
  #limousine-bus .detail { grid-template-columns: repeat(2, 1fr); column-gap: 20px; }
  #limousine-bus .detail .image-photo { grid-row: span 1; }
  #limousine-bus .detail .minutes { grid-column: span 2; max-width: 420px; margin-inline: auto; margin-top: 30px; } }
