@charset "utf-8";
body {
  color: #272726;
  font-size: 14px;
}
article {
  color: #333;
}
h2 {
  position: relative;
  font-size: 22px;
  font-weight: 700;
  text-align: center;
}
h3 {
  font-size: 16px;
  font-weight: 700;
}
.text {
  text-align: center;
  margin-top: 50px;
}
.container_hero {
  width: 100%;
  margin: 0 auto;
  max-width: 1300px;
}
#about, #recommend, #booking, #infomation {
  margin-top: 60px;
}
#point, #route, #ticket, #attention {
  padding: 80px 0;
}
#requirement, #stop {
  background: #F1F8F9;
  padding: 60px 0;
  margin: 60px 0 0;
}
.block {
  text-align: center;
}
.block h3 {
  margin-top: 30px;
}
.block p {
  margin-top: 10px;
  font-size: 14px;
}
.bg_gray {
  background: #F2F2F2;
}
#requirement p {
  font-size: 16px;
  text-align: center;
}
#requirement ul {
  margin: 35px auto 0;
  position: relative;
  max-width: 555px;
  width: 100%;
}
#requirement ul li {
  margin-top: 10px;
  padding-left: 1.25rem;
}
#requirement ul li::before {
  font-family: "Font Awesome 5 Free";
  position: absolute;
  content: "\f058";
  font-weight: 900;
  left: 0;
}
.step {
  margin-top: 20px;
}
.step img {
  margin: 0 auto;
  width: 80%;
}
.step dl dt {
  text-align: center;
}
.step dl dt h3 {
  font-size: 16px;
  margin: 20px 0 0 0;
  color: #5ECDE9;
  font-weight: 700;
  vertical-align: middle;
}
.step dl dt p {
  font-size: 14px;
  color: #FFF;
  background: #5ECDE9;
  padding: 5px;
  margin-right: 10px;
  width: 35%;
  text-align: center;
  margin: 0 auto;
}
.step dl dd {
  text-align: center;
  padding-left: 70px;
  min-height: 60px;
}
.step dl dd, .step dl .text p {
  font-size: 14px;
}
.step dl .text {
  margin-top: 20px;
  text-align: left;
  padding-top: 10px;
}
.step dl .no-1 {
  background: no-repeat url("/static/img/guide/participate/non-reserved/no-1.png") left;
}
.step dl .no-2 {
  background: no-repeat url("/static/img/guide/participate/non-reserved/no-2.png") left;
}
.step dl .no-3 {
  background: no-repeat url("/static/img/guide/participate/non-reserved/no-3.png") left;
}
.step dl .no-4 {
  background: no-repeat url("/static/img/guide/participate/non-reserved/no-4.png") left;
}
.step dl .text ul {
  text-align: left;
  margin-left: 60px;
}
.ic-arrow img {
  margin-top: 200px;
  width: 60%;
}
ul.pege-menu {
  display: table;
  table-layout: fixed;
  width: 100%;
  border-collapse: separate; /* セルの間隔を空ける */
  border-spacing: 5px 0; /* 左右 上下で記述 */
}
ul.pege-menu li {
  display: table-cell;
  margin-right: 4px;
}
ul.pege-menu li a {
  display: block;
  padding: 10px 10px 0;
  color: #000;
  background: #F4C23A;
  border: solid #000 3px;
  font-weight: bold;
  text-align: center;
  font-size: 18px;
}
ul.pege-menu li a:hover {
  text-decoration: none;
}
.border-yellow {
  text-decoration: underline solid #F4C23A 4px
}
.bg-bus {
  background: no-repeat url("/static/img/guide/participate/non-reserved/pc_bus.png") center;
  height: 100px;
  margin-top: 60px;
}
.bg-bus p {
  text-align: center;
  font-weight: bold;
}
#point {
  background: #F2F2F2;
}
.tit-point {
  text-align: center;
  margin-bottom: 40px;
}
.tit-point img {
  margin: 0 auto;
}
.point-box {
  position: relative;
  margin-top: 20px;
  padding: 80px 10px 10px;
  border: 2px solid #000;
  border-radius: 6px;
  background: #FFF;
}
.mr-10 {
  margin-right: 10px !important;
}
.ml-10 {
  margin-left: 10px !important;
}
.mr-5 {
  margin-right: 5px !important;
}
.ml-5 {
  margin-left: 5px !important;
}
.point-box p {
  text-align: center;
}
.point-box .point-img {
  position: absolute;
  top: -50px;
  left: 50%;
  text-align: center;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}
