@charset "UTF-8";
/* ==== ======================================================
railway_index_css
========================================================== */
/* contents
---------------------------------------------------------- */
.contents-category-top {
overflow: visible;
}
/* area-category-top
---------------------------------------------------------- */
.area-category-train-01 {
background-color: #f2f2e7;
padding: 35px 0 33px;
}
/* 運行情報
---------------------------------------------------------- */
.area-service-info-01 {
background-color: #f2f2e7;
}
.mod-service-info-01,
.mod-service-info-02{
display: none;
width: 1120px;
margin: 0 auto;
background-color: #f2f2e7;
}
.area-service-info-01 .headline {
font-size: 120%;
font-weight: bold;
vertical-align: middle;
float: left;
text-align: left;
}
.area-service-info-01 .headline a{
display:inline-block;
border-left:3px solid #e82026;
line-height:1;
padding-left:10px;
}
/**********/
.area-service-info-01 .button2 {
display: inline;
width: 110px;
float: right;
vertical-align: middle;
}
.area-service-info-01 .button2 a {
width: 100%;
display: block;
border-radius: 5px;
_background-color: #e82026;
background-color: #ccc;
font-weight: bold;
    background-image: url(/common/img/ico/ico_arrow_right_01.svg);
    background-repeat: no-repeat;
    background-position: 4% center;
    background-size: 8px 12px;
padding: 0px 0px;

}
.area-service-info-01 .button2 a:hover {
text-decoration: none;
background-color: #bbb;
}

.mod-service-info-02 .button2 {
    float: none;
    display:inline-block
}
.mod-service-info-02 .button2 a{
    padding: 0px 0px 0px 20px;
}
/*******/
.area-service-info-01 .button {
width: 100px;
float: right;
vertical-align: middle;
}
.area-service-info-01 .button a {
width: 100%;
display: block;
background-color: #e82026;
color: #fff;
font-weight: bold;
border-radius: 3px;
padding: 3px 20px;
background-image: url(/common/img/ico/ico_button_arrow_01.svg);
background-repeat: no-repeat;
background-position: 90% center;
background-size: 8px 12px;
}
.area-service-info-01 .button a:hover {
text-decoration: none;
}
/* mod-service-01
---------------------------------------------------------- */
.mod-service-info-01 {
overflow: hidden;
padding: 8px 0;
position: relative;
}
.mod-service-info-01 .detail-top {
overflow: hidden;
}
.mod-service-info-01 .detail-top .list-wrap {
display: block;
vertical-align: middle;
float: right;
margin: 0;
}
.mod-service-info-01 .detail-top .list-wrap .list {
text-align: center;
}
.mod-service-info-01 .detail-top .list-wrap .list li {
float: left;
margin-left: 20px;
font-size: 93.333%;
}
.mod-service-info-01 .detail-top .list-wrap .list li img{
width:18px;
height:18px;
vertical-align:middle;
margin: 0 10px 0 0;
}
.mod-service-info-01 .detail-top .list-wrap .list li:first-child {
margin-left: 0;
}
.mod-service-info-01 .detail-bottom {
margin-top: 2px;
}
.mod-service-info-01 .detail-bottom .list-info{
display:table;
table-layout:fixed;
width:100%;
background-color:#FFF;
}
.mod-service-info-01 .detail-bottom .list-info li {
display:table-cell;
border-right: 1px solid #e6e6e6;
padding: 3px 20px;
line-height:1.8;
}
.mod-service-info-01 .detail-bottom .list-info li .text {
font-size: 93.333%;
float: left;
}
.mod-service-info-01 .detail-bottom .list-info li img {
float: right;
width: 20px;
height:20px;
margin-top:3px;
}
.mod-service-info-01 .detail-bottom .list-info li:last-child {
border-right: none;
}
/* mod-service-02
---------------------------------------------------------- */
.mod-service-info-02 {
overflow: hidden;
padding: 5px 0;
position: relative;
}
.mod-service-info-02 .detail {
overflow: hidden;
}
.mod-service-info-02 .detail .ico-correct-02 {
margin: 3px 10px 0 0;
width: 20px;
height: 20px;
}
.mod-service-info-02 .detail .text {
float: left;
text-align: left;
margin: 4px 0 0 40px;
}
.mod-service-info-02 .detail .button {
top: 10px;
right: 21px;
}
/* ttl
---------------------------------------------------------- */
.ttl-train-01 {
font-weight: bold;
font-size: 120%;
margin-bottom: 10px;
text-align: left;
}
.ttl-cmn-02 {
margin-top: 30px;
}
/* link
---------------------------------------------------------- */
.list-cmn-04.s-type-01 {
margin-top: 0;
}
/* mod
---------------------------------------------------------- */
/* mod-form-top
---------------------------------------------------------- */
.mod-form-top  {
width: 1120px;
margin: 0 auto;
padding: 20px 0 50px;
text-align: left;
}
.mod-form-top .detail-wrap {
}
.mod-form-top .detail-wrap-left {
float: left;
width: 740px;
text-align: left;
position: relative;
}
/*detail-top*/
.mod-form-top .detail-top {
background-color: #f2f2e7;
padding: 20px 25px 15px 25px;
}
.mod-form-top .detail-top .list {
overflow: hidden;
margin: 0 -8px;
}
.mod-form-top .detail-top .list li {
float: left;
width: 50%;
padding: 0 8px;
}
.mod-form-top .detail-top .list li a.link01 {
width: 100%;
display: block;
text-align: center;
font-weight: bold;
background-color: #fff;
border: 2px solid #000;
padding: 14px 27px 14px 43px;
font-size: 106.667%;
}
.mod-form-top .detail-top .list li a.link01:hover {
text-decoration: none;
}
.mod-form-top .detail-top .list .list01 a.link01 {
background-image: url(/common/img/ico/ico_arrow_right_01.svg) ;
background-repeat: no-repeat ;
background-position: 96% center;
background-size: 8px 12px;
}
.mod-form-top .detail-top .list .list01 a.link01 .ico {
position: relative;
display: inline-block;
text-align: left;
}
.mod-form-top .detail-top .list .list01 a.link01 .ico:before {
position: absolute;
top: 2px;
left: -42px;
content: "";
width: 40px;
height: 22px;
display: inline-block;
background-image: url(/railway/img/ico_device_01.png);
background-size: 40px 22px;
background-repeat: no-repeat;
}
.mod-form-top .detail-top .list .list02 a.link01 {
background-image: url(/common/img/ico/ico_arrow_right_01.svg);
background-repeat: no-repeat;
background-position: 96% center;
background-size: 8px 12px;
}
.mod-form-top .detail-top .list .list02 a.link01 .ico {
position: relative;
display: inline-block;
text-align: left;
}
.mod-form-top .detail-top .list .list02 a.link01 .ico:before {
position: absolute;
top: 2px;
left: -25px;
content: "";
width: 20px;
height: 20px;
display: inline-block;
background-image: url(/railway/img/ico_tag_01.png);
background-size: 20px;
background-repeat: no-repeat;
}
.mod-form-top .detail-top .link02 {
margin-top: 14px;
}
.mod-form-top .detail-top .link02 a {
font-size: 93.333%;
padding-left: 20px;
background-image: url(/common/img/ico/ico_arrow_right_01.svg);
background-repeat: no-repeat;
background-size: 8px 12px;
background-position: 8px center;
}
/*detail-bottom*/
.mod-form-top .detail-bottom {
background-color: #f2f2e7;
padding: 20px 25px;
margin-top: 18px;
width: 100%;
}
.mod-form-top .list-form-top {
overflow: hidden;
margin: 0 auto;
width: 700px;
}
.mod-form-top .list-form-top li {
vertical-align: middle;
float: left;
}
:root .mod-form-top .list-form-top li{
  width:310px\0/;
}
:root .mod-form-top .list-form-top li:nth-child(2){
  width:64px\0/;
}

