@charset "utf-8";

/* area
---------------------------------------------- */

.p-area-sec-ttl {
  position: relative;
  margin-top: 50px;
  padding-top: 80px;
}

.p-area-sec-ttl .img_caption_white,
.p-area-sec-ttl .img_caption_black {
  bottom: 10px;
}

.area-page-nav {
  display: flex;
  flex-wrap: wrap;
  margin-top: 60px;
  gap: 20px 3%;
  justify-content: center;
}

.area-page-nav li:hover {
  opacity: .7;
  transform: translateY(-10px);
}

.bg_gray {
  background: #F4F4F4;
}

.p-area-sec-ttl.bg_gray {
  padding-bottom: 100px;
}

.plan-ttl02 {
  font-size: 34px;
  font-family: 'Noto Serif JP', serif;
  letter-spacing: .1em;
  text-align: center;
  margin-top: 2em;
}

.p-plan_kukakuzu {
  margin-top: 50px;
}

.plan-ttl02-en {
  font-size: 30px;
  font-family: "dico-slab", serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: .05em;
  text-align: center;
  margin-top: 2em;
}

.plan-ttl02-en::after {
  content: "";
  display: block;
  width: 5.5em;
  height: 2.5px;
  background: #111;
  margin: 5px auto 0;
}

.plan-ttl03 {
  font-size: 28px;
  font-family: 'Noto Serif JP', serif;
  letter-spacing: .1em;
  text-align: center;
  margin-top: 1em;
}

.plan-ttl03.mt-more {
  margin-top: 3em;
}

.p-plan_img {
  position: relative;
  margin-top: 30px;
}

/* area01 */
.p-area_img01 {
  margin-top: 40px;
}

.p-area_img_ttl {
  background: #083F21;
  color: #fff;
  padding: 10px 20px;
}

.p-area_img_ttl01 {
  font-size: 24px;
  font-family: 'Noto Serif JP', serif;
}

.p-area_img_ttl02 {
  font-size: 16px;
  font-family: 'Noto Serif JP', serif;
}

.p-area_environment03 {
  display: flex;
  gap: 20px;
  margin-top: 20px;
}

.area_environment03_txt {
  width: calc(70% - 20px);
  text-align: justify;
  font-family: 'Noto Serif JP', serif;
  line-height: 1.8;
}

.area_environment03_img {
  width: 30%;
}

.boder-1 {
  margin-top: 50px;
  border: none;
  height: 1px;
  background: #c2c2c2;
}

.c-page-lead03 {
  font-family: 'Noto Serif JP', serif;
  line-height: 1.8;
  text-align: justify;
  margin-top: 20px;
}

.area_park_list {
  display: flex;
  flex-wrap: wrap;
  gap: 30px 3%;
  margin-top: 50px;
}

.area_park_list__item {
  width: calc(calc(100% - 3%) / 2);
}

.area_park_list__item__ttl {
  margin-top: 0.5em;
}

.area_noen01 {
  margin-top: 50px;
  background: url(../../img/03area/area_noen01.jpg) no-repeat top center;
  background-size: 100%;
  background-color: #3A3825;
  padding: 200px 10% 50px;
  color: #fff;
}

.area_noen01_ttl01 {
  font-size: 24px;
  font-family: 'Noto Serif JP', serif;
  letter-spacing: .1em;
}

.area_noen01_img {
  margin-top: 50px;
}

.area_noen01_ttl02 {
  font-size: 22px;
  font-family: 'Noto Serif JP', serif;
  letter-spacing: .1em;
  margin-top: 20px;
}

.parea_noen01_txt {
  font-family: 'Noto Serif JP', serif;
  line-height: 1.8;
  margin-top: 10px;
  text-align: justify;
}

/* area02 */
.p-area-sec-ttl#are02 {
  margin-top: -80px;
  padding-top: 80px;
}

.p-location-ttlset {
  margin-top: 50px;
}

.p-location-ttlset__ttl01 {
  font-size: 22px;
  font-family: "dico-slab", serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: .05em;
  line-height: 1;
  text-align: center;
  color: #fff;
  background: #231815;
  padding: .3em 0;
}

.p-location-ttlset__ttl02 {
  background: #F4F4F4;
  font-size: 22px;
  font-family: 'Noto Serif JP', serif;
  letter-spacing: .1em;
  line-height: 1;
  padding: .4em 0;
}

