@charset "utf-8";

:root {
  --letter-32: 3.2px;
}
@media screen and (max-width: 767px) {
  :root {
    --letter-32: 1.6px;
  }
}

/* .hdNav_btn, .hdNav_panel {display: none;} */
.cmn_table--2rows {
  max-width: 900px;
  th {
    width: 50%;
    text-align: left;
  }
  td {
    padding: 0.75em 15px;
  }
  & + p.indent_txt {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
  }
}


.en_status {
  width: 100%;
  padding: 0.5em;
  margin-bottom: var(--space-65);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 1em;
  color: var(--var-color);
  font-size: var(--basic-txt);
  border: 1px solid var(--var-color);
  &:has(+ .en_status) {margin-bottom: 1em;}
  @media screen and (max-width: 767px) {
    flex-wrap: wrap;
    gap: 0.5em 1em;
  }
}
.en_status--label {
  padding: 0.25em 0.5em;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--var-color);
}
.en_status--cont {
  a {
    text-decoration: underline;
    &:hover {text-decoration: none;}
  }
}

.en_anchor {
  background: var(--light-gray);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5em;
  padding: 1em;
  margin-bottom: var(--space-65);
  @media screen and (max-width: 767px) {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
}
.en_anchor--item {
  a {
    background: #fff;
    font-size: var(--basic-txt);
    letter-spacing: var(--letter-32);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.25em 1em;
  }
}

.en_ttlMain {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1em;
  margin-bottom: var(--space-65);
  @media screen and (max-width: 767px) {
    flex-direction: row-reverse;
    justify-content: flex-end;
  }
}
.en_ttlMain--txt {
  min-width: max-content;
  font-size: var(--font-32);
  letter-spacing: var(--letter-64);
  @media screen and (max-width: 767px) {
    min-width: initial;
  }
}
.en_ttlMain--line {
  background: var(--light-gray);
  width: 100%;
  height: 2px;
  @media screen and (max-width: 767px) {
    background: var(--var-color);
    width: 20px;
    min-width: 20px;
  }
}

.en_ttlSub {
  font-size: var(--font-24);
  letter-spacing: var(--letter-48);
  margin-bottom: var(--space-30);
}

.en_more--btnOuter {
  p:not(:last-child) {margin-bottom: 1em;}
}
.en_more--btn {
  display: inline-block;
  background: var(--light-gray);
  padding: 0.75em 1em;
  &:has(img[src = "img/icon_window.webp"]) {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
  }
}

.en_ttlBasic {
  font-size: var(--font-20);
  letter-spacing: var(--letter-40);
  display: flex;
  align-items: center;
  font-weight: bold;
  margin-bottom: var(--space-30);
  gap: 1em;
  &::before {
    content: '';
    display: inline-block;
    background: var(--var-color);
    width: 20px;
    min-width: 20px;
    height: 2px;
  }
}

.en_table--fares {
  width: 100%;
  tr {
    border-bottom: 2px solid #fff;
  }
  tr *:not(:last-child) {
    border-right: 2px solid #fff;
  }
  th {
    width: 12.5%;
    height: 84px;
    text-align: center;
    padding: 0.75em 15px;
    background: #404040;
    color: #fff;
  }
  td {
    width: 12.5%;
    padding: 0.75em 15px;
  }
  td.bg-light {
    background: var(--light-gray);
  }
  td.bg-dark {
    background: var(--middle-gray);
  }
  @media screen and (max-width: 767px) {
    width: 1024px;
  }
}

.en_details--label {
  position: relative;
  list-style: none;
  padding: 20px 32px;
  &::-webkit-details-marker {display: none;}
  &::before,
  &::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 2px;
    background: #fff;
    top: 0;
    right: 32px;
    bottom: 0;
    margin: auto;
    transition: transform .1s ease;
  }
  &::before {transform: rotate(45deg) translate(-4px, 4px);}
  &::after {transform: rotate(-45deg) translate(4px, 4px);}

  &.sr26-red {background: var(--sr26-red);color: #fff;}
  &.sr25-orange {background: var(--sr25-orange);}
  &.sr24-yellow {background: var(--sr24-yellow);}
  &.sr23-green {background: var(--sr23-green);}
  &.sr22-blue {background: var(--sr22-blue);color: #fff;}
  &.sr21-violet {background: var(--sr21-violet);color: #fff;}
  &.sr20-purple {background: var(--sr20-purple);color: #fff;}

  &.sr19-red {background: var(--sr19-red);color: #fff;}
  &.sr19-red + .en_details--add {padding-bottom: var(--space-45);}
}
.en_details--item {
  &:not(:last-child) {
    margin-bottom: var(--space-30);
  }
  &[open] .en_details--label::before {
    transform: rotate(45deg);
  }
  &[open] .en_details--label::after {
    transform: rotate(-45deg);
  }
}
.en_details--cont {
  padding: var(--space-65) var(--space-45);
  background: var(--light-gray);
  &:has(img[src = "/common/img/barrier_free1.png"]),
  &:has(img[src = "/common/img/barrier_free3.png"]),
  &:has(img[src = "/common/img/barrier_free7.png"]) {padding-bottom: calc(65px + 36px);}
  &:has(img[src = "/common/img/barrier_free6.png"]) {padding-bottom: calc(65px + 50px);}
  @media screen and (max-width: 767px) {
    padding-right: 1em;
    padding-left: 1em;
    &:has(img[src = "/common/img/barrier_free1.png"]),
    &:has(img[src = "/common/img/barrier_free3.png"]),
    &:has(img[src = "/common/img/barrier_free7.png"]) {padding-bottom: calc(40px + 36px);}
    &:has(img[src = "/common/img/barrier_free6.png"]) {padding-bottom: calc(40px + 50px);}
  }
}
.en_details--add {
  margin-bottom: var(--space-30);
}
.en_details--addItem {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1em;
  dt {
    min-width: 160px;
  }
  @media screen and (max-width: 767px) {
    flex-wrap: initial;
    flex-direction: column;
    &:not(:last-child) {
      margin-bottom: 0.5em;
    }
    dt {font-weight: bold;}
  }
}

.en_details--info {
  position: relative;
  width: 100%;
  background: #fff;
  padding: 1em;
  margin-bottom: var(--space-45);
  &.mb_none {margin-bottom: 0;}
}
.en_details--infoList {
  width: 100%;
  max-width: 1024px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.75em;
}
.en_details--infoLink {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.25em;
  background: var(--light-gray);
  padding: 0.5em 1em;
}

.en_bf {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  @media screen and (max-width: 767px) {
    gap: 3em 6px;
  }
}
.en_bf--fig {
  position: relative;
  background: var(--var-color);
  width: 72px;
  height: 72px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  figcaption {
    position: absolute;
    font-size: 1rem;
    top: 72px;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
  }
  @media screen and (max-width: 767px) {
    width: calc(33.3% - 4px);
    max-width: 72px;
  }
}

/* .ft_nav {display: none;} */