.point-box .point-img img {
  width: 100px;
}

.point-box strong{
	font-size: 15px;
}
.point-box span{
	font-size: 12px;
}
#route ul.list-rosenlink {
  width: 85%;
  margin: 0 auto 30px;
  border-collapse: separate;
  border-spacing: 20px 0;
}
#route ul.list-rosenlink li {
  display: block;
  float: left;
  width: 33.333%;
  font-size: 1.1em;
	text-align: center;
  padding: 6px;
}
#route ul.list-rosenlink li a {
    border: 1px solid #999;
    padding: 10px 24px 10px 12px;
    border-radius: 8px;
	display: block;
	color: #333;
	position: relative;
	}
#route ul.list-rosenlink li a i{
	color:#F4C23A;
	position: absolute;
    top: 50%;
    right: 4px;
    width: 13px;
    transform: translateY(-50%);
}



#route ul.list-rosenlink li a:hover{
	text-decoration: none;
	background:#FDF7E6;
}
.btn-search {
  background: #69A06E;
  padding: 20px;
  border-radius: 8px;
  width: 400px;
  text-align: center;
  margin: 50px auto 0;
}
.btn-search a {
  display: block;
  color: #FFF;
  font-weight: bold;
}
.btn-search a span {
  font-weight: normal;
}
.btn-search a:hover {
  text-decoration: none;
}
.tit-route{
  padding-bottom: 55px;
}
 .tit-attention, .tit-ticket {
  padding-bottom: 70px;
}
.tit-ticket {
  background: no-repeat url("/static/img/guide/participate/non-reserved/tit_ticket.png");
  background-position: 45% bottom;
}
.tit-route {
  background: no-repeat url("/static/img/guide/participate/non-reserved/tit_route.png");
  background-position: 47% bottom;
  margin-bottom: 20px;
}
.tit-attention {
  background: no-repeat url("/static/img/guide/participate/non-reserved/tit_attention.png");
  background-position: 45% bottom;
}
#attention {
  background: repeat-x url("/static/img/guide/participate/non-reserved/pc_footer.png") bottom;
  padding-bottom: 280px
}
.list {
  width: 60%;
  line-height: 2em;
  margin: 0 auto;
}
.list li {
  list-style: disc;
}


@media screen and (max-width: 767px) {
  #about, #recommend {
    margin-top: 40px;
  }
  #point, #route, #ticket, #attention {
    padding: 40px 0;
  }
  h2 {
    font-size: 18px;
  }
  #about .inner, #recommend .block {
    margin-top: 50px;
  }
  #about .inner h3, #recommend .block h3 {
    text-align: left;
  }
  #about .block {
    background: #F1F8F9;
    margin: 90px 0 0;
  }
  #about .block .bg_img::before {
    width: 315px;
    height: 60px;
    top: -100px;
  }
  .bg-bus {
    background: no-repeat url("/static/img/guide/participate/non-reserved/sp_bus.png") bottom;
    background-size: 75%;
    padding-bottom: 100px;
    height: auto;
    margin-top: 30px;
  }