.mod-form-top .list-form-top li .text {
display: inline-block;
text-align: center;
vertical-align: middle;
background-color: #757575;
color: #fff;
padding: 8px 20px 7px;
line-height: normal;
min-width: 90px;
}
.mod-form-top .list-form-top .input-text-01 {
border-top: 1px solid #dcdcdc;
border-right: 1px solid #dcdcdc;
border-bottom: 1px solid #dcdcdc;
border-left: none;
vertical-align: middle;
width: 220px;
padding: 7px 10px 6px 18px;
}
.mod-form-top .list-form-top .input-text-02 {
border-top: 1px solid #dcdcdc;
border-right: 1px solid #dcdcdc;
border-bottom: 1px solid #dcdcdc;
border-left: none;
vertical-align: middle;
width: 220px;
padding: 7px 10px 6px 18px;
}
.mod-form-top .list-form-top .button {
margin: 5px 18px 0;
}
.mod-form-top .list-form-top .button img {
vertical-align: middle;
}
.mod-form-top .btn-cmn-02.input-button  {
width: 480px;
background-position:190px center;
background-color:#e82026;
color:#FFF;
border:none;
}
.mod-form-top .btn-cmn-wrap{
margin-top:15px;
}
.mod-form-top .btn-cmn-wrap span{
position:relative;
display: inline-block;
}
.mod-form-top .btn-cmn-wrap span:after{
content: "";
width: 13px;
height: 11px;
display: inline-block;
background:url(/common/img/ico/ico_window_02.svg) no-repeat center center;
background-size:13px 11px;
position:absolute;
top:20px;
right:15px;
}
.mod-form-top .detail-wrap-right {
float: right;
width: 360px;
}
/*list-calendar*/
.mod-form-top .list-calendar-01 {
text-align: center;
margin-top: 18px;
}
.mod-form-top .list-calendar-01 li {
display: inline-block;
vertical-align: middle;
}
.mod-form-top .list-calendar-01 .time {
margin-right: 22px;
}
.mod-form-top .list-calendar-01 li .year,
.mod-form-top .list-calendar-01 li .month{
margin: 0 3px 0 6px;
}
.mod-form-top .list-calendar-01 li .day {
margin: 0 3px 0 8px;
}
.mod-form-top .list-calendar-01 li .hour {
margin: 0 6px;
}
.mod-form-top .list-calendar-01 li .min {
margin: 0 6px;
}
.mod-form-top .list-calendar-01 .calendar-wrap {
margin: 0 8px 0  0;
}
/*list-radio-01*/
.mod-form-top .list-radio-01 {
text-align: center;
margin-top: 15px;
overflow: hidden;
}
.mod-form-top .list-radio-01 li {
display: inline-block;
margin-left: 21px;
}
.mod-form-top .list-radio-01 li:first-child{
margin-left: 0;
}
/*detail-middle*/
.mod-form-top .detail-middle {
background-color: #f2f2e7;
padding: 25px;
}
.mod-form-top .detail-middle .ttl-train-01 {
position: relative;
}
.mod-form-top .detail-middle .ttl-train-01:before {
content: "";
width: 30px;
height: 30px;
display: inline-block;
vertical-align: middle;
margin-right: 10px;
margin-top: -2px;
background-repeat: no-repeat;
background-position: left center;
background-size: 30px;
}
.mod-form-top .detail-middle.ekijikoku .ttl-train-01:before {
background-image: url(/railway/img/ico_clock_01.svg);
}
.mod-form-top .detail-middle.ekiinfo .ttl-train-01:before {
background-image: url(/railway/img/ico_train_01.svg);
}
.mod-form-top .detail-middle.ekiinfo{
margin-top:18px;
}
.mod-form-top .detail-middle .title {
font-size: 106.667%;
font-weight: bold;
margin: 5px 0;
}
.mod-form-top .detail-middle .formwrap{
display:table;
width:100%;
background-color:#FFF;
}
.mod-form-top .detail-middle .input,
.mod-form-top .detail-middle .subbtn{
display:table-cell;
}
.mod-form-top .detail-middle .input input{
width:100%;
border-top: 1px solid #dcdcdc;
border-left: 1px solid #dcdcdc;
border-bottom: 1px solid #dcdcdc;
border-right:none;
padding: 7px 8px 6px;
}
.mod-form-top .detail-middle .subbtn{
width:30px;
border-top: 1px solid #dcdcdc;
border-right: 1px solid #dcdcdc;
border-bottom: 1px solid #dcdcdc;
background-color:#FFF;
}
.mod-form-top .detail-middle .subbtn input{
width:30px;
height:30px;
border:none;
background:url(/common/img/ico/ico_button_search_02.svg) no-repeat center center;
background-size:16px 16px;
cursor:pointer;
}
.mod-form-top .detail-middle .list{
margin:10px 0 0 0;
font-size:93.3%;
letter-spacing: -0.5em;
}
.mod-form-top .detail-middle .list li{
letter-spacing: normal;
vertical-align: top;
display:inline-block;
margin:0 10px 10px 0;
width: calc((100% - 10px) / 2);  
widht: -webkit-calc((100% - 10px) / 2);
}
:root .mod-form-top .detail-middle .list li {
  margin:0 9px 10px 0\0/;
}
.mod-form-top .detail-middle .list li:nth-child(even){
margin-right:0;
}
.mod-form-top .detail-middle .list li a{
width:100%;
display: inline-table;
text-align: center;
vertical-align: middle;
background-color: #FFF;
padding: 5px 15px;
border:1px solid #dcdcdc;
border-radius: 3px;
background-image: url(/common/img/ico/ico_button_arrow_02.svg);
background-size: 8px 12px;
background-repeat: no-repeat;
background-position: 94% center;
text-decoration:none;
}
.mod-form-top .detail-middle .list li a:hover{
background-color:#F8E9E0;
}

