@charset "utf-8";

/* ----------------------------------
concept
---------------------------------- */

figure{ position: relative;}
.main{ position: relative;}
.main figure{
  width: 100%;
}
.main .copy_01{
  position: absolute;
  width: 20%;
  top: 11%;
  left: 12%;
  /* max-width: 328px; */
}
.main .copy_02{
  position: absolute;
  width: 32%;
  top: 11%;
  right: 12%;
  /* max-width: 503px; */
}
.copy_box {
margin: 40px auto 0;
}
.copy_box .inner{
align-items: center;
justify-content: center;
flex-wrap: wrap;
}
.catch_copy {
width: 24%;
margin:0 6% 0 6%;

}

.copy {
width: 46%;
text-align: left;
line-height: 1.6;
letter-spacing: 0.18em;
}
.copy h3{
color: #000;
font-size: 24px;
padding-bottom: 1em;
}
.copy p{
font-size: 16px;
}

.precious_life{
  width: 94%;
  margin: 100px auto 0;
/*  padding-bottom: 100px;*/
}
.precious_life h2{
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
}
.life_copy {
text-align: center;
line-height: 1.6;
margin: 50px auto 0;
}
.life_copy h3{
color: #000;
font-size: 22px;
padding-bottom: 1em;
}
.life_copy p{
font-size: 16px;
}