.tit-point img {
	width: 90%;
}
  ul.pege-menu {
    border-spacing: 2px 0;
  }
  ul.pege-menu li a {
    font-size: 14px;
    padding: 10px 4px 0;
  }
  .point-box {
    margin-bottom: 40px;
  }
  .icon img {
    width: 7%;
  }
  .step dl dd {
    padding-left: 50px;
  }
  .step dl .no-1, .step dl .no-2, .step dl .no-3, .step dl .no-4 {
    background-size: 40px;
  }
  #booking, #infomation {
    margin-top: 40px;
  }
  .text {
    margin-top: 30px;
  }
  #booking .step:first-of-type {
    margin-top: 30px;
  }
  .step dl .text, .step dl .text p {
    text-align: left;
    line-height: 1.6em;
  }
  .step dl .text ul {
    margin-left: 0;
  }
  #route ul.list-rosenlink {
    display: block;
    width: 100%;
    margin: 0 auto;
  }
  #route ul.list-rosenlink li {
    display: block;
    width: 100%;
    margin-bottom: 20px;
    padding: 0;
  }
	#route ul.list-rosenlink li a{
		font-size: 1.1em;
	}
  .ic-arrow img {
    margin-top: 0;
    width: 30%;
  }
  .btn-search {
    width: 100%;
    margin-top: 30px;
  }
  .list {
    width: 90%;
  }
  #attention {
    background: repeat-x url("/static/img/guide/participate/non-reserved/sp_footer.png") bottom;
    background-size: 75%;
    padding-bottom: 150px
  }
}
@media screen and (max-width: 375px) {
  .tit-route, .tit-ticket {
    padding-bottom: 55px;
    background-size: 98%;
  }
.tit-attention {
    padding-bottom: 60px;
    background-size: 98%;
  }
}



#route h3{
  text-align: center;
  margin-bottom: 12px;
  font-size: 20px;
}

.btn-arealink{
  width: 85%;
  margin: 0 auto 60px;
}
.btn-secondary{
  position: relative;
  padding-bottom: 20px;
  font-size: 18px;
  background: #F4C23A;
  color: #272726;
  border: solid 3px #000;
  font-weight: bold;
  width: 50%;
  border-radius: 0;
  margin: 0 1%;
}
.btn-secondary:hover{
  background: #FDF7E6;
  color: #272726;
}
.btn-secondary:after {
  content: "\f107";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  bottom: 5px;
  left: 50%;
  transform: translate(-50%, 0);
}
.btn-group>.btn:first-child{
  margin-left: 1%;
}
@media screen and (max-width: 767px) {
.btn-arealink.d-flex{
  width: 100%;
  margin: -20px auto 40px;
  flex-wrap : wrap;
}
.btn-secondary{
  width: 48%;
  margin: 0.5% 1%;
  font-size: 14px;
}
.btn-group>.btn:first-child{
  margin-left: 0;
}
}

/*--20220527---*/
.modal_button{
  cursor: pointer;
}
.modal-body{
  padding: 0px 16px 32px;
}
.modal-body h4{
  margin-top: 32px;
  background: #f5f5f5;
  padding: 8px 8px;
  font-size: 16px;
  font-weight: bold;
}
.modal-body ul{
  padding-left: 0.5em;
}
.modal-body ul li{
  position: relative;
  padding: 8px 0 0 1em;
  margin-bottom: 1.5em;
}
.modal-body ul li:before{
  content: '・';
  position: absolute;
  left: 0;
}
.modal-body ul li:after{
  content: '';
  clear: both;
  display: block;
  width: 100%;
  height: 0px;
}
.modal-body .ticket{
  display: block;
  margin-bottom: 0.5em;
  font-weight: bold;
}
.modal-body .price{
  padding: 8px 16px;
  font-weight: bold;
  font-size: 16px;
  color: #f53c7f;
  display: block;
  text-align: right;
}
.modal-body .price .num{
  font-size: 22px;
  margin-right: 0.5em;
}
.modal-body .buy{
  text-align: center;
  padding: 8px 16px;
  background: #F4C23A;
  color: #272726;
  border: solid 2px #000;
  border-radius: 4px;
  font-size: 18px;
  font-weight: bold;
}
.modal-body p.text-center{
  font-size: 13px;
  border: 1px solid #ccc;
  padding: 16px;
}
.modal-body p.text-center a{
  display: inline-block;
  text-decoration: underline;
}


/*20220914追記*/
#route_acc .card{
  border: none;
}
#route_acc .card-header{
  background: #282828;
  border: none;
  border-radius: 0px;
  padding: 0;
}
#route_acc .card-header h3{
  margin-bottom: 0;
  padding: 0;
}
#route_acc .card-header h3 span{
  color: #fff;
  font-size: 18px;
  padding: 16px;
  display: block;
  position: relative;
  cursor: pointer;
}
#route_acc .card-header h3 span:after{
  content:"\f107";
  font-family:"Font Awesome 5 Free";
  font-weight:900;
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%) rotate(0deg);
}
#route_acc .card-header h3 span:not(.collapsed):after{
  transform: translateY(-50%) rotate(180deg);
}
#route_acc .card-header h3 span:hover,
#route_acc .card-header h3 span:active{
  text-decoration: none;
}
#route_acc .card-body{
  padding: 24px 16px;
}
.route_list{
  border: 2px solid transparent;
  padding: 8px 6px 0px;
}
.airport_route_list{
  border: 2px solid #1c1c1c;
}
#route_acc .list_ttl{
  font-size: 18px;
  font-weight: bold;
  padding: 16px;
  border: 2px solid #1c1c1c;
  background: #F4C23A;
}


