/* 路線図 slick slider
------------------------------------------------------------------ */

.slick-slider {
  position: relative;

  display: block;
  box-sizing: border-box;

  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;

  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
      touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  text-align: center;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
     -moz-transform: translate3d(0, 0, 0);
      -ms-transform: translate3d(0, 0, 0);
       -o-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;

  display: block;
}
.slick-track:before,
.slick-track:after {
  display: table;

  content: '';
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;

  height: 100%;
  min-height: 1px;
}

[dir='rtl'] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;

  height: auto;

  border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
  display: none;
}


/* Arrows */
.slick-prev,
.slick-next {
  font-size: 0;
  line-height: 0;

  position: absolute;
  top: 44%;

  display: block;

  width: 20px;
  height: 20px;
  padding: 0;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);

  cursor: pointer;

  color: transparent;
  border: none;
  outline: none;
  background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  color: transparent;
  outline: none;
  background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
  opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: .25;
}

.slick-prev:before,
.slick-next:before {
  font-family: 'FontAwesome';
  font-size: 30px;
  line-height: 0.5;
  color: #f7726c;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-prev {
  left: -28px;
}
[dir='rtl'] .slick-prev {
  right: -28px;
  left: auto;
}
.slick-prev:before {
  content: '\f104';
}
[dir='rtl'] .slick-prev:before {
  content: '\f105';
}

.slick-next {
  right: -28px;
}
[dir='rtl'] .slick-next {
  right: auto;
  left: -28px;
}
.slick-next:before {
  content: '\f105';
}
[dir='rtl'] .slick-next:before {
  content: '\f104';
}

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 50px;
}

.slick-dots {
  position: absolute;
  bottom: -20px;

  display: block;

  width: 100%;
  padding: 0;
  margin: 0;

  list-style: none;

  text-align: center;
}
.slick-dots li {
  position: relative;

  display: inline-block;

  width: 20px;
  height: 20px;
  margin: 0 5px;
  padding: 0;

  cursor: pointer;
}
.slick-dots li button {
  font-size: 0;
  line-height: 0;

  display: block;

  width: 20px;
  height: 20px;
  padding: 5px;

  cursor: pointer;

  color: transparent;
  border: 0;
  outline: none;
  background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}
.slick-dots li button:before {
  font-family: 'FontAwesome';
  font-size: 6px;
  line-height: 20px;

  position: absolute;
  top: 0;
  left: 0;

  width: 20px;
  height: 20px;

  content: '\f111';
  text-align: center;

  opacity: .25;
  color: #2c425a;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
  opacity: .75;
  color: #2c425a;
}


/* 路線図
------------------------------------------------------------------ */

.stationlist {
  margin: 20px 0 50px;
  text-align: center;
}

.routemap {
  width: 92%;
  margin: 20px auto 140px;
  padding-bottom: 20px;
  }


.route-item {
  list-style-type: none;
  vertical-align: top;
  position: relative;
  text-align: center;
  margin: auto;
  }

.route-item a:focus{
  outline:none !important;
}

.route-item a:active{
  outline:none !important;
}

.route-item:before {
  content: "";
  border-right: 85px solid #f7726c; /* 当初45px */
  position: absolute;
  left: 65%;
  top: 45%;
  bottom: 45%;
  z-index: -1;
}

.route-item:after {
  content: "";
  border-right: 85px solid #f7726c; /* 当初45px */
  position: absolute;
  right: 65%;
  top: 45%;
  bottom: 45%;
  z-index: -1;
}

/* 五井駅 */
.route-item-start{
  list-style-type: none;
  vertical-align: top;
  position: relative;
  text-align: center;
  margin: auto;
  }

.route-item-start:before {
  content: "";
  border-right: 85px solid #f7726c; /* 当初45px */
  position: absolute;
  left: 50%; /* 当初70% */
  top: 45%;
  bottom: 45%;
  z-index: -1;
}

.route-item-start a:focus{
  outline:none !important;
}

.route-item-start a:active{
  outline:none !important;
}

/* 上総中野駅 */
.route-item-end {
  list-style-type: none;
  vertical-align: top;
  position: relative;
  text-align: center;
  margin: auto;
  }