.p-location_img_ttl {
  background: #003D56;
  color: #fff;
  padding: 10px 20px 30px;
}

.p-area_img_lead {
  font-family: 'Noto Serif JP', serif;
  line-height: 1.8;
  text-align: justify;
  margin-top: 20px;
}

.area_shop_list {
  display: flex;
  flex-wrap: wrap;
  gap: 30px 3%;
  margin-top: 50px;
}

.area_shop_list__item {
  width: calc(calc(100% - 3%) / 2);
}

.area_shop_list__item__ttl {
  margin-top: 0.5em;
  text-align: justify;
}

.area_shopping10 {
  margin-top: 50px;
  background: url(../../img/03area/area_shopping10_bg.jpg) no-repeat top center;
  background-size: 100%;
  background-color: #003D56;
  padding: 240px 10% 50px;
  color: #fff;
}

.area_shopping10_ttl01 {
  font-size: 24px;
  font-family: 'Noto Serif JP', serif;
  letter-spacing: .1em;
  text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8), 0px 0px 7px rgba(0, 0, 0, 0.5);
}

.area_shopping10_lsit {
  display: flex;
  flex-wrap: wrap;
  gap: 30px 3%;
  margin-top: 50px;
}

.area_shopping10_lsit__item {
  width: calc(calc(100% - 3%) / 2);
}

.area_shopping10_ttl02 {
  margin-top: 10px;
  text-align: justify;
}

.mt_top {
  margin-top: 50px;
}

/* area03 */
.p-car_access01 {
  margin-top: 50px;
}

.p-train-access-sec {
  padding: 50px 0 100px;
  margin-top: 50px;
}

.p-train-access-sec .plan-ttl02-en {
  margin-top: 0;
}

.p-train_access01 {
  margin-top: 50px;
}

.p-bus_access01 {
  width: clamp(300px, 100%, 550px);
  margin-inline: auto;
  margin-top: 50px;
}

.p-lifeinfo-map {
  margin-top: 50px;
}

.lifeinfo-ttl01 {
  font-size: 20px;
  font-family: "dico-slab", serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: .05em;
  text-align: center;
  margin-top: 2em;
}

.lifeinfo-ttl01::after {
  content: "";
  display: block;
  width: 5.5em;
  height: 2.5px;
  background: #111;
  margin: 5px auto 0;
}

.life_info_list {
  display: flex;
  flex-wrap: wrap;
  gap: 0 5%;
  margin-top: 50px
}

.life_info_list li {
  width: calc(calc(100% - 5%) / 2);
}

.access_note {
  font-size: 12px;
  text-align: justify;
  margin-top: 30px;
}

.access_note p {
  padding-left: 1em;
  text-indent: -1em;
}

