@charset "utf-8";

/* CSS Document */
.itinerary {
  width: 95%;
  max-width: 950px;
  margin: 0 auto;
  /*font-family: 'Noto Sans JP', sans-serif;*/
  color: #333333;
}

.itinerary>h3,
.itinerary>p.attention {
  color: #FFFFFF;
}

.itinerary .day_unit {
  width: 100%;
}

.itinerary .day_unit h3.nday {
  width: 100%;
  text-align: center;
  background: #C00000;
  font-size: 120%;
  color: #FFFFFF;
}

.itinerary .day_unit .nday {
  width: 100%;
  text-align: center;
  background: rgba(117, 201, 231, 1.00);
  padding: 5px 0;
}

.itinerary .day_unit img.icon {
  width: 25px;
  margin: 0 5px;
}

.itinerary .day_unit dl {
  width: 100%;
}

.itinerary .day_unit dl dt {
  width: 100%;
  text-align: center;
  background: #E7E7E7;
  padding: 5px;
}

.itinerary .day_unit dl dd {
  width: 100%;
  padding: 10px 10px 0;
  background: #FFFFFF;
  text-align: left;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.itinerary .day_unit dl dd.text_center {
  text-align: center;
}

.itinerary .day_unit ul {
  /*width: 100%;*/
  margin-bottom: 20px;
}

.itinerary .day_unit ul li,
.itinerary .day_unit ul li div {
  display: inline;
  /*line-height: 1.8;*/
  line-height: 3;
}

.itinerary .day_unit.inline ul li {
  display: inline;
  /*line-height: 1.8;*/
}

.itinerary h4 {
  font-size: 100%;
  font-weight: bold;
  display: inline;
  margin-left: 4px;
  margin-right: 4px;
  line-height: 2;
  white-space: nowrap;
}

.h4back {
  background-color: rgb(255, 224, 224);
}

.itinerary .day_unit span.time {
  color: #9568EF;
  margin-right: 5px;
}

.itinerary .day_unit ul .bold {
  font-weight: bold;
}

.itinerary .day_unit ul .air {
  background: url("../images/itinerary/line_double_air.svg") repeat-x center left;
  background-size: auto;
  padding: 0 20px;
}

.itinerary .day_unit ul .air span {
  /*background: url("../images/itinerary/icon_air.svg") no-repeat center left 5px #FFFFFF;
  background-size:20px;*/
  background-color: #FFFFFF;
  padding: 5px;
  color: #F19317;
  font-size: 90%;
}

.itinerary .day_unit ul .centerline,
.itinerary .day_unit p.centerline {
  background: url("../images/itinerary/line_center.svg") repeat-x center left;
  background-size: auto;
  padding: 0 30px;
  margin-left: -5px;
}

.itinerary .day_unit ul .centerline span,
.itinerary .day_unit p.centerline span {
  background: #FFFFFF;
  background-size: auto;
  padding: 0 5px;
}

.itinerary .day_unit ul .entering {
  /*background:url("../images/itinerary/line_double.svg") repeat-x center left;*/
  background: url("../images/itinerary/line_dot_bus.svg") repeat-x center left;
  background-size: auto;
  padding: 0 20px;
  margin-left: -5px;
}

.itinerary .day_unit ul .entering span.place,
.itinerary .day_unit ul span.entering {
  color: #A80320;
  font-weight: bold;
  font-size: 110%;
  padding: 0 5px;
  background: #FFFFFF;
}

.itinerary .day_unit ul .alighting {
  /*background:url("../images/itinerary/line_double.svg") repeat-x center left;*/
  background: url("../images/itinerary/line_dot_bus.svg") repeat-x center left;
  background-size: auto;
  padding: 0 20px;
  margin-left: -5px;
}

.itinerary .day_unit ul .alighting span.place,
.itinerary .day_unit ul span.alighting {
  color: #1e90ff;
  font-weight: bold;
  font-size: 110%;
  padding: 0 5px;
  background: #FFFFFF;
}

.itinerary .day_unit ul .windowview {
  background: url("../images/itinerary/line_double.svg") repeat-x center left;
  background-size: auto;
  padding: 0 30px;
  margin-left: -5px;
}

.itinerary .day_unit ul .windowview span.place {
  color: #333333;
  font-size: 120%;
  padding: 0 5px;
  background: #FFFFFF;
}

.itinerary .day_unit ul .shinkansen {
  background: url("../images/itinerary/line_shinkansen.svg") repeat-x center left;
  background-size: auto;
  padding: 0 20px;
  margin: 0 5px 0 -2px;
}

.itinerary .day_unit ul .shinkansen span {
  color: #333333;
  font-size: 90%;
  padding: 0 5px;
  background: #FFFFFF;
}

.itinerary .day_unit ul .alighting span {
  color: #41b163;
  font-size: 90%;
  padding: 0 -3px;
  background: #FFFFFF;
}

.itinerary .day_unit ul .ship {
  background: url("../images/itinerary/line_wavy.svg") repeat-x center left;
  background-size: auto;
  padding: 0 30px;
}

.itinerary .day_unit ul span.staytime {
  background: #FFFFFF;
  padding: 0 3px 0 0;
}

.itinerary .day_unit ul span.highlight {
  background: #F9EF81;
  padding: 2px 5px;
}

.itinerary .day_unit ul span.emphasis {
  background: #E1082F;
  padding: 0 5px;
  color: #FFFFFF;
}

.itinerary .day_unit ul span.walk {
  background: url("../images/itinerary/line_dot_walk.svg") repeat-x center left #FFFFFF;
  background-size: auto;
  padding: 0 15px;
}

.itinerary .day_unit .option {
  border: 1px solid #46BA42;
  padding: 5px 10px;
  display: inline-block;
  margin: 10px 0;
}

.itinerary .day_unit .option h3 {
  background: #46BA42;
  color: #FFFFFF;
  padding: 0 5px;
  border-radius: 5px;
  display: inline;
  margin-top: 10px;
  margin-right: 5px;
  font-size: 120%;
}

.itinerary .day_unit .option p.attention {
  font-size: 90%;
  text-align: left;
  display: inline;
  display: block;
  padding: 0;
  margin: 0 !important;
}

.itinerary .day_unit dd>p.attention {
  text-align: left;
  margin-bottom: 10px;
}

.itinerary .day_unit ul .train {
  background: url("../images/itinerary/line_cross_train.svg") repeat-x center left;
  background-size: auto;
  padding: 0 20px;
}

.itinerary .day_unit ul .train span {
  /*background: url("../images/itinerary/icon_train.svg") no-repeat bottom 8px left 5px #FFFFFF;
  background-size: 25px;*/
  background-color: #FFFFFF;
  padding: 5px;
  /* color: #87C022;*/
  color: #06b716;
  font-size: 90%;
}

.itinerary .day_unit ul .train-walk {
  background: url("../images/itinerary/line_train_walk.svg") repeat-x center left;
  background-size: auto;
  padding: 0 20px;
}

.itinerary .day_unit ul .walk {
  background: url("../images/itinerary/line_dot_walk.svg") repeat-x center left;
  background-size: auto;
  padding: 0 20px;
}

.itinerary .day_unit ul .walk span {
  /*background: url("../images/itinerary/icon_walk.svg") no-repeat center left 5px #FFFFFF;
  background-size: 10px;*/
  background-color: #FFFFFF;
  padding: 5px;
  color: #C1272D;
  font-size: 90%;
}

.itinerary .day_unit ul .taxi {
  background: url("../images/itinerary/line_dot_taxi.svg") repeat-x center left;
  background-size: auto;
  padding: 0 20px;
}

.itinerary .day_unit ul .taxi span {
  background: url("../images/itinerary/icon_taxi.svg") no-repeat bottom 8px left 5px #FFFFFF;
  background-size: 25px;
  padding: 5px 5px 5px 35px;
  color: #2FBBEA;
  font-size: 90%;
}

.itinerary .day_unit ul .bus {
  background: url("../images/itinerary/line_dot_bus.svg") repeat-x center left;
  background-size: auto;
  padding: 0 15px;
}

.itinerary .day_unit ul .bus span {
  background: url("../images/itinerary/icon_bus.svg") no-repeat bottom 8px left 5px #FFFFFF;
  background-size: 25px;
  padding: 5px 0 5px 35px;
  color: #41b163;
  font-size: 90%;
}

.itinerary .day_unit ul .free {
  background: url("../images/itinerary/line_dot_free.svg") repeat-x center left;
  background-size: auto;
  padding: 0 20px;
}

.itinerary .day_unit ul .free span,
.itinerary .day_unit p.free span {
  background: #E0CAB8;
  background-size: 25px;
  padding: 2px 5px;
  color: #6D3D19;
  font-size: 90%;
}

.itinerary #icon.day_unit {
  width: 100%;
  margin-top: 20px;
}

