h2.page_title {
    text-align: center;
    /* margin-top: -100px; */
    top: 48vw;
    /* margin: auto; */
    right: 0;
    left: 0;
    font-size: 12vw;
    color: #FFF;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.4);
}
@media screen and (min-width: 897px) {
    h2.page_title {
        top: 200px;
        font-size: 50px;
        background-color: rgba(0, 0, 0, 0.4);
    }
}

figure.mainBgImg {
    -webkit-animation: unset;
    animation: unset;
    opacity: 1;
}

@media screen and (min-width: 897px){
  #main_visual.pc__ {
      height: 350px; /* �C���O��430px */
  }
}


#searchBox .pulldown {
    margin: 30px 0 50px 0;
}

#searchBox .pulldown select {
    width: 42%;
    padding: 8px 10px;
    margin-top: 6px;
    color: #000;
    font-weight: 900;
    -webkit-border-radius: 0.2em;
    -moz-border-radius: 0.2em;
    border-radius: 0.2em;
    background: #fff;
    border: 2px solid #aaa;
}

#searchBox .area_image li{
    display: inline-block;
    margin-right: 10px;
}

#searchBox .area_image figure{
    display: inline-block;
    position: relative;
}

#searchBox .area_image img{
  position: relative;
    width: 163px;
    margin-bottom: 20px;
    height: 140px;
}

#searchBox .area_image figcaption{
  color: #fff;
    position: absolute;
    left: 50%;
        transform: translate(-50%,-20px);
    bottom: 0;
    font-size: 21px;
    line-height: 1.1;
    text-align: center;
}

#searchBox .map_container{
  border: 2px solid #aaa;
  padding: 20px 0;
}

#searchBox .map_container .allRoutes{
  text-align: center;
}

#routesList h2{
  color: #fff;
    padding: 12px 0 12px 20px;
}

#routesList p.from_to{
      font-size: 22px;
padding: 12px 0 12px 20px;
}

#routesList li{
  margin-bottom: 10px;
}

#routesList li > div{
  height: 120px;
}

@media screen and (min-width: 897px){
  #routesList li > div{
    height: 100px;
  }
}


#routesList .condition_container{
  background: #CAECFD;
    width: 70%;
    display: inline-block;
    vertical-align: top;
 position: relative;
}


#routesList .from{
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 20px;
    width: 42%;
}

#routesList .arrow{
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 50%;
    width: 5%;
}
#routesList .to{
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0;
    width: 42%;
}


#routesList .price_container{
  background: #34B5E8;
    width: 28%;
    display: inline-block;
    vertical-align: top;
    position: relative;
}

#routesList .price{
position: absolute;
top: 50%;
transform: translateY(-50%);
color: #fff;
left: 20px;
}




#routesList .Hokkaido h2{
  background: #9FD9DF;
}