/* ACCESS SAKURA
*****************************************************************/
/* mixin
*********************************************************************/
/* color */
/* media query */
.area_header .block_nav .box_nav nav ul li.access a {
  position: relative;
  display: block;
}
.area_header .block_nav .box_nav nav ul li.access a::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 1px;
  border-bottom: #666 dotted 1px;
  left: 0px;
  bottom: -7px;
}
.area_header .block_visual h1 {
  text-shadow: 0 0 16px rgba(0, 0, 0, 0.5), 0 0 3px rgba(0, 0, 0, 0.5);
}

.area_access {
  padding: 0 20px;
}
.area_access .block_access {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 0 50px;
}
@media all and (max-width: 899px) {
  .area_access .block_access {
    padding: 0 0 30px;
  }
}
.area_access .block_access .box_map {
  width: 100%;
  position: relative;
  padding-top: 64%;
}
.area_access .block_access .box_map iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
}
.area_access .block_access h2 {
  font-size: 3.2rem;
  line-height: 1.3em;
  padding: 80px 0 30px;
  text-align: center;
}
@media all and (max-width: 899px) {
  .area_access .block_access h2 {
    font-size: 2.8rem;
    padding: 50px 0 20px;
  }
}
.area_access .block_access .box_ttl {
  text-align: center;
}
.area_access .block_access .box_ttl h3 {
  font-size: 2rem;
  line-height: 1.4em;
  padding: 5px 0 0;
}
.area_access .block_access .box_flow {
  margin: 0 -20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.area_access .block_access .box_flow div {
  width: 100%;
  max-width: 373px;
  padding: 20px;
}
.area_access .block_access .box_flow div img {
  width: 100%;
  height: auto;
}
.area_access .block_access .box_txt {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.area_access .block_access .box_txt dl {
  width: 48%;
}
@media all and (max-width: 899px) {
  .area_access .block_access .box_txt dl {
    width: 100%;
    padding: 0 0 10px;
  }
}
.area_access .block_access .box_txt dl dt {
  font-size: 1.6rem;
  line-height: 1.4em;
}
.area_access .block_access .box_txt dl dd {
  font-size: 1.5rem;
  line-height: 1.8em;
  padding: 0 0 0 1em;
}
.area_access .block_access .kome {
  text-align: center;
  padding: 16px 0 50px;
}
.area_access .block_access .kome p {
  display: inline-block;
  text-align: left;
  font-size: 1.5rem;
  line-height: 1.6em;
  text-indent: -1em;
  padding: 0 0 0 1em;
}
.area_access .block_access .box_address {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 30px 0;
}
@media all and (max-width: 899px) {
  .area_access .block_access .box_address {
    padding: 10px 0;
  }
}
.area_access .block_access .box_address div {
  padding: 20px;
  width: 50%;
  box-sizing: border-box;
}
@media all and (max-width: 899px) {
  .area_access .block_access .box_address div {
    width: 100%;
    padding: 10px 0;
  }
}
.area_access .block_access .box_address div img {
  width: 100%;
  height: auto;
}
.area_access .block_access .box_address div h3 {
  font-size: 3rem;
  line-height: 1.4em;
  padding: 0 0 5px;
}
.area_access .block_access .box_address div h3 span {
  font-size: 0.75em;
}
.area_access .block_access .box_address div p {
  font-size: 1.8rem;
  line-height: 1.6em;
}

.area_spot {
  background-image: url("../../common/images/bg01.png");
  padding: 60px 0;
}
@media all and (max-width: 899px) {
  .area_spot {
    padding: 40px 0;
  }
}
.area_spot h2 {
  font-size: 3.2rem;
  line-height: 1.3em;
  text-align: center;
}
@media all and (max-width: 899px) {
  .area_spot h2 {
    font-size: 2.8rem;
  }
}
.area_spot .block_anc {
  padding: 20px;
}
.area_spot .block_anc ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.area_spot .block_anc ul li {
  font-size: 1.4rem;
  line-height: 1.6em;
  padding: 3px 15px 3px;
}
.area_spot .block_anc ul li i {
  padding: 0 0 0 4px;
}
.area_spot .block_spot {
  padding: 50px 0 0;
  border-top: #666 dotted 1px;
}
@media all and (max-width: 899px) {
  .area_spot .block_spot {
    padding: 0px 0 0;
  }
}
.area_spot .block_spot .btn_back {
  text-align: center;
  font-size: 1.6rem;
  line-height: 1.6em;
  padding: 0 0 50px;
}
.area_spot .block_spot .btn_back i {
  padding: 0 0 0 4px;
}
.area_spot .block_spot h3 {
  font-size: 2.4rem;
  line-height: 1.3em;
  text-align: center;
}
.area_spot .block_spot ul {
  padding: 10px 25px 25px;
  display: flex;
  flex-wrap: wrap;
}
@media all and (max-width: 1025px) {
  .area_spot .block_spot ul {
    padding: 10px 15px 15px;
  }
}
@media all and (max-width: 899px) {
  .area_spot .block_spot ul {
    padding: 10px 10px 10px;
  }
}
.area_spot .block_spot ul li {
  width: 33.3333%;
  padding: 25px;
  box-sizing: border-box;
}
@media all and (max-width: 1025px) {
  .area_spot .block_spot ul li {
    padding: 15px;
    width: 50%;
  }
}
@media all and (max-width: 899px) {
  .area_spot .block_spot ul li {
    padding: 10px;
  }
}
@media all and (max-width: 480px) {
  .area_spot .block_spot ul li {
    width: 100%;
  }
}
.area_spot .block_spot ul li .inner .box_img {
  width: 46%;
  float: left;
  padding: 0 16px 10px 0;
}
.area_spot .block_spot ul li .inner .box_img a {
  display: block;
  position: relative;
}
.area_spot .block_spot ul li .inner .box_img a::after {
  position: absolute;
  font-family: "Font Awesome 5 Free";
  font-weight: bold;
  color: #FFF;
  content: "\f35d";
  right: 5px;
  bottom: 10px;
  z-index: 30;
  font-size: 1.3rem;
}
.area_spot .block_spot ul li .inner .box_img img {
  width: 100%;
  height: auto;
  position: relative;
  z-index: 15;
}
.area_spot .block_spot ul li .inner h4 {
  font-size: 1.8rem;
  line-height: 1.4em;
}
.area_spot .block_spot ul li .inner p {
  font-size: 1.4rem;
  line-height: 1.6em;
  padding: 8px 0 0;
  text-align: justify;
}
.area_spot .block_spot ul li .inner p a i {
  padding: 0 0 0 4px;
}