.itinerary #icon.day_unit ul {
  display: inline;
  margin-right: 20px;
}

.itinerary #icon.day_unit ul {
  display: inline;
  margin-right: 20px;
}

.itinerary #icon.day_unit ul .air span {
  padding-right: 0;
}

.itinerary #conditions.day_unit ul li {
  text-indent: -1em;
  margin-left: 1em;
}

.itinerary .point_unit {
  width: 100%;
  border: 1px solid #CCC;
  margin-top: 40px;
}

.itinerary .point_unit dl {
  width: 100%;
}

.itinerary .point_unit dl dt {
  width: 100%;
  text-align: center;
  background: #BBF0E3;
  padding: 5px;
}

.itinerary .point_unit dl dd {
  width: 100%;
  padding: 10px 20px;
  background: #FFFFFF;
}

.itinerary .point_unit h4 {
  display: block;
  margin-top: 10px;
  font-size: 120%;
}

.itinerary .photo_unit {
  width: 100%;
  display: flex;
  justify-content: center;
}

.itinerary .photo_unit li {
  width: 31.3%;
  margin: 0 1%;
  text-align: center;
}

.itinerary .photo_unit li img {
  width: 100%;
}

.itinerary p.caption {
  font-size: 12px;
  margin-top: 3px;
}

@media (max-width:767px) {
  #itinerary .inner {
    width: 90%;
    margin: 0 auto;
    padding: 30px 0;
  }

  .itinerary p.caption {
    font-size: 10px;
    margin-top: 3px;
  }

  .itinerary .day_unit.inline ul li {
    margin-bottom: 10px;
  }
}