.route_list li{
  margin-top: 16px;
  padding: 0 16px 16px;
}
.route_list li:not(:last-of-type){
  border-bottom: 1px solid #707070;
}

.route_list li.ln-top{
	border-top: 1px solid #707070!important;
	margin-top:0;
	padding-top: 16px;
}

.route_list li > .d-flex{
  flex-direction: column;
}
.route_list li > p .bg_grey{
  background: #DCDCDC;
  font-size: 16px;
  font-weight: bold;
  display: inline-block;
  padding: 8px;
}
.route_list li .cpn_detail:hover{
  text-decoration: none;
}
.route_list li .cpn_detail span{
  color: #0461DC;
  text-decoration: underline;
}
.route_list li .cpn_detail i{
  display: inline-block;
  width: 17px;
  height: 17px;
  border-radius: 2px;
  border: 1px solid #0461DC;
  background: #fff;
  position: relative;
  top: 2px;
  z-index: 2;
}
.route_list li .cpn_detail i:before{
  content: '';
  width: 17px;
  height: 17px;
  border-radius: 2px;
  border: 1px solid #0461DC;
  background: #fff;
  position: absolute;
  bottom: 4px;
  left: 4px;
  z-index: -1;
}
.route_list .r_ttl{
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 8px;
}
.route_list .r_ttl.smaller{
  font-size: 16px;
}
.route_list .r_ttl + .d-flex{
  flex-wrap: wrap;
}
.route_list .price{
  width: 100%;
  text-align: right;
  margin-bottom: 8px;
}
.price .tx_red{
  color: #E00909;
  font-size: 24px;
  font-weight: bold;
}
.route_list .cta{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 12px;
  background: #69A06E;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  position: relative;
  transition: 0.24s ease;
  transition-property: background;
}
.route_list .cta:first-of-type{
  margin-bottom: 8px;
}
.route_list .cta:after{
  content:"\f107";
  font-family:"Font Awesome 5 Free";
  font-weight:900;
  position: absolute;
  right: 7px;
  top: 50%;
  transform: translateY(-50%) rotate(-90deg);
}
.route_list .cta span{
  width: calc(100% - 24px);
  word-wrap: break-word;
}
.route_list .cta:hover{
  text-decoration: none;
  background: #36853d;
}
#ticket .yt_frame{
  width: 100%;
  height: 0;
  padding-bottom: 113%;
  overflow: hidden;
  position: relative;
  margin-top: 24px;
}
#ticket .yt_frame iframe{
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.box-map{
	text-align:center;
	padding-bottom: 30px;
}

@media (max-width:374px){
  .route_list li{
    padding: 0px 8px 16px;
  }
  .route_list .cta{
    font-size: 16px;
  }
}

@media (min-width:576px){
  .route_list .r_ttl + .d-flex{
    justify-content: space-between;
  }
  .route_list .cta{
    width: calc(50% - 8px);
  }
  .route_list .cta:first-of-type{
    margin-bottom: 0;
  }
  .route_list .cta:last-of-type{
    margin-left: auto;
  }
}
@media (min-width:992px){
  .route_list li > .d-flex{
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
  .route_list .r_ttl{
    margin-bottom: 0;
    padding-right: 16px;
  }
  .route_list .r_ttl + .d-flex{
    flex-wrap: nowrap;
  }
  .route_list .price{
    width: auto;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
	  width: 250px;
  }
  .route_list .cta,
  .route_list .cta:last-of-type{
    margin-left: 12px;
    width: 160px!important;
	  padding: 12px 8px;
  }
}
@media (min-width:1200px){
  .route_list .cta,
  .route_list .cta:last-of-type{
    width: 200px!important;
  }
}