/* 割引きっぷ
---------------------------------------------------------- */
.mod-info-tickets-01 {
margin-top: 20px;
}
.mod-info-tickets-01 .mod-info-tickets-in {
background-color: #f2f2e7;
padding: 20px 25px;
margin: 0 auto;
width: 1120px;
text-align: center;
overflow: hidden;
}
.mod-info-tickets-01 .item.s-left {
float: left;
width: 470px;
padding-left: 25px;
}
.mod-info-tickets-01 .item.s-right {
float: right;
width: 500px;
}
.mod-info-tickets-01 .item:first-child {
margin-left: 0;
}
.mod-info-tickets-01 .item .title {
position: relative;
font-weight: bold;
text-align: center;
margin-bottom: 15px;
}
.mod-info-tickets-01 .item.s-right .title:before {
left: 7px;
}
.mod-info-tickets-01 .item.s-right .title:after {
right: 7px;
}
.mod-info-tickets-01 .item .title:before {
content: "";
display: inline-block;
position: absolute;
top: 12px;
left: 0;
background: #e82026;
width: 125px;
height: 1px;
}
.mod-info-tickets-01 .item .title:after {
content: "";
display: inline-block;
position: absolute;
background: #e82026;
width: 123px;
height: 1px;
top: 12px;
right: 0;
}
.mod-info-tickets-01 .item .detail {
float: left;
margin-left: 20px;
}
.mod-info-tickets-01 .item .detail:first-of-type {
margin-left: 0;
}
.mod-info-tickets-01 .item .detail .image {
margin-bottom: 15px;
}
.mod-info-tickets-01 .item .detail .image img {
width: 210px;
}
.mod-info-tickets-01 .item .detail .image a {
width: 100%;
display: block;
}
.mod-info-tickets-01 .item .detail .link {
text-align: left;
font-size:93.3%;
}
.mod-info-tickets-01 .item .detail .link a {
padding-left: 20px;
background-image: url(/common/img/ico/ico_arrow_right_01.svg);
background-repeat: no-repeat;
background-position: 5px center;
background-size: 8px 12px;
}
.mod-info-tickets-01 .item .list {
font-size:93.3%;
}
.mod-info-tickets-01 .item .list li {
display:inline-block;
text-align: left;
widht: -webkit-calc((100% - 10px) / 2);
width: calc((100% - 10px) / 2);
margin:0 10px 5px 0;
vertical-align:top;
}
.mod-info-tickets-01 .item .list li:nth-child(2n) {
margin-right:0;
}
.mod-info-tickets-01 .item .list li a{
display:inline-block;
padding-left:25px;
background:url(/common/img/ico/ico_kippu_01.svg) no-repeat 0 0;
background-size:20px 20px;
}
.mod-info-tickets-01 .item .btn-phone-01 {
margin-top: 22px;
}
.mod-info-tickets-01 .item .btn-phone-01 a .ico {
padding: 2px 10px;
display: inline-block;

}
.mod-info-tickets-01 .item .btn-phone-01 a .ico:before {
content: "";
width: 18px;
height: 18px;
margin-right: 5px;
vertical-align: middle;
display: inline-block;
background-image: url(/common/img/ico/ico_drawer_contact_01.png);
background-repeat: no-repeat;
background-size: 18px;
}
.mod-info-tickets-01 .item .btn-phone-01 a {
width: 100%;
display: block;
background-color: #e82026;
color: #fff;
font-weight: bold;
padding: 12px 32px 12px;
border-radius: 3px;
background-image: url(/common/img/ico/ico_button_arrow_01.svg);
background-position: 96% center;
background-repeat: no-repeat;
background-size: 8px 12px;
}
.mod-info-tickets-01 .item .btn-phone-01 a:hover {
text-decoration: none;
}
.btn-search-01{
text-align:center;
}