@media screen and (max-width:768px) {
  .p-area-sec-ttl {
    position: relative;
    margin-top: 30px;
    padding-top: 60px;
  }

  .plan-ttl02 {
    font-size: 5.8vw;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: 0;
    text-align: center;
    margin-top: 2em;
  }

  .plan-ttl02-en {
    font-size: 20px;
    font-family: "dico-slab", serif;
    font-weight: 700;
    font-style: normal;
    letter-spacing: .05em;
    text-align: center;
    margin-top: 2em;
  }

  #are01 .plan-ttl02-en {
    margin-top: 0;
  }

  .plan-ttl03 {
    font-size: 4.8vw;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: .1em;
    text-align: center;
    margin-top: 1em;
  }

  .plan-ttl03.mt-more {
    margin-top: 3em;
  }

  .p-plan_img {
    position: relative;
    margin-top: 20px;
  }

  .area-page-nav {
    display: flex;
    flex-wrap: wrap;
    margin-top: 40px;
  }

  .area-page-nav li {
    width: calc(calc(100% - 6%) / 3);
  }

  .p-area-sec-ttl.bg_gray {
    padding-bottom: 50px;
  }

  /* area01 */
  .p-area_img01 {
    margin-top: 30px;
  }

  .p-area_img_ttl {
    background: #083F21;
    color: #fff;
    padding: 10px 20px;
  }

  .p-area_img_ttl01 {
    font-size: 22px;
    font-family: 'Noto Serif JP', serif;
  }

  .p-area_img_ttl02 {
    font-size: 15px;
    font-family: 'Noto Serif JP', serif;
  }

  .p-area_environment03 {
    display: flex;
    gap: 20px;
    margin-top: 20px;
  }

  .area_environment03_txt {
    width: calc(60% - 20px);
    text-align: justify;
    font-size: 13px;
  }

  .area_environment03_img {
    width: 40%;
  }

  .boder-1 {
    margin-top: 30px;
  }

  .c-page-lead03 {
    text-align: justify;
    margin-top: 20px;
    font-size: 13px;
  }

  .area_park_list {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 3%;
    margin-top: 30px;
    font-size: 13px;
  }

  .area_park_list__item {
    width: calc(calc(100% - 3%) / 2);
  }

  .area_park_list__item__ttl {
    margin-top: 0.5em;
  }

  .area_noen01 {
    margin-top: 30px;
    background: url(../../img/03area/area_noen01.jpg) no-repeat top center;
    background-size: 100%;
    background-color: #3A3825;
    padding: 26vw 5% 30px;
    color: #fff;
  }

  .area_noen01_ttl01 {
    font-size: 19px;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: .1em;
  }

  .area_noen01_img {
    margin-top: 30px;
  }

  .area_noen01_ttl02 {
    font-size: 15px;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: .1em;
    margin-top: 10px;
  }

  .parea_noen01_txt {
    margin-top: 10px;
    text-align: justify;
    font-size: 13px;
  }

  /* area02 */
  .p-area-sec-ttl#are02 {
    margin-top: -80px;
    padding-top: 80px;
  }

  .p-location-ttlset {
    margin-top: 50px;
  }

  .p-location-ttlset__ttl01 {
    font-size: 17px;
    letter-spacing: .05em;
    line-height: 1;
    text-align: center;
    color: #fff;
    background: #231815;
    padding: .3em 0;
  }

  .p-location-ttlset__ttl02 {
    background: #F4F4F4;
    font-size: 15px;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: .1em;
    line-height: 1;
    padding: .4em 0;
  }

  .p-location_img_ttl {
    background: #003D56;
    color: #fff;
    padding: 10px 20px 30px;
  }

  .p-area_img_lead {
    text-align: justify;
    margin-top: 10px;
    font-size: 13px;
  }

  .area_shop_list {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 3%;
    margin-top: 30px;
  }

  .area_shop_list__item {
    width: calc(calc(100% - 3%) / 2);
  }

  .area_shop_list__item__ttl {
    margin-top: 0.5em;
    text-align: justify;
    font-size: 13px;
  }

  .area_shopping10 {
    margin-top: 50px;
    background: url(../../img/03area/area_shopping10_bg.jpg) no-repeat top center;
    background-size: 100%;
    background-color: #003D56;
    padding: 24vw 5% 30px;
    color: #fff;
  }

  .area_shopping10_ttl01 {
    font-size: 19px;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: .1em;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8), 0px 0px 7px rgba(0, 0, 0, 0.5);
  }

  .area_shopping10_lsit {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 5%;
    margin-top: 30px;
  }

  .area_shopping10_lsit__item {
    width: calc(calc(100% - 5%) / 2);
  }

  .area_shopping10_ttl02 {
    margin-top: 10px;
    text-align: justify;
    font-size: 13px;
  }

  .mt_top {
    margin-top: 30px;
  }

  /* area03 */
  .p-car_access01 {
    margin-top: 30px;
  }

  .p-train-access-sec {
    padding: 30px 0 50px;
    margin-top: 30px;
  }

  .p-train-access-sec .plan-ttl02-en {
    margin-top: 0;
  }

  .p-train_access01 {
    margin-top: 30px;
  }

  .p-bus_access01 {
    width: clamp(300px, 100%, 550px);
    margin-inline: auto;
    margin-top: 30px;
  }

  .p-lifeinfo-map {
    margin-top: 30px;
  }

  .lifeinfo-ttl01 {
    font-size: 20px;
    font-family: "dico-slab", serif;
    font-weight: 700;
    font-style: normal;
    letter-spacing: .05em;
    text-align: center;
    margin-top: 2em;
  }

  .lifeinfo-ttl01::after {
    content: "";
    display: block;
    width: 5.5em;
    height: 2.5px;
    background: #111;
    margin: 5px auto 0;
  }

  .life_info_list {
    display: flex;
    flex-wrap: wrap;
    gap: 0 5%;
    margin-top: 30px
  }

  .life_info_list li {
    width: 100%;
    margin-top: -1px;
  }

}