@charset "UTF-8";
/* -----------------------------------------------------------
CSS Information

File name:      top.css
Created:        2018-12-28
Style Info:     鉄道の旅　CSS
----------------------------------------------------------- */


/* -------------------------------------------------------- */
/* Visual */
/* -------------------------------------------------------- */
.rail-europe .bl_page_visual.dis_pc {background:#f6f4ee url(../img/top/header_bg_01.jpg) bottom center no-repeat; position:relative; width: 100%; height: 480px;}
.rail-europe .page_visual {max-width: 1140px; width: 100%; height: 480px; margin: 0 auto; }
.rail-europe .page_visual h1 {width: 340px;}
.rail-europe .page_lead {background: #aa8a45; padding: 25px 0; line-height: 160%;}
.rail-europe .page_lead p {color: #fff;}

@media (max-width:1030px) {
  .rail-europe .bl_page_visual.dis_pc {display: block;}
  .rail-europe .bl_page_visual.dis_sp {display: none;}
}

@media (max-width:640px) {
  .rail-europe .bl_page_visual.dis_pc {display: none;}
  .rail-europe .bl_page_visual.dis_sp {display: block; height: auto;}
  .rail-europe .bl_page_visual .page_visual_bg {position:relative; width: 100%; height: auto; margin-bottom: 10px;}
  .rail-europe .bl_page_visual .page_visual_bg .bx-wrapper {box-shadow: none; background: none; width: 950px; margin: 0 auto; border: none;}
  .rail-europe .bl_page_visual .page_visual {padding-bottom: 20px; height: auto;}
  .rail-europe .bl_page_visual .page_visual h1 {width: 53.125vw; margin: 0 auto;}
  
  .rail-europe .bl_page_visual .page_visual_bg .vegas-slide {background-size: 100%; }
  
  
}



.rail-europe #bl_route { padding-bottom: 80px;}
.rail-europe #bl_route .tit_ty_01 {margin-bottom: 40px;}
.rail-europe #bl_route .route_slider { margin-bottom: 70px;}


.rail-europe #bl_route .route_slider .route_box {width: 29%;}
.rail-europe #bl_route .route_slider .route_box .bl_tit {position: relative;}
.rail-europe #bl_route .route_slider .route_box .bl_tit .tit ,
.rail-europe #bl_route .route_slider .route_box .bl_tit .bl_link {position: absolute;}
.rail-europe #bl_route .route_slider .route_box .bl_tit .tit {top: 20%; left: 3.4%; font-size: 24px; color: #fff; font-weight: bold;}
.rail-europe #bl_route .route_slider .route_box .bl_tit .bl_link {bottom: 0; left: 0;width: 100%; height: 15%; background: rgba(0,0,0,0.60);}
.rail-europe #bl_route .route_slider .route_box .bl_tit  { display: block; width: 100%; height: 100%;  text-align: center; position: relative;}
.rail-europe #bl_route .route_slider .route_box .bl_tit .bl_link:after {content:"\f105"; font-family:FontAwesome; font-weight: bold;  position: absolute; right: 20px; top: 50%; transform: translate(0,-50%); color: #fff; font-size: 20px; font-weight: bold;}
.rail-europe #bl_route .route_slider .route_box .bl_tit a span {color: #fff; font-weight: bold; text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); display: block; width: 100%; }
.rail-europe #bl_route .route_slider .route_box p.txt_01 {padding: 20px 0;}
.rail-europe #bl_route .route_slider .route_box .city_list dt {font-size: 12px; font-weight: normal; margin-bottom: 10px;}
.rail-europe #bl_route .route_slider .route_box .city_list dd {background: #fa625a; color: #fff; font-size: 12px; float: left; display: inline; padding: 0 5px; margin:0 10px 5px 0; }

.rail-europe #bl_route .route_slider .route_box.route_02 .city_list dd {background: #ffba00;}
.rail-europe #bl_route .route_slider .route_box.route_03 .city_list dd {background: #d096e6;}
.rail-europe #bl_route .route_slider .route_box.route_04 .city_list dd {background: #ff77aa;}
.rail-europe #bl_route .route_slider .route_box.route_05 .city_list dd {background: #58c73d;}
.rail-europe #bl_route .route_slider .route_box.route_06 .city_list dd {background: #c3b071;}
.rail-europe #bl_route .route_slider .route_box.route_07 .city_list dd {background: #64bef0;}

.rail-europe #bl_route .bx-wrapper {box-shadow: none; background: none; width: 950px; margin: 0 auto; border: none;}
.rail-europe #bl_route .bx-wrapper .bx-controls-direction a { width: 50px; height: 50px; top:28%; margin-top: 0; background-size: 100%;}
.rail-europe #bl_route .bx-wrapper .bx-prev { left: -70px; background: url(../img/top/slider_pre.png) top center no-repeat;}
.rail-europe #bl_route .bx-wrapper .bx-next { right: -70px; background: url(../img/top/slider_next.png) top center no-repeat;}

.rail-europe #bl_route .bl_route_map {width: 100%;; position: relative;}
.rail-europe #bl_route .bl_route_map .route_link {width: 11.2%; position: absolute;}

.rail-europe #bl_route .bl_route_map .route_link_01 {top: 77% ; left: 51%;}
.rail-europe #bl_route .bl_route_map .route_link_02 {top: 84% ; left: 34.5%;}
.rail-europe #bl_route .bl_route_map .route_link_03 {top: 51% ; left: 41%;}
.rail-europe #bl_route .bl_route_map .route_link_04 {top: 52% ; left: 25%;}
.rail-europe #bl_route .bl_route_map .route_link_05 {top: 37% ; left: 22%;}
.rail-europe #bl_route .bl_route_map .route_link_06 {top: 54% ; left: 77.5%;}
.rail-europe #bl_route .bl_route_map .route_link_07 {top: 16% ; left: 70%;}


@media (max-width:1030px) {
  .rail-europe #bl_route.bl_wrap {padding: 50px 0;}
  .rail-europe #bl_route .tit_ty_01 {margin-bottom: 0;}
  .rail-europe #bl_route .bx-wrapper {width: 620px;}
  .rail-europe #bl_route .bl_route_map {margin-bottom: 50px;}
  .rail-europe #bl_route .route_slider .route_box .bl_tit .tit {font-size: 18px;}
  
  .rail-europe #bl_route .bl_route_map .route_link {width: 95px; }

  .rail-europe #bl_route .bl_route_map .route_link_01 {top: 78.67647059% ; left: 48.4375%;}
  .rail-europe #bl_route .bl_route_map .route_link_02 {top:84.85294118% ; left: 26.5625%;}
  .rail-europe #bl_route .bl_route_map .route_link_03 {top:53.52941176% ; left: 35.9375%;}
  .rail-europe #bl_route .bl_route_map .route_link_04 {top:53.82352941% ; left: 14.375%;}
  .rail-europe #bl_route .bl_route_map .route_link_05 {top:38.82352941% ; left: 9.375%;}
  .rail-europe #bl_route .bl_route_map .route_link_06 {top:55.14705882% ; left: 83.59375%;}
  .rail-europe #bl_route .bl_route_map .route_link_07 {top:18.08823529% ; left: 73.4375%;}


  
}

@media (max-width:640px) {
  .rail-europe #bl_route .bl_route_map {width: calc(100% + 30px); margin-left: -15px;}
  .rail-europe #bl_route .route_slider { margin-bottom: 0;}
  .rail-europe #bl_route .bx-wrapper {width: 71.875vw;}
  .rail-europe #bl_route .bx-wrapper .bx-controls-direction a { width: 9.375vw; height: 18.75vw; }
  .rail-europe #bl_route .bx-wrapper .bx-prev { left: -14.0625vw; background: url(../img/top/slider_pre_sp.png) top center no-repeat;}
  .rail-europe #bl_route .bx-wrapper .bx-next { right: -14.0625vw; background: url(../img/top/slider_next_sp.png) top center no-repeat;}
  .rail-europe #bl_route .route_slider .route_box .bl_tit .tit {font-size: 5.9375vw;}
  .rail-europe #bl_route .bl_route_map .route_link {width: 14.84375vw; }


}


.rail-europe #bl_tour.bl_wrap {padding: 60px 0 100px;}
.rail-europe #bl_tour .tit_ty_01 {margin-bottom: 0;}
.rail-europe #bl_tour .content_box {padding: 50px 0 40px; border-bottom: solid 1px #c8bdb2;}
.rail-europe #bl_tour .content_box.bl_tour_03 {border-bottom: none;}

.rail-europe #bl_tour .bl_note {width: 54%;}
.rail-europe #bl_tour .bl_pic {width: 41%;}

.rail-europe #bl_tour .bl_tour_02 p {margin-bottom: 25px;}
.rail-europe #bl_tour .bl_tour_02 p:last-child {margin-bottom: 0;}
.rail-europe #bl_tour .bl_bord_bg {background: url(../img/top/bl_tour_bord_bg.png) top center repeat-y; background-size: 100%; margin-bottom: 25px;}
.rail-europe #bl_tour .bl_bord {width: 48.5%; padding: 20px;}
.rail-europe #bl_tour .bl_bord  li {list-style-type: decimal ; margin-left: 20px; font-size: 15px; margin-bottom: 10px;}

@media (max-width:640px) {
  .rail-europe #bl_tour.bl_wrap {padding: 60px 0 50px;}
  .rail-europe #bl_tour .bl_note ,
  .rail-europe #bl_tour .bl_pic {width: 100%;}
  .rail-europe #bl_tour .bl_note {margin-bottom: 20px;}
  .rail-europe #bl_tour .bl_bord_bg {background: none;}
  .rail-europe #bl_tour .bl_bord {width: 100%; background: #f6f4ee; margin-bottom: 10px;}
}



.rail-europe #bl_city.bl_wrap {padding-bottom: 50px;}
.rail-europe #bl_city .tit_ty_01 {margin-bottom: 40px;}
.rail-europe #bl_city ul li {float: left; width: 22%; margin-right: 4%; text-align: center; margin-bottom: 25px;}
.rail-europe #bl_city ul li:nth-child(4n) {margin-right: 0;}
.rail-europe #bl_city ul li a {text-decoration: none; font-size: 24px; font-weight: bold; color: #000;}
.rail-europe #bl_city ul li a img {margin-bottom: 20px;}

@media (max-width:1030px) {
  .rail-europe #bl_city ul li a {font-size: 20px;}
}


@media (max-width:640px) {
  .rail-europe #bl_city .tit_ty_01 {margin-bottom: 20px;}
  .rail-europe #bl_city ul li {width: calc((100% - 40px) / 3 ); margin-right: 20px; text-align: center; margin-bottom: 15px;}
  .rail-europe #bl_city ul li:nth-child(4n) {margin-right: 20px;}
  .rail-europe #bl_city ul li:nth-child(3n) {margin-right: 0;}
  .rail-europe #bl_city ul li a {font-size: 3.4375vw;}
  .rail-europe #bl_city ul li a img {margin-bottom: 10px;}

}

.rail-europe #bl_train.bl_wrap {padding-bottom: 50px;}
.rail-europe #bl_train .tit_ty_01 {margin-bottom: 40px;}
.rail-europe #bl_train ul li {float: left; width: 30.6%; margin-right: 4.1%; text-align: center; margin-bottom: 25px; margin-bottom: 30px;}
.rail-europe #bl_train ul li:nth-child(3n) {margin-right: 0;}
.rail-europe #bl_train ul li p {text-align: left; padding-top: 10px;}
.rail-europe #bl_train ul li a {text-decoration: none; margin-bottom: 15px;}
.rail-europe #bl_train ul li a .link_box {width: 100%; height: 55px; background: rgba(0,0,0,0.60); display: block; color: #fff; font-weight: bold; position: relative;  margin-top: -55px;}
.rail-europe #bl_train ul li a .link_box:after {content: "\f054";font-family:FontAwesome;  transform: rotate(10deg); position: absolute; right: 20px; top: 50%; transform: translate(0,-50%);}
.rail-europe #bl_train ul li a .link_box .link_txt {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); display: block; width: 100%; padding: 0 30px;}

@media (max-width:1030px) {
  .rail-europe #bl_train ul li {float: left; width: calc((100% - 20px) / 2); margin-right: 20px; }
  .rail-europe #bl_train ul li:nth-child(3n) {margin-right: 20px;}
  .rail-europe #bl_train ul li:nth-child(2n) {margin-right: 0;}
  .rail-europe #bl_train ul li a .link_box:after {right: 10px;}
  .rail-europe #bl_train ul li a .link_box .link_txt {padding: 0 15px; line-height: 120%;}
  
}

@media (max-width:640px) {
  .rail-europe #bl_train .tit_ty_01 {margin-bottom: 20px;}
  .rail-europe #bl_train.bl_wrap {padding-bottom: 30px;}
  .rail-europe #bl_train ul li a .link_box:after {font-size: 10px; right: 5px;}
  .rail-europe #bl_train ul li a .link_box {height: 40px; margin-top: -40px;}
  .rail-europe #bl_train ul li a .link_box .link_txt {font-size:3.4375vw;}

}