/* おトクなきっぷを探す
---------------------------------------------------------- */
.mod-info-tickets-02 {
margin-top: 20px;
}
.mod-info-tickets-02 .mod-info-tickets-in {
background-color: #f2f2e7;
padding: 20px 25px;
}
.mod-info-tickets-02  .position-wrap {
position: relative;
}
.mod-info-tickets-02 .ruby {
font-size: 93.333%;
margin-bottom: 30px;
line-height: 1.2;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item.s-left {
vertical-align: top;
display:inline-block;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item.s-left.s-type-01 {
margin-left: 10px;
vertical-align: middle;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item.s-position {
position: absolute;
top: 0;
right: 0;
}
.mod-info-tickets-02  .item.s-position .list{
letter-spacing:-0.5em;
}
.mod-info-tickets-02  .item.s-position .list li {
vertical-align: top;
letter-spacing:normal;
display:inline-block;
}
.mod-info-tickets-02  .item.s-position .list li .esb-displayer {
width: 70px;
}
.mod-info-tickets-02 .item.s-position .list li span {
margin: 0 10px;
}
.mod-info-tickets-02 .item.s-position .list li.s-first {
margin: 9px 10px 0 0;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item-wrap {
margin-bottom: 20px;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item-wrap:last-child {
margin-bottom: 0;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item-wrap:after {
clear: both;
content: "";
display: table;
}
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 {
display: inline-block;
margin-left: 15px;
}
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 a {
width: 155px;
display: block;
border: 1px solid #000;
padding: 8px 17px 8px 12px;
background-image: url(/common/img/ico/ico_button_plus_02.png);
background-position: 94% center;
background-repeat: no-repeat;
line-height: 1.2;
}
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 a.is-active {
background-image: url(/common/img/ico/ico_button_minus_02.png);
}
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 a:hover,
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 a:active,
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 a:focus
{
text-decoration: none;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item{
letter-spacing:-0.5em;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item > *{
letter-spacing:normal;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item .select-wrap{
display:inline-block;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item .text {
width: 90px;
display: inline-block;
color: #fff;
padding: 8px 0 7px;
text-align: center;
line-height: normal;
background-color:#757575;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item .text.s-type-02 {
padding: 7px 0 8px;
vertical-align: middle;
}
.mod-info-tickets-02 .mod-form-tickets-01 .esb-displayer {
padding: 7px 24px 6px 12px ;
cursor: pointer;
border: 1px solid #dcdcdc;
width: 203px;
line-height: normal;
background-color:#FFF;
}
.easy-select-box.easy-select-10 .esb-displayer{
width:600px;
}
.mod-info-tickets-02 .mod-form-tickets-01 .form-text {
width: 505px;
border: 1px solid #dcdcdc;
padding: 6px 13px 7px;
color: #9e9e9e;
vertical-align: middle;
}
.mod-info-tickets-02 .mod-form-tickets-01 input[type="checkbox"] {
display: none;
}
.mod-info-tickets-02 .mod-form-tickets-01 input[type="checkbox"] + label {margin-left: 20px;padding-left: 26px;background-image: url(/common/img/btn/btn_input_checkbox_01_no.png);background-repeat: no-repeat;background-size: 14px;background-position: left center;}
.mod-info-tickets-02 .mod-form-tickets-01 input[type="checkbox"]:checked + label {
background-image: url(/common/img/btn/btn_input_checkbox_01_on.png);
}
.mod-info-tickets-02 .mod-form-tickets-01 .form-check {
margin-left: 10px;
}
.mod-info-tickets-02 .list-ticket-type {
letter-spacing:0.5em;
}
.mod-info-tickets-02 .list-ticket-type .title {
background-color: #757575;
color: #fff;
padding: 8px 9px;
}
.mod-info-tickets-02 .list-ticket-type .list {
margin-top: 20px;
}
.mod-info-tickets-02 .list-ticket-type .list:after {
content:'';
display:table;
clear:both;
}
.mod-info-tickets-02 .list-ticket-type .list li {
letter-spacing:normal;
display:inline-block;
vertical-align:top;
margin-top: 12px;
float:left;
}
.w100p{width:100%;}
.w50p{width:50%;}
.w33p{width:33%;}
.w25p{width:25%;}
.w12_5p{width:12.5%;}

.mod-info-tickets-02 .list-ticket-type .list li.col01 {
margin-left: 108px;
}
.mod-info-tickets-02 .list-ticket-type .list li.col02 {
margin-left: 76px;
}
.mod-info-tickets-02 .list-ticket-type .list li.col03 {
margin-left: 82px;
}
.mod-info-tickets-02 .list-ticket-type .list li.s-enter {
clear: both;
margin-left: 0 !important;
}
.mod-info-tickets-02 .mod-form-tickets-01 .list-ticket-type input[type="checkbox"] + label {
margin-left: 0;
}
.mod-info-tickets-02 .btn-search-01 {
margin: 25px auto 0;
}

/* 定期券運賃検索
---------------------------------------------------------- */
.mod-info-tickets-03 {
margin-top: 20px;
}
.mod-info-tickets-03 .item {
float: left;
width: 550px;
margin-left: 20px;
}
.mod-info-tickets-03 .item a {
width: 100%;
display: block;
background-color: #f2f2e7;
padding: 20px 25px;
}
.mod-info-tickets-03 .item a:hover {
text-decoration: none;
}
.mod-info-tickets-03 .item:first-child {
margin-left: 0;
}
.mod-info-tickets-03 .item .title {
font-size: 120%;
font-weight: bold;
margin-bottom: 5px;
padding-left: 25px;
background-image: url(/common/img/ico/ico_arrow_right_01.svg);
background-repeat: no-repeat;
background-size: 8px 12px;
background-position: 8px center;
}
.mod-info-tickets-03 .item .text {
font-size: 93.333%;
}
/* 駅設備・路線図
---------------------------------------------------------- */
.mod-info-train-find{
margin-top:20px;
}
.mod-info-train-find section{
background-color: #f2f2e7;
padding: 20px 450px 20px 25px;
position:relative;
}
.mod-info-train-find .item .list li{
display:inline-block;
widht: -webkit-calc((100% - 45px) / 3);
width: calc((100% - 45px) / 3);
padding-right:10px;
vertical-align:top;
}
.mod-info-train-find .item .list li a{
display:inline-block;
font-size: 93.333%;
padding-left: 15px;
background-image: url(/common/img/ico/ico_arrow_right_01.svg);
background-repeat: no-repeat;
background-position: 0 5px;
background-size: 8px 12px;
}
.mod-info-train-find .button {
width:400px;
position:absolute;
top:60px;
right:85px;
}
.mod-info-train-find .button.btn01{
top:8px;
}
.mod-info-train-find .button.btn02{
bottom:8px;
top:auto;
}
.mod-info-train-find .button a {
width: 100%;
display: block;
background-color: #e82026;
color: #fff;
font-weight: bold;
text-align: center;
border-radius: 3px;
padding: 14px 20px;
background-image: url(/common/img/ico/ico_button_arrow_01.svg);
background-repeat: no-repeat;
background-position: 96% center;
background-size: 8px 12px;
}
.mod-info-train-find .button a:hover {
text-decoration: none;
}
/*--------------------------------------------------*/
/*FORM SELECT*/
/*--------------------------------------------------*/
input[type="text"],
select {
font-size: 100%;
color: #424242;
}
select::-ms-expand {
display: none;
}
.easy-select-box {
display:inline-block;
position:relative;
}
.easy-select-box:focus{
outline:none;
}
/*IE7 hack*/
*:first-child+html .easy-select-box{
*display: inline;
*zoom: 1;
}
.easy-select-box .esb-displayer{
color:#333;
text-decoration:none;
}
.mod-form-top .esb-displayer{
padding: 6px 32px 6px 7px;
background-color:#FFF;
background-image:url(/common/img/btn/btn_select_01_pc.png) ;
background-repeat:no-repeat;
background-position:calc(100% - 10px) center;
background-size:8px 6px;
border:1px solid #ddd;
cursor:pointer;
display: inline-block;;
}
.easy-select-box .esb-dropdown{
width:100% !important;
margin:0 !important;
padding:0 !important;
min-height:33px;
max-height:340px;
background-color:#fafafa;
border-bottom:1px solid #eee;
border-left:1px solid #ddd;
overflow-x:hidden;
overflow-y:scroll !important;
position:absolute;
top:100%;
left:0;
z-index:99;
display:none;
}
.easy-select-box .esb-dropdown .esb-item{
margin:0 !important;
padding:3px 23px 3px 5px;
border-bottom:1px solid #eee;
text-align:left !important;
cursor:pointer;
}
.easy-select-box .esb-dropdown .esb-item.ov{background-color:#ddd;}

/*--------------------------------------------------*/
/*カレンダー*/
/*--------------------------------------------------*/
.ui-datepicker {
width: 17em;
background-color:#fff;
border:1px solid #999;
box-shadow: 0 5px 0 #7f7f7f;
padding: 40px 20px 10px;
display: none;
}
.ui-datepicker .ui-datepicker-header {
position: relative;
padding: .2em 0;
background-color: #ff4960;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
position: absolute;
height: 1.8em;
/* display:none; */
}
.ui-datepicker .ui-datepicker-prev {
width: 10em;
text-align:left;
left: 2px;
bottom:-35px;
}
.ui-datepicker .ui-datepicker-next {
width: 10em;
text-align:right;
right: 2px;
bottom:-35px;
}
.ui-datepicker .ui-datepicker-prev.ui-state-disabled,
.ui-datepicker .ui-datepicker-next.ui-state-disabled{color:#999999; text-decoration:none;}
/*
.ui-datepicker .ui-datepicker-prev-hover {
left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
right: 1px;
}
*/
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
/*
display: block;
position: absolute;
left: 50%;
margin-left: -8px;
top: 50%;
margin-top: -8px;
*/
cursor:pointer;
}
.ui-datepicker .ui-datepicker-prev.ui-state-disabled span,
.ui-datepicker .ui-datepicker-next.ui-state-disabled span {cursor:default;}
.ui-datepicker .ui-datepicker-title {
margin: 0 2.3em;
color:#fff;
font-weight:bold;
line-height: 1.8em;
text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
font-size: 1em;
margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
width: 49%;
}
.ui-datepicker table {
width: 100%;
font-size: .9em;
border-collapse: collapse;
margin: 0 0 .4em;
}
.ui-datepicker th {
padding: .7em .3em;
background-color:#fff;
border-right:1px solid #d7d7d7;
border-bottom:1px solid #d7d7d7;
font-weight:normal;
text-align: center;
}
.ui-datepicker th.ui-datepicker-week-sun{background-color:#fde9ea; color:#d60000;}
.ui-datepicker th.ui-datepicker-week-sut{background-color:#d9edf6; color:#2417e1;}
.ui-datepicker td {
background-color:#fff;
border-right:1px solid #d7d7d7;
border-bottom:1px solid #d7d7d7;
}
.ui-datepicker td.ui-datepicker-week-sun{background-color:#fde9ea; color:#d60000;}
.ui-datepicker td.ui-datepicker-week-sut{background-color:#d9edf6; color:#2417e1;}
.ui-datepicker td span,
.ui-datepicker td a {
color:#333;
display: block;
padding: .2em;
text-decoration: none;
}
.ui-datepicker td.ui-datepicker-week-sun span,
.ui-datepicker td.ui-datepicker-week-sun a{color:#d60000;}
.ui-datepicker td.ui-datepicker-week-sut span,
.ui-datepicker td.ui-datepicker-week-sut a{color:#2417e1;}
.ui-datepicker td.ui-datepicker-current-day{background-color:#f0dd8e;}
.ui-datepicker td.ui-datepicker-today,
.ui-datepicker td a:hover, .ui-datepicker td a:active{background-color:#fff3c3;}
.ui-datepicker td.ui-datepicker-unselectable span{
color:#999;
}
.ui-datepicker .ui-datepicker-buttonpane {
background-image: none;
/* margin: 20px 0 0 0; */
margin: 0;
padding: 0;
position:absolute;
top:10px;
right:20px;
}
.ui-datepicker .ui-datepicker-buttonpane button {
/* float: right; */
width:20px;
height:20px;
background:url(/common/img/btn/btn_calendar_close_01.gif) left center no-repeat;
border:none;
cursor: pointer;
overflow:hidden;
}
.ui-datepicker .ui-datepicker-buttonpane button span{display:none;}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
float: left;
display:none;
}
/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
/* width: auto; */
width:540px;
}
.ui-datepicker-multi .ui-datepicker-group {
width:238px;
margin-right:20px;
background-color:#ff4960;
float: left;
position:relative;
}
.ui-datepicker-multi .ui-datepicker-group table {
width: 95%;
margin: 0 auto .4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
/* width: 50%; */
width:238px;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last {
margin-right:0;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
clear: left;
}
.ui-datepicker-row-break {
clear: both;
width: 100%;
font-size: 0;
}
/* RTL support */
.ui-datepicker-rtl {
direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
right: 2px;
left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
left: 2px;
right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
right: 1px;
left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
left: 1px;
right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
border-right-width: 0;
border-left-width: 1px;
}
.ui-datepicker-trigger{
cursor:pointer;
}
.calendarNote{
padding:0 20px;
margin-top:1.5em;
}
.calendarNote p{
margin:0;
font-size:84.62%;
text-align:right;
}
/* js用css
---------------------------------------------------------- */
.area-read-infomation {
display: none;
}
.js-form-checks {
display: none;
}
@media screen and (max-width: 767px) {
/* area-category-top
---------------------------------------------------------- */
.area-category-train-01 {
background-color: #f2f2e7;
padding: 35px 12px 33px;
}
.area-pickup-01 {
background: #d6d5bf;
background: -webkit-linear-gradient(#d6d5bf 0%, #d6d5bf 1%);
background: linear-gradient(#d6d5bf 0%, #d6d5bf 1%);
}
/* service-info
---------------------------------------------------------- */
.mod-service-info-01,
.mod-service-info-02{
width: 100%;
margin: 0 auto;
}
.area-service-info-01 .headline {
font-size: 13px;
display: block;
width: auto;
float: none;
margin-bottom: 10px;
}
.area-service-info-01 .button {
width: 260px;
position: absolute;
right: 0;
left: 0;
bottom: 20px;
margin: auto;
}
.area-service-info-01 .button a {
padding: 10px 20px;
font-size: 12px;
background-position: 95% center;
background-size: 5px 8px;
}
/* mod-service-01
---------------------------------------------------------- */
.mod-service-info-01 {
padding: 15px;
}
.mod-service-info-01 .detail-top {
display: block;
}
.mod-service-info-01 .detail-top .list-wrap {
display: block;
width: auto;
float: none;
}
.mod-service-info-01 .detail-top .list-wrap .list li {
margin-left: 10px;
font-size: 11px;
}
.mod-service-info-01 .detail-top .list-wrap .list li:first-child {
margin-left: 0;
}
.mod-service-info-01 .detail-top .list-wrap .list li img {
margin: -2px 5px 0 0;
width: 14px;
height: auto;
}
.mod-service-info-01 .detail-bottom {
margin-top: 10px;
text-align:left;
}
.mod-service-info-01 .detail-bottom .list-info li {
width: 33.3%;
display:inline-block;
vertical-align:middle;
padding:5px;
border-bottom:1px solid #e6e6e6;
}
.mod-service-info-01 .detail-bottom .list-info li span{
display: inline-block;
vertical-align:middle;
line-height:1.8;
}
.mod-service-info-01 .detail-bottom .list-info li img{
width:16px;
height:auto;
}
.mod-service-info-01 .detail-bottom .list-info li:nth-child(3n) {
border-right:none;
}
.mod-service-info-01 .detail-bottom .list-info li:last-child {
border-right:1px solid #e6e6e6;
border-bottom:none;
}
/* mod-service-02
---------------------------------------------------------- */
.mod-service-info-02 {
padding: 10px;
}
.mod-service-info-02 .detail {
display:table;
}
.mod-service-info-02 .detail .headline {
display:table-cell;
padding-right:20px;
}
.mod-service-info-02 .detail .ico-correct-02 {
margin: 1px 6px 0 0;
width: 12px;
height: 12px;
}
.mod-service-info-02 .detail .text {
display: table-cell;
float: none;
margin: 0;
padding-left: 0;
text-align: left;
}
.mod-service-info-02 .detail .button {
top: 70px;
right: 0;
}
/* ttl
---------------------------------------------------------- */
.ttl-train-01 {
font-size: 13px;
margin-bottom: 13px;
}
.ttl-cmn-02 {
margin: 20px 0 10px;
}
.ttl-wrap {
padding:  0 12px;
}
/* link
---------------------------------------------------------- */
.list-cmn-04.s-type-01 {
margin-top: 0;
}
/* mod
---------------------------------------------------------- */
/* mod-form-top
---------------------------------------------------------- */
.mod-form-top {
width: 100%;
margin: 0 auto;
padding: 10px 0 15px;
text-align: left;
}
.mod-form-top  .arrow {
position: relative;
}
.mod-form-top .arrow:after {
position: absolute;
width: 4px;
height: 3px;
top: 8px;
right: 10px;
content: "";
background-image: url(/common/img/btn/btn_select_01_pc.png);
background-repeat: no-repeat;
background-size: 4px 3px;
pointer-events: none;
}
.mod-form-top .detail-wrap-left {
float: none;
width: 100%;
padding: 0 12px;
}
/*detail-top*/

.mod-form-top .detail-top {
padding: 12px 16px;
}
.mod-form-top .detail-top .list {
margin: 0;
}
.mod-form-top .detail-top .list li {
float: none;
width: 100%;
padding: 0;
}
.mod-form-top .detail-top .list li:nth-child(n+2) {
margin-top: 14px;
}
.mod-form-top .detail-top .list li a.link01 {
padding: 13px 27px 13px 23px;
font-size: 12px;
}
.mod-form-top .detail-top .list li a.link01:hover {
text-decoration: none;
}
.mod-form-top .detail-top .list .list01 a.link01 {
background-position: 95% center;
background-size: 5px 8px;
}
.mod-form-top .detail-top .list .list01 a.link01 .ico:before {
top: 2px;
left: -28px;
width: 20px;
height: 11px;
background-size: 20px 11px;
background-repeat: no-repeat;
}
.mod-form-top .detail-top .list .list02 a.link01 {
background-position: 95% center;
background-size: 5px 8px;
}
.mod-form-top .detail-top .list .list02 a.link01 .ico:before {
left: -20px;
width: 10px;
height: 10px;
background-size: 10px;
}
.mod-form-top .detail-top .link02 {
margin-top: 14px;
}
.mod-form-top .detail-top .link02 a {
font-size: 11px;
padding-left: 15px;
background-size: 5px 8px;
background-position: 4px center;
}
/*detail-bottom*/
.mod-form-top .detail-bottom {
padding: 12px 16px;
margin-top: 10px;
width: 100%;
position: static;
}
.mod-form-top .detail-bottom .subtitle {
margin-bottom: 12px;
}

.mod-form-top .list-form-top {
width: 100%;
margin-top: 10px;
}
.mod-form-top .list-form-top li {
width: 100%;
float: none;
}
.mod-form-top .list-form-top li .text {
width: 30%;
min-width: 0;
font-size: 11px;
text-align: center;
padding: 9px 10px;
}
.mod-form-top .list-form-top .input-text-01 {
width: 70%;
color: #424242;
padding: 8px;
font-size: 11px;
}
.mod-form-top .list-form-top .input-text-02 {
width: 70%;
color: #424242;
padding: 8px;
font-size: 11px;
}
.mod-form-top .list-form-top .button {
margin: 7px auto;
}
.mod-form-top .list-form-top .button img {
display: block;
width: 16px;
-ms-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
margin: 10px auto;
}
.mod-form-top .btn-search-01 {
width: 260px;
margin: 10px auto 0;
}
.mod-form-top .btn-search-01 input[type="image"] {
width: 260px;
height: auto;
}
.mod-form-top .detail-wrap-right {
float: none;
width: 100%;
margin-top: 10px;
padding: 0 12px;
}
/*list-calendar*/
.mod-form-top .list-calendar-01 {
text-align: center;
margin-top: 20px;
overflow: hidden;
}
.mod-form-top .list-calendar-01 li {
display: block;
float: left;
}
.mod-form-top .list-calendar-01 li .form-select {
min-width: 49px;
border: 1px solid #dcdcdc;
padding: 4px 5px;
font-size: 11px;
color: #424242;
background-color: #fff;
background-image: url(/common/img/btn/btn_select_01_pc.png);
background-repeat: no-repeat;
background-position:calc(100% - 5px) center;
background-size: 4px 3px;
}
.mod-form-top .list-calendar-01 li:nth-child(2) {
clear: both;
}
.mod-form-top .list-calendar-01 li:nth-child(6) {
clear: both;
}
.mod-form-top .list-calendar-01 li:nth-child(n+6) {
margin-top: 18px;
}
.mod-form-top .list-calendar-01 .time {
margin-right: 0;
margin-bottom: 9px;
display: block;
text-align: left;
}
.mod-form-top .list-calendar-01 li .year {
margin: 0 3px;
}
.mod-form-top .list-calendar-01 li .month {
margin: 0 3px;
}
.mod-form-top .list-calendar-01 li .day {
margin: 0 0 0 3px;
}
.mod-form-top .list-calendar-01 li .hour {
margin: 0 2px 0 0;
}
.mod-form-top .list-calendar-01 li .min {
margin: 0 0 0 3px;
}
.mod-form-top .list-calendar-01 .calendar-wrap {
margin: 3px 0 0 20px;
}
.mod-form-top .list-calendar-01 .calendar-wrap img {
width: 15px;
}
/*list-radio-01*/
.mod-form-top .list-radio-01 {
text-align: left;
margin-top: 18px;
}
.mod-form-top .list-radio-01 li {
margin-left: 21px;
}
.mod-form-top .list-radio-01 li input[type="radio"] + label {
padding-left: 0;
background-size: 11px;
}
/*detail-middle*/
.mod-form-top .detail-middle {
background-color: #f2f2e7;
padding: 12px 16px;
}
.mod-form-top .detail-middle .ttl-train-01 {
position: relative;
padding-left: 6px;
}
.mod-form-top .detail-middle .ttl-train-01:before {
width: 20px;
height: 20px;
margin-right: 5px;
background-position: left center;
background-size: 20px;
}
.mod-form-top .detail-middle.ekiinfo{
margin-top:10px;
}
.mod-form-top .detail-middle .title {
font-size: 12px;
margin: 15px 0 13px;
}
.mod-form-top .detail-middle .input input{
height:32px;
}
.mod-form-top .btn-cmn-02.input-button  {
width: 260px;
background-position:85px center;
}
.mod-form-top .btn-cmn-wrap{
margin-top:20px;
}
.mod-form-top .btn-cmn-wrap span:after{
content: "";
width: 13px;
height: 11px;
display:block;
background:url(/common/img/ico/ico_window_02.svg) no-repeat center center;
background-size:13px 11px;
position:absolute;
top:16px;
right:15px;
z-index:9999;
}
.mod-form-top .detail-middle .list{
margin-top:15px;
}
.mod-form-top .detail-middle .list li{
margin:0 10px 15px 0;
}
.mod-form-top .detail-middle .list li a{
width:100%;
padding: 8px 15px;
}


/* カルーセル
---------------------------------------------------------- */
.mod-carousel-wrap {
margin: 0;
}
/* mod-info-tickets-01
---------------------------------------------------------- */
.mod-info-tickets-01 {
margin-top: 10px;
padding: 0 12px;
}
.mod-info-tickets-01 .mod-info-tickets-in {
margin: 0 auto;
background-color: #f2f2e7;
padding: 12px 16px;
width: 100%;
text-align: center;
}
.mod-info-tickets-01 .item.s-left {
float: none;
width: auto;
overflow: hidden;
margin: 0 -5px;
padding-left: 0;
}
.mod-info-tickets-01 .item.s-right {
float: none;
width: 100%;
overflow: hidden;
margin-top: 20px;
}
.mod-info-tickets-01 .item:first-child {
margin-left: 0;
}
.mod-info-tickets-01 .item .title {
margin-bottom: 16px;
}
.mod-info-tickets-01 .item .title:before {
top: 6px;
left: 5px;
width: 58px;
}
.mod-info-tickets-01 .item .title:after {
width: 58px;
top: 6px;
right: 5px;
}
.mod-info-tickets-01 .item.s-right .title:before {
left: 0;
width: 70px;
}
.mod-info-tickets-01 .item.s-right .title:after {
right: 0;
width: 70px;
}
.mod-info-tickets-01 .item .detail {
width: 50%;
margin-left: 0;
padding: 0 5px;
}
.mod-info-tickets-01 .item .detail .image {
margin-bottom: 15px;
}
.mod-info-tickets-01 .item .detail .image img {
width: 100%;
height: auto;
}
.mod-info-tickets-01 .item .detail .image a {
width: 100%;
display: block;
}
.mod-info-tickets-01 .item .detail .image a {
width: 100%;
display: block;
}
.mod-info-tickets-01 .item .btn-phone-01 {
margin-top: 20px;
}
.mod-info-tickets-01 .item .list li{
margin-bottom:15px;
}
.mod-info-tickets-01 .item .list li a {
padding:2px 0 2px 20px;
background-size:16px 16px;
}
.mod-info-tickets-01 .item .btn-phone-01 a .ico {
padding: 2px 10px;
display: inline-block;
}
.mod-info-tickets-01 .item .btn-phone-01 a .ico:before {
width: 13px;
height: 13px;
margin-right: 2px;
background-size: 13px;
}
.mod-info-tickets-01 .item .btn-phone-01 a {
width: 260px;
margin: 0 auto;
font-size: 12px;
padding: 9px 32px;
background-position: 95% center;
background-size: 5px 8px;
}
/* mod-info-tickets-02
---------------------------------------------------------- */
.mod-info-tickets-02 {
margin-top: 10px;
padding: 0 12px;
}
.mod-info-tickets-02 .mod-info-tickets-in {
padding: 12px 16px;
}
.mod-info-tickets-02 .ruby {
font-size: 11px;
margin-bottom: 13px;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item {
vertical-align: middle;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item.s-left {
float: none;
width: 100%;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item.s-left.s-type-01 {
margin: 10px 0 0 0;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item.s-position {
width: 100%;
top:0;
right: 0;
display:block;
position:relative;
margin-top:10px;
}
.mod-info-tickets-02 .item.s-position .list li span {
margin: 1px 2px 0 0;
display: inline-block;
}
.mod-info-tickets-02 .item.s-position .list li.s-first {
margin: 0 0 7px 0;
display: block;
}
.mod-info-tickets-02 .item.s-position .list li:nth-child(2) {
clear: both;
}
.mod-info-tickets-02 .item.s-position .list li .form-select {
min-width: 49px;
border: 1px solid #dcdcdc;
padding: 4px 5px;
font-size: 11px;
color: #424242;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item-wrap {
margin-bottom: 10px;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item.s-left .easy-select-box{
width:100%;
}
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 {
display: block;
margin: 20px;
}
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 a {
width: 121px;
display: block;
margin: 0 auto;
border: 1px solid #000;
padding: 10px 17px 10px 12px;
background-image: url("/common/img/ico/ico_button_plus_02.png");
background-position: 94% center;
background-repeat: no-repeat;
line-height: 1.2;
}
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 a.is-active {
background-image: url("/common/img/ico/ico_button_minus_02.png");
}
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 a:hover,
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 a:active,
.mod-info-tickets-02 .mod-form-tickets-01 .btn-more-01 a:focus {
text-decoration: none;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item .select-wrap{
display:block;
width:100%;
}
.mod-info-tickets-02 .mod-form-tickets-01 .esb-displayer {
width:100%;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item .text {
width: 100%;
padding: 0;
vertical-align: middle;
height: 35px;
line-height: 35px;
display:block;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item .text.s-type-01 {
margin: 0;
width: 29.5%; /*android 4.3*/
width: calc(((100% - 6px) / 10) * 3);
line-height: 35px;
padding: 0;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item .text.s-type-02 {
vertical-align: middle;
height: 35px;
line-height: 35px;
padding: 0;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item .selectStyle:not(#freeWord){
border: 1px solid #dcdcdc;
padding: 4px 8px;
font-size: 11px;
color: #424242;
background-color: #fff;
background-image: url(/common/img/btn/btn_select_01_pc.png);
background-repeat: no-repeat;
background-position:calc(100% - 10px) center;
background-size: 4px 3px;
min-height:35px;
}
.mod-info-tickets-02 .mod-form-tickets-01 .item .selectStyle:not(.s-type-01){
width:100%;
}
.mod-info-tickets-02 .mod-form-tickets-01 .form-select.s-type-01 {
background-position:calc(100% - 5px) center;
}
.mod-info-tickets-02 .mod-form-tickets-01 .form-text {
width: 100%;
border: 1px solid #dcdcdc;
padding: 8px;
color: #9e9e9e;
height: 35px;
}
.mod-info-tickets-02 .mod-form-tickets-01 input[type="checkbox"] {
display: none;
}
.mod-info-tickets-02 .mod-form-tickets-01 input[type="checkbox"] + label {
margin-left: 7px;
padding-left: 20px;
background-image: url(/common/img/btn/btn_input_checkbox_01_no.png);
background-repeat: no-repeat;
background-size: 14px;
background-position: left center;
}
.mod-info-tickets-02 .mod-form-tickets-01 input[type="checkbox"]:checked + label {
background-image: url(/common/img/btn/btn_input_checkbox_01_on.png);
}
.mod-info-tickets-02 .mod-form-tickets-01 .select-wrap{
margin-top:10px;
}
.mod-info-tickets-02 .mod-form-tickets-01 .form-check {
margin-left: 10px;
}
.mod-info-tickets-02 .mod-form-tickets-01 .arrow {
position: relative;
}
.mod-info-tickets-02 .mod-form-tickets-01 .arrow:after {
width: 4px;
height: 3px;
background-size: 4px 3px;
}
.mod-info-tickets-02 .list-ticket-type {
overflow: hidden;
}
.mod-info-tickets-02 .list-ticket-type .title {
padding: 10px 9px;
}
.mod-info-tickets-02 .list-ticket-type .list {
margin: 20px 0;
overflow: hidden;
}
.mod-info-tickets-02 .list-ticket-type .list li {
float: left;
width: 33.3%;
}
.mod-info-tickets-02 .list-ticket-type .list li:nth-child(3n) {
width: 33.4%;
}
.mod-info-tickets-02 .list-ticket-type .list li:nth-child(n+4) {
margin-top: 15px;
}
.mod-info-tickets-02 .list-ticket-type .list li:nth-child(n+7) {
width: 100%;
}
.mod-info-tickets-02 .list-ticket-type .list li.col01 {
margin-left: 0;
}
.mod-info-tickets-02 .list-ticket-type .list li.col02 {
margin-left: 0;
}
.mod-info-tickets-02 .list-ticket-type .list li.col03 {
margin-left: 0;
}
.mod-info-tickets-02 .btn-search-01 {
margin: -5px auto 0;
}
.easy-select-box.easy-select-10{
width:100%;
}


/* mod-info-tickets-03
---------------------------------------------------------- */
.mod-info-tickets-03 {
margin-top: 10px;
padding: 0 12px;
}
.mod-info-tickets-03 .item {
float: none;
width: 100%;
margin-left: 0;
}
.mod-info-tickets-03 .item a {
padding: 12px 30px 12px 16px;
background-image: url(/common/img/ico/ico_arrow_right_01.svg);
background-repeat: no-repeat;
background-size: 7px 13px;
background-position: 96% center;
}
.mod-info-tickets-03 .item:first-child {
margin-bottom: 10px;
}
.mod-info-tickets-03 .item .title {
font-size: 13px;
padding-left: 0;
background-image: none;
}
.mod-info-tickets-03 .item .text {
font-size: 11px;
line-height: 1.7;
}
/* mod-info-train-find
---------------------------------------------------------- */
.mod-info-train-find{
margin-top:20px;
padding:0 12px;
}
.mod-info-train-find section{
background-color: #f2f2e7;
padding: 12px 16px;
position:relative;
}
.mod-info-train-find .item .list li{
display:inline-block;
widht: -webkit-calc((100% - 30px) / 2);
width: calc((100% - 30px) / 2);
margin-bottom:15px;
padding-right:10px;
}
.mod-info-train-find .item .list li a{
background-position: 0 0;
}
.mod-info-train-find .button{
width:260px;
position:relative;
top:auto;
right:auto;
margin:0 auto;
}
.mod-info-train-find .button.btn01{
top:auto;
margin-bottom:10px;
}
.mod-info-train-find .button.btn02{
bottom:auto;
}
/*--------------------------------------------------*/
/*カレンダー*/
/*--------------------------------------------------*/
#ui-datepicker-div {
left: 0 !important;
}
.ui-datepicker {
width: 17em;
background-color: #fff;
border: 1px solid #999;
box-shadow: none;
padding: 40px 20px 10px;
display: none;
}
.ui-datepicker .ui-datepicker-header {
position: relative;
padding: .2em 0;
background-color: #ff4960;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
position: absolute;
height: 1.8em;
/* display:none; */
}
.ui-datepicker .ui-datepicker-prev {
width: 10em;
text-align: left;
left: 2px;
bottom: -35px;
}
.ui-datepicker .ui-datepicker-next {
width: 10em;
text-align: right;
right: 2px;
bottom: -35px;
}
.ui-datepicker .ui-datepicker-prev.ui-state-disabled,
.ui-datepicker .ui-datepicker-next.ui-state-disabled {
color: #999999;
text-decoration: none;
}
/*
.ui-datepicker .ui-datepicker-prev-hover {
left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
right: 1px;
}
*/
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
/*
display: block;
position: absolute;
left: 50%;
margin-left: -8px;
top: 50%;
margin-top: -8px;
*/
cursor: pointer;
}
.ui-datepicker .ui-datepicker-prev.ui-state-disabled span,
.ui-datepicker .ui-datepicker-next.ui-state-disabled span {
cursor: default;
}
.ui-datepicker .ui-datepicker-title {
margin: 0 2.3em;
color: #fff;
font-weight: bold;
line-height: 1.8em;
text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
font-size: 1em;
margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
width: 49%;
}

.ui-datepicker .ui-datepicker-buttonpane {
background-image: none;
/* margin: 20px 0 0 0; */
margin: 0;
padding: 0;
position: absolute;
top: 10px;
right: 20px;
}
.ui-datepicker .ui-datepicker-buttonpane button {
/* float: right; */
width: 10px;
height: 10px;
background-size: 10px;
}
.ui-datepicker .ui-datepicker-buttonpane button span {
display: none;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
float: left;
display: none;
}
/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
/* width: auto; */
width: 100%;
}
.ui-datepicker-multi .ui-datepicker-group {
width: 100%;
margin: 0 0 10px 0;
float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
width: 95%;
margin: 0 auto .4em;
}

.ui-datepicker-multi-2 .ui-datepicker-group {
/* width: 50%; */
width: 238px;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last {
margin-right: 0;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
clear: left;
}
.ui-datepicker-row-break {
clear: both;
width: 100%;
font-size: 0;
}
/* RTL support */
.ui-datepicker-rtl {
direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
right: 2px;
left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
left: 2px;
right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
right: 1px;
left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
left: 1px;
right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
border-right-width: 0;
border-left-width: 1px;
}
.ui-datepicker-trigger {
cursor: pointer;
}
.calendarNote {
padding: 0 20px;
margin-top: 1.5em;
}
.calendarNote p {
margin: 0;
font-size: 84.62%;
text-align: right;
}
/* js用css
---------------------------------------------------------- */
.area-read-infomation {
display: none;
}
.js-form-checks {
display: none;
}
}

/* 旅行の窓口ボタン
---------------------------------------------------------- */
.ryoko-link-btn{
  margin-top: 18px;
}
.ryoko-link-btn .link{
  display: block;
  width: 100%;
  padding: 10px 27px 10px 43px;
  font-weight: bold;
  text-align: center;
  border: 2px solid #000;
  font-size: 106.667%;
  background-color: #fff;
  background-image: url(/common/img/ico/ico_arrow_right_01.svg);
  background-repeat: no-repeat;
  background-position: 96% center;
  background-size: 8px 12px;
}
.ryoko-link-btn .link .ico{
  display: inline-block;
  position: relative;
  text-align: left;
}
.ryoko-link-btn .link .ico::before{
  display: inline-block;
  content: "";
  position: absolute;
  top: 50%;
  left: -46px;
  transform: translateY(-50%);
  width: 36px;
  height: 24px;
  background-image: url(/railway/img/ico_ryoko_01.svg);
  background-repeat: no-repeat;
  background-size: 100% auto;
}

@media screen and (max-width: 767px){
  .ryoko-link-btn{
    margin-top: 10px;
  }
  .ryoko-link-btn .link{
    padding: 13px 27px 13px 23px;
    font-size: 12px;
    background-position: 95% center;
    background-size: 5px 8px;
  }
  .ryoko-link-btn .link .ico::before{
    left: -38px;
    width: 26px;
    height: 17px;
  }
}