﻿/* CSS Document */
@charset "UTF-8";
/*-------------------------------*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent;
}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  display: block;
}
body {
  background: #ffffff;
  font: normal normal normal 100% sans-serif;
  font-family: 'Noto Sans CJK JP', 'Noto Sans JP', 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic ProN', 'Heebo', Arial, Helvetica, sans-serif;
  font-weight: 400;
  color: #555555;
  -webkit-text-size-adjust: 100%;
}
section, form, div, input, textarea, table, tr, th, td, ul, ol, li, dl, dt, dd, header, main, footer, nav, span, a, h1, h2, h3, h4, h5, h6, img {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
}
ul, ol, li {
  list-style: none outside;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
th, td {
  vertical-align: middle;
  text-align: left;
}
a {
  color: #004ea2;
  text-decoration: underline;
}
a:visited {
  text-decoration: underline;
}
a:hover {
  text-decoration: none;
}
.linkIconBlankTyp1 {
  display: inline-block;
  padding-right: 12px;
  background: url(../images/ico_blank_01.png) no-repeat 100% 50% / 8px auto;
}
.linkTxtTyp01 a {
  display: inline-block;
  border: 1px solid #e6e6e6;
  padding: 10px 30px;
  border-radius: 50px;
  color: #555555;
  background-color: #ffffff;
  text-decoration: none;
  box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%);
  transition: box-shadow 0.2s ease-out;
}
.linkTxtTyp01 a:hover {
  color: #004ea2;
  text-decoration: none;
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.2);
}
@media screen and (min-width:768px) {
  body {
    min-width: 1140px;
  }
}
#wrapHeader, #wrapContents, #wrapFooter {
  text-align: left;
  font-size: 100%;
}
.layWidTyp01 {
  position: relative;
  width: 1100px;
  margin: 0 auto;
}
@media screen and (max-width:767px) {
  .layWidTyp01 {
    width: auto;
    margin: 0 20px;
  }
}
@media screen and (max-width:340px) {
  .layWidTyp01 {
    margin: 0 10px;
  }
}
/*-------------------------------*/
/*運行情報　ヘッダー*/
#wrapHeader {
  margin: 0 0 30px;
}
header.layWidTyp01 {
  display: flex;
  margin-top: 10px;
}
#headerIdentity {
  margin-right: 15px;
}
#headerIdentity img {
  display: block;
  width: 164px;
  height: 50px;
}
#wrapHeader .EM {
  position: relative;
  top: 18px;
  margin-right: 15px;
  font-size: 1.6rem;
}
#wrapHeader .asof {
  display: flex;
  align-items: flex-end;
  font-size: 0.9rem;
}
#wrapHeader .asof span {
  display: inline-block;
  padding: 2px 10px;
  background: #efefef;
  border-radius: 50px;
}
.positionTrain {
  position: absolute;
  top: 10px;
  right: 0;
}
.positionTrain a {
  display: flex;
  align-items: center;
}
.positionTrain .layTxt { /*add 2021/9/27*/
  display: flex;
}
.positionTrain img {
  margin-right: 10px;
  width: 22px;
  height: auto;
}
@media screen and (max-width:767px) {
  header {
    flex-wrap: wrap;
    padding-right: 180px;
  }
  #headerIdentity {
    margin-right: 10px;
  }
  #headerIdentity img {
    width: 110px;
    height: auto;
  }
  #wrapHeader .EM {
    top: 0;
    margin: 10px 10px 0 0;
    font-size: 1.2rem;
  }
  #wrapHeader .asof {
    margin-top: 5px;
  }
  .positionTrain {
    top: 5px;
    right: 0;
  }
  .positionTrain.linkTxtTyp01 a {
    padding: 10px 20px;
  }
  .positionTrain img {
    width: 20px;
  }
  .positionTrain .layTxt {
    text-align: center;
    font-size: 0.75rem;
  }
}
@media screen and (max-width:470px) {
  header {
    flex-wrap: wrap;
    padding-right: 80px;
  }
  .layWidTyp01 {
    margin: 0 10px;
  }
  #wrapHeader .EM {
    margin: 12px 0 0 0;
    font-size: 4.5vw;
  }
  .positionTrain.linkTxtTyp01 a {
    flex-direction: column;
    justify-content: center;
    padding: 10px;
    border-radius: 6px;
  }
  .positionTrain img {
    margin: 0 0 3px;
  }
}
@media screen and (max-width:374px) {
  #wrapHeader .asof {
    margin-top: 3%;
    font-size: 4vw;
  }
  .positionTrain.linkTxtTyp01 a {
    flex-direction: row;
    padding: 4px;
  }
  .positionTrain img {
    margin: 0 3px 0;
    width: 18px;
  }
  .positionTrain .layTxt { /*add 2021/9/27*/
    display: block;
  }
  .positionTrain .adj {
    display: block;
    text-align: left;
    font-size: 3.5vw;
  }
}
/*-------------------------------*/
/*フッター*/
#wrapFooter {
  display: flex;
  justify-content: center;
  padding: 0 0 30px;
  background: #353535;
}
footer {
  width: 100%;
}
#footerIdentity {
  margin: 40px auto 30px;
  text-align: center;
}
p.copyRight {
  margin: 30px 0 0;
  text-align: center;
  font-size: 0.7rem;
  color: #ffffff;
}
@media screen and (max-width:767px) {
  #wrapFooter {
    display: block;
    padding: 0 0 40px 0;
  }
  #footerIdentity {
    margin: 40px 0 0;
    border-top: 1px solid #454545;
    padding: 40px 20px 0;
  }
  #footerIdentity img {
    width: 170px;
    height: auto;
  }
  p.copyRight {
    margin: 20px 0 0;
    border-top: none;
  }
  body.chatbot p.copyRight {
    padding: 0 0 150px;
  }
}
/*-------------------------------*/
/*本文*/
#wrapContents {
  line-height: 1.7;
}
@media screen and (max-width:767px) {
  #wrapContents {
    line-height: 1.5;
  }
  #wrapContents h1, #wrapContents h2, #wrapContents h3 {
    line-height: 1.3;
  }
  #wrapContents h4 {
    line-height: 1.4;
  }
}
/*-------------------------------*/
.layEm {
  max-width: 1100px;
  margin: 0 auto 50px;
}
.emMap img {
  display: block;
  width: 100%;
  height: auto;
}
.wrapEmInfo {
  margin: 20px auto;
  width: 800px;
}
.emInfo {
  display: flex;
  width: 100%;
  border-radius: 6px;
}
.emInfo + .emInfo {
  margin-top: 5px;
}
@media screen and (max-width:767px) {
  .layEm {
    margin: 0 auto 30px;
  }
  .emMap {
    padding: 0 5px;
  }
  .emInfo {
    flex-direction: column;
  }
  .wrapEmInfo {
    margin: 10px 0;
    width: 100%;
    padding: 0 5px;
  }
}
.emInfoDetail {
  width: 620px;
}
.emInfoDetail > p {
  margin: 5px;
  font-size: 0.95rem;
  font-weight: 700;
}
.emInfoDetail > p + p {
  margin-top: 8px;
}
@media screen and (max-width:767px) {
  .emInfoDetail {
    width: 100%;
  }
}
.emTbl01 {
  width: 100%;
  height: 100%;
  font-size: 0.95rem;
  font-weight: 700;
}
.emInfoDetail th {
  padding: 5px 5px 5px 0;
  border-bottom: 1px solid #dddddd;
}
.emInfoDetail .emTblTh01 {
  width: 24%;
  max-width: 150px;
  padding: 5px;
  vertical-align: middle;
  text-align: center;
  border-right: 1px solid #cccccc;
}
.emInfoDetail td {
  padding: 5px 10px;
  border-bottom: 1px solid #dddddd;
}
.emInfoDetail td p + p {
  margin-top: 6px;
}
.emInfoDetail tr:last-child th, .emInfoDetail tr:last-child td {
  border-bottom: none;
}
/*-------------------------------*/
/*見出し*/
.emInfoTitle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 180px;
  min-height: 90px;
  padding: 5px;
}
.emInfoTitle h2 {
  font-size: 1.2rem;
  color: #000000;
}
@media screen and (max-width:767px) {
  .emInfoTitle {
    display: flex;
    width: 100%;
    min-height: inherit;
  }
}
/*見出し横に設置するリンク：字は少し小さく*/
.layLink01 {
  position: absolute;
  bottom: 5px;
  right: 10px;
  font-size: 0.7rem;
}
@media screen and (max-width:767px) {
  .layLink01 {
    display: flex;
    justify-content: flex-end;
    position: relative;
    bottom: inherit;
    right: 5px;
    margin-top: 5px;
    width: 100%;
  }
}
/*-------------------------------*/
/*通常時*/
.emLv00 {
  margin: 50px 0;
}
/*運転見合せ*/
.emInfo.emLv01 {
  border: 2px solid #e14b45;
}
.emInfo.emLv01 .emInfoTitle {
  background: #e14b45;
}
.emInfo.emLv01 .emInfoTitle h2 {
  color: #ffffff;
}
/*遅延・一部運休*/
.emInfo.emLv02 {
  border: 2px solid #eac600;
}
.emInfo.emLv02 .emInfoTitle {
  background: #eac600;
}
/*振替輸送*/
.emInfo.emLv03 {
  border: 2px solid #a3d38e;
}
.emInfo.emLv03 .emInfoTitle {
  background: #a3d38e;
}
/*バス代行輸送*/
.emInfo.emLv04 {
  border: 2px solid #a3d38e;
}
.emInfo.emLv04 .emInfoTitle {
  background: #a3d38e;
}
/*-------------------------------*/
/*路線 流し込み表示*/
.emListLine li {
  display: inline-block;
  margin-right: 20px;
  word-break: keep-all;
}
/*-------------------------------*/
.emListCmn + .emListCmn {
  margin-top: 5px;
  border-top: 1px dotted #999999;
  padding-top: 5px;
}
.emListCmn li + li {
  margin-top: 6px;
  border-top: 1px dotted #999999;
  padding-top: 6px;
}
.emListCmn dt {
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width:767px) {
  .emListCmn + .emListCmn {
    border-top: 1px solid #dddddd;
  }
}
/*-------------------------------*/
/*路線＋区間*/
.layTxt1 {
  display: inline-block;
  word-break: keep-all;
  padding-right: 8px; 
}
th > .layTxt1 {
  padding-right: 0;
}
/*-------------------------------*/
/*「運転再開見込時刻」　add 2021/10/04*/
.adjSpace {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.adjSpace .layTxt1 {
  padding-right: 0;
}
/*-------------------------------*/
/*方面*/
.layTxt2 {
  display: inline-block;
  word-break: keep-all;
}
/*-------------------------------*/
.layTxt3 {
  display: block;
  word-break: keep-all;
}
/*-------------------------------*/
.layTxt4 {
  display: block;
}
/*-------------------------------*/
/*自由入力欄*/
.wrapFree {
  margin: 20px 0;
  padding: 10px;
  background: #ffffff;
  border-radius: 6px;
}
.wrapEmInfo .wrapFree:first-child {
  margin-top: 0;
}
.wrapFree p + p {
  margin-top: 6px;
}
.wrapFree.typ1 {
  border: 2px solid #dddddd;
}
.wrapFree.typ2 {
  border: 2px solid #a8c8e5;
}
@media screen and (max-width:767px) {
  .wrapFree {
    margin: 10px 5px;
  }
}
/*-------------------------------*/
.wrapEmAdd01 {
  margin: 20px 0;
}
.wrapEmAdd02 {
  margin: 20px 0;
  border-top: 1px solid #444444;
  padding-top: 20px;
}
/*-------------------------------*/
/*運行情報　特出しお知らせ*/
.wrapSpecialNews {
  font-size: 0.95rem;
  color: #da1818;
}
.wrapSpecialNews .specialNewsItem {
  display: flex;
}
.wrapSpecialNews .specialNewsItem + .specialNewsItem {
  margin-top: 5px;
}
.wrapSpecialNews .specialNewsItemDt {
  margin-right: 30px;
}
.wrapSpecialNews a {
  color: #da1818;
}
@media screen and (max-width:767px) {
  .wrapSpecialNews .specialNewsItem {
    display: block;
  }
  .wrapSpecialNews .specialNewsItem + .specialNewsItem {
    margin-top: 10px;
  }
  .wrapSpecialNews .specialNewsItemDt {
    display: inline;
    margin-right: 10px;
  }
  .wrapSpecialNews .specialNewsItemDd {
    display: inline;
  }
}
/*運行情報　特出しお知らせ　.typ1　薄桃背景*/
.wrapSpecialNews.typ1 {
  padding: 5px 0;
  background: #f6e6e8;
}
.wrapSpecialNews.typ1:first-of-type {
  padding-top: 10px;
}
.wrapSpecialNews.typ1:last-of-type {
  padding-bottom: 10px;
}
/*運行情報　特出しお知らせ　.typ1　アイコン表示*/
.wrapSpecialNews.iconExclamation .specialNewsItem {
  position: relative;
  padding: 5px 0 5px 40px;
  min-height: 25px;
}
.wrapSpecialNews.iconExclamation .specialNewsItem:after {
  content: "";
  display: block;
  position: absolute;
  top: 5px;
  left: 0;
  width: 25px;
  height: 25px;
  background: url("../images/svg/ico_exclamation.svg") no-repeat 0 50% / 25px 25px;
}
/*-------------------------------*/
/*end*/