.map_Area{ position: relative;}
.map_Area > figure{
  position: relative;
  width: 100%;
  max-width: 1400px;
  margin: 50px auto 0;
  z-index: 0;
}
/* .PL_Wrap{ position: relative;} */
.PL_Box{
  position: absolute;
  z-index: 1;
}
.PL_Box .txt{
  font-size: 14px;
  line-height: 1.4;
  text-align: justify;
}
.PL_Box .txt.att{
  font-size: 10px;
  line-height: 2;
}
.PL_Box .detail dl dt{
  padding-bottom: 10px;
  border-bottom: 1px solid #dbdbdb;
}
.PL_Box .detail dl dd{
  padding-top: 10px;
  text-align: center;
  font-size: 16px;
  color: #af1a45;
}
.PL_Box .detail dl{ margin-bottom: 15px;}
/* shopping */
.PL_Box.shopping{
  width: 26%;
  /* max-width: 420px; */
  top: 1%;
  left: 5%;
}
.PL_Box.shopping ul.content li{
  justify-content: space-between;
  margin-bottom: 20px;
}
.PL_Box.shopping ul.content li:nth-child(2){ align-items: center;}
.PL_Box.shopping ul.content li.flex > figure{
  width: 48%;
  /* max-width: 200px; */
}
.PL_Box.shopping ul.content li.flex .detail{
  width: 48%;
}
.PL_Box.shopping .detail dl dt figure{
  width: 37%;
  /* max-width: 141px; */
  margin: 0 auto;
}
.PL_Box.shopping ul.content li:nth-child(1) .detail dl dt figure{
  width: 80%;
  margin: 0 auto;
}
.PL_Box.shopping ul.content li h3{
  margin: 0 auto;
  width: 45%;
  /* max-width: 163px; */
}
.PL_Box.shopping .detail02{ margin-top: 10px;}
/* access */
.PL_Box.access{
  width: 50%;
  /* max-width: 820px; */
  top: 1%;
  right: 5%;
}
.PL_Box.access .detail dl dt figure{
  width: 40%;
  /* max-width: 140px; */
  margin: 0 auto;
}
.PL_Box.access ul.content li:nth-child(1) .detail dl dt figure{
  width: 80%;
  margin: 0 auto;
}
.PL_Box.access ul.content{
  justify-content: space-between;
  align-items: flex-end;
}
.PL_Box.access ul.content li:nth-child(1){
  width: 25%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.PL_Box.access ul.content li:nth-child(1) h3{
  margin: 0 auto 60px;
  /* max-width: 238px; */
  width: 100%;
}
.PL_Box.access ul.content li:nth-child(2){ width: 20%;}
.PL_Box.access ul.content li:nth-child(3){ width: 48%;}
/* fitness */
.PL_Box.fitness{
  width: 25%;
  top: 34%;
  right: 5%;
}
.PL_Box.fitness ul.content li h3{
  margin-left: auto;
  margin-bottom: 20px;
  width: 30%;
  /* max-width: 114px; */
}
.PL_Box.fitness .detail dl dt figure{
  width: 80%;
  /* max-width: 140px; */
  margin: 0 auto;
}
.PL_Box.fitness ul.content li.flex { justify-content: space-between;}
.PL_Box.fitness ul.content li.flex .detail{
  width: 58%;
}
.PL_Box.fitness ul.content li.flex > figure{
  width: 38%;
  height: fit-content;
}
/* childcare */
.PL_Box.childcare{
  width: 40%;
  top: 63%;
  left: 5%;
}
.PL_Box.childcare ul.content li:nth-child(1){
  align-items: center;
  margin-bottom: 20px;
}
.PL_Box.childcare ul.content li:nth-child(1) figure{
  /* max-width: 200px; */
  width: 34%;
}
.PL_Box.childcare ul.content li:nth-child(1) h3{
  width: 32%;
  margin-left: 20px;
}
.PL_Box.childcare .detail{ width: 70%;}
.PL_Box.childcare .detail dl dt figure{
  width: 40%;
  /* max-width: 166px; */
  margin: 0 auto;
}
.PL_Box.childcare ul.content li:nth-child(2){ justify-content: space-between;}
.PL_Box.childcare ul.content li:nth-child(2) > figure{
width: 28%;
height: fit-content;
}
/* park */
.PL_Box.park{
  width: 50%;
  bottom: -15%;
  left: 5%;
}
.PL_Box.park ul.content{ justify-content: space-between;}
.PL_Box.park ul.content li h3{
  width: 23%;
  /* max-width: 71px; */
  margin-bottom: 20px;
}
.PL_Box.park ul.content li h4{
  font-size: 18px;
  line-height: 1.5;
  margin-bottom: 20px;
}
.PL_Box.park ul.content li:nth-child(1){ width: 37%;}
.PL_Box.park ul.content li:nth-child(2){ width: 30%;}
.PL_Box.park ul.content li:nth-child(3){ width: 30%;}
.PL_Box.park .detail dl dt figure{
  width: 40%;
  /* max-width: 166px; */
  margin: 0 auto;
}
.PL_Box.park ul.content li:nth-child(3) .detail dl dt figure{
  width: 90%;
  margin: 0 auto;
}
/* leisure */
.PL_Box.leisure{
  width: 37%;
  bottom: -10%;
  right: 5%;
}
.PL_Box.leisure ul.content{
  justify-content: space-between;
  align-items: flex-end;
}
.PL_Box.leisure ul.content li:nth-child(1){ width: 28%;}
.PL_Box.leisure ul.content li:nth-child(2){ width: 33%;}
.PL_Box.leisure ul.content li:nth-child(3){ width: 27%;}
.PL_Box.leisure ul.content li:nth-child(2) h3{
  width: 70%;
  /* max-width: 108px; */
  margin-bottom: 20px;
}
.PL_Box.leisure .detail dl dt figure{
  width: 80%;
  /* max-width: 166px; */
  margin: 0 auto;
}
.PL_Box.leisure .detail .txt{ margin-bottom: 20px;}

.PL_Wrap_pc figure{ position: absolute;}
.shopping_pc{
  width: 27vw;
  top: 0;
  left: 0;
}
.access_pc{
  width: 53vw;
  top: 0;
  right: 0;
}
.fitness_pc{
  width: 25vw;
  top: 30%;
  right: 0;
}
.child_pc{
  width: 37vw;
  top: 63%;
  left: 0;
}
.leisure_pc{
  width: 25vw;
  bottom: -15%;
  right: 0;
}
.park_pc{
  width: 58vw;
  bottom: -16%;
  left: 0;
}

.con_btn { margin: 0 auto;}

.notes {
  width: 90%;
  max-width: 1000px;
  margin: 100px auto 50px;
}
/*=============================
sp・tab
=============================*/
@media only screen and (max-width: 1400px) {


}
@media only screen and (max-width: 1200px) {

}

/*=============================
sp・tab
=============================*/
@media only screen and (max-width: 1024px) {
  .notes{ margin: 100px auto 50px;}
}

/*=============================
spから
=============================*/
@media only screen and (max-width: 768px) {

  .main .copy_01 {
    width: 37%;
    top: 9%;
    left: 7%;
  }
  .main .copy_02 {
    width: 42%;
    top: 9%;
    right: 6%;
  }
  .copy_box {
margin: 40px auto 0;
}
.copy_box .inner{

}
.catch_copy {
width: 44%;
margin:0 6% 0 8%;
}
  .copy {
  width: 100%;
margin: 40px auto 0;
line-height: 1.6;
letter-spacing: 0.18em;
}
.copy h3{
text-align: center;
font-size: 17px;
padding-bottom: 1em;
}
.copy p{
font-size: 14px;
}

.life_copy {
text-align: unset;
line-height: 1.6;
margin: 40px auto 0;
}
.life_copy h3{
text-align: center;
color: #000;
font-size: 18px;
padding-bottom: 1em;
}
.life_copy p{
text-align: left;
font-size: 14px;
}
  .precious_life {
    margin: 50px auto 0;
    padding-bottom: 0;
  }
  .precious_life h2{ width: 80%;}
  .map_Area > figure{ margin: 50px auto;}

  .PL_Wrap{
    display: flex;
    flex-wrap: wrap;
  }
  .PL_Box{
    position: relative;
    margin-bottom: 70px;
  }
  .PL_Box.shopping,.PL_Box.access,
  .PL_Box.fitness,.PL_Box.childcare,
  .PL_Box.park,.PL_Box.leisure{
    width: 100%;
    top: unset;
    left: unset;
    right: unset;
    bottom: unset;
  }
  .PL_Box .txt{ font-size: 13px;}

  /* shopping */
  .PL_Box.shopping ul.content{
    display: flex;
    flex-direction: column;
  }
  .PL_Box.shopping ul.content li:nth-child(1){ order: 2;}
  .PL_Box.shopping ul.content li:nth-child(2){ order: 1;}
  .PL_Box.shopping ul.content li:nth-child(3){
    order: 3;
    margin-bottom: 0;
  }

  /* access */
  .PL_Box.access ul.content{
    flex-wrap: wrap;
  }
  .PL_Box.access ul.content li:nth-child(1),
  .PL_Box.access ul.content li:nth-child(2){ width: 48%;}
  .PL_Box.access ul.content li:nth-child(3) {
    width: 100%;
    margin-top: 20px;
  }
  .PL_Box.shopping ul.content li h3{
  margin: 0 auto;
  width: 34%;
}
.PL_Box.access ul.content li:nth-child(1) h3 {
    margin: 0 auto 25px;
    width: 69.23%;
}
  /* fitness */
  .PL_Box.fitness ul.content li h3{
  width: 33.19%;
    margin-left: 0;
    margin-right: auto;
  }
  .PL_Box.fitness ul.content li:nth-child(3){ margin-top: 20px;}

  /* childcare */
  .PL_Box.childcare ul.content li:nth-child(1) figure{ width: 50%;}
  .PL_Box.childcare ul.content li:nth-child(1) h3{
  width: 32.625%;
margin: 0 auto;  
  }
  .PL_Box.childcare .detail,
  .PL_Box.childcare ul.content li:nth-child(2) > figure{ width: 48%;}
  .PL_Box.childcare .detail dl dt figure{ width: 90%;}

  /* park */
  .PL_Box.park ul.content{ flex-wrap: wrap;}
  .PL_Box.park ul.content li:nth-child(1),
  .PL_Box.park ul.content li:nth-child(2){
    width: 48%;
    margin-bottom: 20px;
  }
  .PL_Box.park ul.content li h3 {
    width: 69.16%;
    margin: 0 auto;
}
  .PL_Box.park ul.content li:nth-child(3){ width: 100%;}
.PL_Box.park ul.content li:nth-child(3) .detail dl dt figure {
    width: 43.2%;
    margin: 0 auto;
}
  /* leisure */
  .PL_Box.leisure ul.content{
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .PL_Box.leisure ul.content li:nth-child(1){ display: none;}
  .PL_Box.leisure ul.content li:nth-child(2){
    width: 48%;
    order: 1;
  }
  .PL_Box.leisure ul.content li:nth-child(2) h3 {
    width: 69.16%;
    margin: 0 auto 20px;
}
  .PL_Box.leisure ul.content li:nth-child(3){
    width: 48%;
    order: 2;
  }

  .notes{ margin: 50px auto;}

  
}