@charset "UTF-8";
/* CSS Document */
.pcOnly {
  display: block;
}
#station #stationListWrap {
  width: 100%;
  position: relative;
}
#station #stationListWrap a {
  text-decoration: none;
}
#station #stationListWrap::after {
  position: absolute;
  top: 0;
  left: 50%;
  content: "";
  display: inline-block;
  border-right: 42px solid #e5f4fb;
  height: 100%;
  background-repeat: no-repeat;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
#station .stationWrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px;
  position: relative;
  z-index: 2;
}
#station .stationWrapper .stImg {
  width: 38%;
  height: 170px;
  box-sizing: border-box;
  background: #fff;
  border-radius: 20px;
  position: relative;
}
#station .stationWrapper .stImg::after {
  content: "";
  display: inline-block;
  border-right: 6px solid #e5f4fb;
  height: 100%;
  position: absolute;
  top: 0;
  left: 37px;
  z-index: 1;
}
#station .stBtn {
  padding: 0;
  width: 25%;
  line-height: 1.5em;
}
#station .jikokuUnchinWrap {
  width: 100%;
}
#station .stSetsubi {
  width: 33%;
  height: auto;
  margin: 0;
  background: none;
}
#station .stGaikan {
  display: flex;
}
#station .stGaikan img {
  padding: 0;
  width: 100%;
  height: auto;
  border: 5px solid #FFF;
  border-radius: 10px;
}
#station .stName {
  font-size: 36px;
  display: flex;
  align-items: center;
  margin-top: 20px;
  background-repeat: no-repeat;
  position: relative;
  z-index: 2;
}
#station .stName::before {
  content: "";
  display: inline-block;
  width: 50px;
  height: 50px;
  background-size: contain;
  z-index: 3;
  position: relative;
  margin-right: 8px;
}
#station .stName#stationNumber1 {
  background-image: url(images/stNumber1.svg);
}
#station .stName#stationNumber2 {
  background-image: url(images/stNumber2.svg);
}
#station .stName#stationNumber3 {
  background-image: url(images/stNumber3.svg);
}
#station .stName#stationNumber4 {
  background-image: url(images/stNumber4.svg);
}
#station .stName#stationNumber5 {
  background-image: url(images/stNumber5.svg);
}
#station .stName#stationNumber6 {
  background-image: url(images/stNumber6.svg);
}
#station .stName#stationNumber7 {
  background-image: url(images/stNumber7.svg);
}
#station .stName#stationNumber8 {
  background-image: url(images/stNumber8.svg);
}
#station .stImg a.btnArrrowWhiteLeft {
  position: absolute;
  right: 30px;
  bottom: 20px;
  background: #0195d5;
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  padding: 10px 20px;
  border-radius: 10px;
  font-size: 16px;
  letter-spacing: 0.05em;
}
#station .stImg a.btnArrrowWhiteLeft::before {
  content: "";
  display: inline-block;
  background-image: url(images/arrowR_White.svg);
  background-repeat: no-repeat;
  height: 12px;
  width: 8px;
  background-size: contain;
  margin-right: 8px;
}
#station .stImg a:hover.btnArrrowWhiteLeft {
  background: #31b1dd;
}
#station .btnJikokuhyo, 
#station .btnUnchin, 
#station .btnInfo,
#station .btnNoneIconWhite {
  box-sizing: border-box;
  background: #fff;
  position: relative;
  text-decoration: none;
  text-align: center;
  font-weight: 600;
}
#station .btnJikokuhyo::before, 
#station .btnUnchin::before,
#station .btnNoneIconWhite::before {
  display: inline-block;
  content: "";
  min-height: 30px;
  background-size: contain;
  z-index: 3;
  position: relative;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
}
#station .btnInfo::before {
  display: inline-block;
  content: "";
  background-image: url(images/icon_areamap.svg);
  width: 50px;
  max-height: 50px;
  background-repeat: no-repeat;
  margin-right: 10px;
}
#station .btnJikokuhyo::before {
  background-image: url(images/icon_watch.svg);
}
#station .btnUnchin::before {
  background-image: url(images/icon_ticket.svg);
}
#station .furikae::before {
  background-image: url(images/icon_furikae.svg);
}
#station .kinkyu::before {
  background-image: url(images/icon_kinkyu.svg);
}
#station .btnJikokuhyo, 
#station .btnUnchin,
#station .btnNoneIconWhite{
  width: 48%;
  padding: 10px 8px;
  margin-bottom: 15px;
  border-radius: 15px;
  position: relative;
}
#station .btnJikokuhyo a, 
#station .btnUnchin a, 
#station .btnInfo a,
#station .btnNoneIconWhite a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
	z-index: 5;
}
#station .btnJikokuhyo:hover, 
#station .btnUnchin:hover, 
#station .btnInfo:hover,
#station .btnNoneIconWhite:hover {
  background: #99d5ee;
  cursor: pointer;
}
#station .btnInfo {
  width: 100%;
  border-radius: 10px;
  display: flex;
  text-align: left;
  padding: 12px;
  box-sizing: border-box;
  position: relative;
  min-height: 68px;
}

/* ---------------------    
SP Style
---------------------- */
@media all and (max-width: 768px) {
  .pcOnly {
    display: none;
  }
  #station .stationWrapper {
    display: block;
  }
  #station .stationWrapper .stImg, #station .stSetsubi {
    width: 100%;
  }
  #station .stBtn {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-top: 15px;
    /*margin-bottom: 15px;*/
  }
  #station .btnInfo {
    margin-left: 8px;
    min-height: 84px;
    padding: 17px 10px;
  }
  #station .btnJikokuhyo a, #station .btnUnchin a, #station .btnInfo a, #station .btnJikokuhyo:hover, #station .btnUnchin:hover, #station .btnInfo:hover {
    cursor: none;
    opacity: 1;
	  pointer-events:auto;
  }
}