.route-item-end:before {
  content: "";
  border-right: 45px solid #ccc;
  position: absolute;
  left: 70%;
  top: 48%;
  bottom: 48%;
  z-index: -1;
}

.route-item-end:after {
  content: "";
  border-right: 45px solid #f7726c;
  position: absolute;
  right: 70%;
  top: 45%;
  bottom: 45%;
  z-index: -1;
}

.route-item-end a:focus{
  outline:none !important;
}

.route-item-end a:active{
  outline:none !important;
}

/* 終端駅 */
.route-item-endz {
  list-style-type: none;
  vertical-align: top;
  position: relative;
  text-align: center;
  margin: auto;
  }

.route-item-endz:after {
  content: "";
  border-right: 85px solid #f7726c; /* 当初45px */
  position: absolute;
  right: 50%; /* 当初70% */
  top: 45%;
  bottom: 45%;
  z-index: -1;
}

.route-item-endz a:focus{
  outline:none !important;
}

.route-item-endz a:active{
  outline:none !important;
}


/* 未成線駅 */
.route-item-yet {
  list-style-type: none;
  vertical-align: top;
  position: relative;
  text-align: center;
  margin: auto;
  }

.route-item-yet:before {
  content: "";
  border-right: 45px solid #ccc;
  position: absolute;
  left: 70%;
  top: 48%;
  bottom: 48%;
  z-index: -1;
}

.route-item-yet:after {
  content: "";
  border-right: 45px solid #ccc;
  position: absolute;
  right: 70%;
  top: 48%;
  bottom: 48%;
  z-index: -1;
}

.route-item-yet a:focus{
  outline:none !important;
}

.route-item-yet a:active{
  outline:none !important;
}

/* 安房小湊駅 */
.route-item-awa {
  list-style-type: none;
  vertical-align: top;
  position: relative;
  text-align: center;
  margin: auto;
  }

.route-item-awa:after {
  content: "";
  border-right: 45px solid #ccc;
  position: absolute;
  right: 70%;
  top: 48%;
  bottom: 48%;
  z-index: -1;
}

.route-item-awa a:focus{
  outline:none !important;
}

.route-item-awa a:active{
  outline:none !important;
}


/* 主要駅 */
.sta-name {
  display: inline-block;
  padding: .9rem;
  background-color: #fff;
  border: double 4px #fd897c;
  -moz-border-radius: 1.7rem;
  -webkit-border-radius: 1.7rem;
  -khtml-border-radius: 1.7rem;
  border-radius: 1.7rem;
  font-size:1.0rem;
  font-size:1.1rem;
  line-height: 1.0;
  font-weight: 600;
  color: #003b82;
  -webkit-writing-mode: vertical-rl;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  -ms-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  letter-spacing: 0.3rem;
  height: 10rem;
  vertical-align: middle;
}

.sta-name a{
  padding: 4px;
  display: block;
  text-decoration: none;
  }

.sta-name:hover {
  background: #fd897c;
  color: #fff;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  border: 4px solid #fd897c;
}

.sta-name:active {
  background: #fd897c;
  color: #fff;
}

/* 一般駅 */
.sta-name-s {
  position: relative;
  margin: 1rem 0;
  display: inline-block;
  padding: .8rem;
  background-color: #fff;
  border: 1px solid #c6c6c6;
  -moz-border-radius: 1.5rem;
  -webkit-border-radius: 1.5rem;
  -khtml-border-radius: 1.5rem;
  border-radius: 1.5rem;
  font-weight: 600;
  color: #003b82;
  -webkit-writing-mode: vertical-rl;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  -ms-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  letter-spacing: 0.1rem;
  height: 8rem;
  vertical-align: middle;
}

.sta-name-s a{
  padding: 4px;
  display: block;
  text-decoration: none;
  }

.sta-name-s:hover {
  background: #fd897c;
  color: #fff;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  border: 1px solid #fd897c;
}

.sta-name-s:active {
  background: #fd897c;
  color: #fff;
  outline: none;
}

	
/* ******************** Media Queries による切り替え ******************** */


/* PCレイアウト 800px
-------------------------------------------------- */
@media only screen and (min-width: 800px) {

  .stationlist {
    margin: 40px 0 80px;
  }

}