/*---------------------------------------------------

Variables

-----------------------------------------------------
Colors
---------------------------------------------------*/
/*---------------------------------------------------
Font
---------------------------------------------------*/
/*---------------------------------------------------
Layout
---------------------------------------------------*/
/*---------------------------------------------------
Transitions
---------------------------------------------------*/
/*---------------------------------------------------
Image path
---------------------------------------------------*/
/*---------------------------------------------------
Border Radius
---------------------------------------------------*/
/*---------------------------------------------------

LIGHT | Page Only

-----------------------------------------------------
Light
---------------------------------------------------*/
.light {
  padding: 20px;
}
@media (min-width: 960px), print {
  .light {
    max-width: 1680px;
    margin: 0 auto;
  }
}

/*---------------------------------------------------
Overview
---------------------------------------------------*/
.light-overview {
  margin-bottom: 20px;
  border-bottom: 1px solid #dedede;
  /*----------------------------
  Block
  ----------------------------*/
  /*----------------------------
  Block
  ----------------------------*/
  /*----------------------------
  Date time
  ----------------------------*/
}
.light-overview__block {
  margin-bottom: 20px;
}
@media (min-width: 768px) {
  .light-overview__block {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}
.light-overview .title {
  font-size: 1.5rem;
  font-weight: 600;
}
@media (min-width: 768px) {
  .light-overview .title {
    font-size: 2rem;
  }
}
.light-overview .datetime {
  font-size: 0.875rem;
}

/*---------------------------------------------------
Operation
---------------------------------------------------*/
.light-operation {
  margin-bottom: 30px;
  border-bottom: 1px solid #dedede;
  /*----------------------------
  Title
  ----------------------------*/
  /*----------------------------
  Item
  ----------------------------*/
  /*----------------------------
  Image
  ----------------------------*/
  /*----------------------------
  Detail
  ----------------------------*/
}
@media (min-width: 768px) {
  .light-operation {
    display: flex;
    flex-wrap: wrap;
  }
}
.light-operation .title {
  padding: 5px 0;
  text-align: center;
  font-size: 1.125rem;
  font-weight: bold;
  border-top: 2px solid #6C6C6C;
}
@media (min-width: 768px) {
  .light-operation .title {
    width: 100%;
  }
}
.light-operation__item {
  display: flex;
  padding: 10px 0;
  border-top: 1px solid #dedede;
}
@media (min-width: 768px) {
  .light-operation__item {
    display: block;
    width: 50%;
    padding: 10px;
    border-top: none;
  }
  .light-operation__item.higashiyama {
    order: 1;
  }
  .light-operation__item.meijo {
    order: 3;
  }
  .light-operation__item.tsurumai {
    order: 5;
  }
  .light-operation__item.sakuradori {
    order: 2;
  }
  .light-operation__item.kamiiida {
    order: 4;
  }
  .light-operation__item.bus {
    order: 5;
  }
}
.light-operation__item.bus .light-operation__image {
  background: none;
}
@media (min-width: 768px) {
  .light-operation__item.bus .light-operation__image {
    border-top: 1px solid #6C6C6C;
    border-bottom: 1px solid #dedede;
  }
}
.light-operation__image {
  width: 80px;
  padding: 10px 0;
  text-align: center;
  background: #4C4948;
}
@media (min-width: 768px) {
  .light-operation__image {
    display: flex;
    width: 100%;
  }
}
.light-operation__image img {
  display: block;
  margin: 0 auto 5px;
}
@media (min-width: 768px) {
  .light-operation__image img {
    margin: 0;
    padding-left: 10px;
  }
}
.light-operation .wideImage {
  display: none;
}
@media (min-width: 768px) {
  .light-operation .wideImage {
    display: block;
  }
}
@media (min-width: 768px) {
  .light-operation .shortImage {
    display: none;
  }
}
.light-operation__detail {
  width: calc(100% - 80px);
  padding: 0 0 0 20px;
  line-height: 1.4;
}
@media (min-width: 768px) {
  .light-operation__detail {
    width: 100%;
    padding: 10px;
  }
}
.light-operation__detail .status {
  margin-bottom: 10px;
}
@media (min-width: 768px) {
  .light-operation__detail .status {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    /*margin-bottom: 15px;*/
  }
}
.light-operation__detail .status .ja {
  line-height: 1.8;
  font-size: 1.125rem;
  font-weight: 600;
  padding-left: 28px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 24px;
}
@media (min-width: 768px) {
  .light-operation__detail .status .ja {
    font-size: 1.25rem;
    margin-right: 20px;
  }
}
.light-operation__detail .status .ja.status-normal {
  background-image: url(../../assets/img/operation/icon-ontime.svg);
}
.light-operation__detail .status .ja.status-delay {
  background-image: url(../../assets/img/operation/icon-delay.svg);
}
.light-operation__detail .status .ja.status-delay-error {
  background-image: url(../../assets/img/operation/icon-delay-error.svg);
}
.light-operation__detail .status .ja.status-suspended {
  background-image: url(../../assets/img/operation/icon-suspended.svg);
}
.light-operation__detail .status .en {
  font-weight: 600;
  /*margin-bottom: 5px;*/
}
@media (min-width: 768px) {
  .light-operation__detail .status .text {
    width: 100%;
    margin-top: 10px;
  }
}
.light-operation__detail .secter {
  margin-bottom: 10px;
}
@media (min-width: 768px) {
  .light-operation__detail .secter {
    display: flex;
    margin-bottom: 5px;
    flex-wrap: wrap;
  }
}
@media (min-width: 768px) {
  .light-operation__detail .secter .ja {
    margin-right: 20px;
  }
}
@media (min-width: 768px) {
  .light-operation__detail .reason {
    display: flex;
  }
}
@media (min-width: 768px) {
  .light-operation__detail .reason .ja {
    margin-right: 20px;
  }
}
.light-operation__detail .traffic-detail-container:not(:first-child) {
  margin-top: 20px;
}

/*---------------------------------------------------
Copyright
---------------------------------------------------*/
.light-copyright {
  display: block;
  font-size: 0.75rem;
  text-align: center;
}

/*---------------------------------------------------
Notice
---------------------------------------------------*/
/*---------------------------------------------------
Information
---------------------------------------------------*/
.light-infomation {
  padding-bottom: 30px;
  margin-bottom: 20px;
  border-bottom: 1px solid #dedede;
}
.light-infomation a {
  color: #1E569B;
  text-decoration: underline;
}
.light-infomation a.ext {
  padding-right: 1.2em;
  background: url(../../assets/img/icon/box-arrow-up-right.svg) no-repeat right center;
  background-size: 0.7em 0.7em;
}
.light-infomation a.ext::after {
  display: none;
}
.light-infomation .icon-external {
  display: inline-block;
  width: 0.7em;
  height: 0.7em;
  margin-left: 4px;
  border: 1px solid currentColor;
  border-left: none;
  border-bottom: none;
  transform: rotate(45deg);
  vertical-align: text-top;
}

/*---------------------------------------------------
Files
---------------------------------------------------*/
.light-files {
  padding-bottom: 30px;
  margin-bottom: 20px;
  border-bottom: 1px solid #dedede;
}
.light-files h2 {
  margin-bottom: 10px;
  font-size: 1.125rem;
  font-weight: 600;
}
.light-files ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.light-files li {
  margin-bottom: 6px;
  line-height: 1.6;
}
.light-files a {
  color: #1E569B;
  text-decoration: underline;
  word-break: break-all;
}
.light-files .icoPdf {
  padding: 10px 0 10px 30px !important;
  background: url(../../Jassets/img/common/ico_pdf.jpg) no-repeat left 10px !important;
  background-size: 24px !important;
}
.light-files .file-suffix {
  margin-left: 4px;
  font-size: 0.75rem;
  color: #333;
}