@charset "UTF-8";


.mv-under{background-image:url(../images/access/MV_01.jpg);}

.access-nav{background:url(../images/common/BG_pagenav.png) repeat-y left top; background-size:100% auto; padding:40px 0;}
.access-nav ul{width:; margin:0 auto; text-align:center;}
.access-nav ul li{display:inline-block; vertical-align:top;}
.access-nav ul li a{display:block; padding:0 25px 22px; background:url(../images/access/ARROW_01.png) no-repeat center bottom;}


.access-map{padding:100px 0 40px;}
.access-map h2{text-align:center; font-size:26px; font-weight:500; margin-bottom:40px;}
.access-map p{text-align:center; font-size:17px; line-height:2; margin-bottom:90px;}


.method{background-color:#f8f9fa; padding-bottom:110px;}
.method .car{padding-top:110px;}
.method .bus-train{padding-top:110px;}
.method h2{margin-bottom:80px;}

.spot{padding-bottom:50px; padding-top: 110px;}
.spot .ttl-block{height:450px; position:relative; text-align:center; padding-top:145px; box-sizing:border-box; background:url(../images/access/BG_spot.jpg) no-repeat center; background-size:cover;}
.spot .ttl-block h2{font-size:38px; font-weight:500; color:#fff; line-height:1; margin-bottom:40px; letter-spacing:5px;}
.spot .ttl-block p{font-size:18px; font-weight:500; line-height:33px; color:#fff;}
.spot .spot-list{padding-top:70px;}
.spot .spot-list li{float:left; width:340px; margin:0 40px 40px 0;}
.spot .spot-list li:nth-child(3n){margin-right:0;}
.spot .spot-list li .spot-img{margin-bottom:15px;}
.spot .spot-list li h3{font-size:18px; line-height:25px; font-weight:500; position:relative;}
.spot .spot-list li h3 span{display:inline-block; font-size:13px; line-height:25px; color:#fff; padding:0 10px; position:absolute; right:0; top:0;}
.spot .spot-list li .spot-desc{font-size:14px; line-height:22px; margin:10px 0;}
.spot .spot-list li .spot-link a{display:inline-block; padding-right:21px; background:url(../images/access/ICON_link.png) no-repeat right center; color:#005a96;}


.spot .spot-list li h3 span.cat-sightseeing{background-color:#1b4f66;}
.spot .spot-list li h3 span.cat-hotspring{background-color:#398325;}
.spot .spot-list li h3 span.cat-shopping{background-color:#e96e00;}
.spot .spot-list li h3 span.cat-restaurant{background-color:#57a5c7;}

/* notes */
.notes {
  padding: 24px;
  margin-top: 70px;
  background-color: #f2f8fc;
  border: dotted 1px #adc9db;
}
.notes-heading {
  position: relative;
  text-align: center;
  font-size: 20px;
  letter-spacing: 0.2em;
  font-weight: bold;
  color: #003851;
}
.notes-heading::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: #003851;
}
.notes-heading-text {
  background-color: #f2f8fc;
  position: relative;
  z-index: 10;
  padding: 0 11px 0 15px;
}
.notes-text {
  line-height: 2;
  margin-top: 9px;
  font-size: 15px;
}





@media screen and (max-width:767px){

.spot{padding-top: 90px;}
.mv-under{background-image:url(../images/access/sp/MV_01.jpg);}

.access-nav{background-color:rgba(245,245,245,.6); padding:0;}
.access-nav ul{width:; margin:0 auto; text-align:center;}
.access-nav ul li{display:block; float:left; width:33.3333%; box-sizing:border-box;}
.access-nav ul li a{padding:13px 0; background:none; border-right:#fff solid 2px;}
.access-nav ul li.an03 a{border-right:none; padding:21px 0;}
.access-nav ul li span{padding-right:18px; display:inline-block;  font-size:12px; line-height:16px; background:url(../images/season/ARROW_01.png) no-repeat right center;}


.access-map{padding:40px 0;}
.access-map h2{font-size:19px; margin-bottom:30px;}
.access-map p{font-size:14px; line-height:21px; margin-bottom:30px;}


.method{background-color:#f8f9fa; padding-bottom:90px;}
.method .car{padding-top:40px;}
.method .bus-train{padding-top:40px;}
.method h2{margin-bottom:25px;}


.spot{padding-bottom:30px;}
.spot .ttl-block{height:425px; padding-top:145px; background-image:url(../images/access/sp/BG_spot.jpg);}
.spot .ttl-block h2{font-size:24px; margin-bottom:27px;}
.spot .ttl-block p{font-size:14px; line-height:22px;}
.spot .spot-list{padding-top:25px;}
.spot .spot-list li{float:none; width:100%; margin:0 0 30px;}
.spot .spot-list li img{width:100%;}

  /* notes */
  .notes {
    margin-top: 30px;
    padding: 22px 15px;
  }
  .notes-heading {
    font-size: 17px;
    letter-spacing: 0.1em;
  }
  .notes-heading-text {
    padding: 0 7px 0 9px;
  }
  .notes-text {
    font-size: 14px;
    line-height: 1.8;
  }

}