#townmap .bg01 {
  background-color: #f5f2e9;
}
#townmap .maptext {
  padding: 60px 0 20px;
}
@media screen and (max-width: 480px) {
  #townmap .maptext {
    padding: 30px 0 5px;
  }
}
#townmap .map {
  margin-bottom: 60px;
}
@media screen and (max-width: 480px) {
  #townmap .map {
    margin-bottom: 40px;
  }
}
#townmap .linkBtn {
  width: 75%;
  display: block;
  margin: 20px auto 45px;
}
@media screen and (max-width: 480px) {
  #townmap .linkBtn {
    margin: 15px auto 40px;
  }
}
#townmap .flexArea02 .flexItem {
  width: calc(33% - 25px);
}
@media screen and (max-width: 1024px) {
  #townmap .flexArea02 .flexItem {
    width: calc(50% - 20px);
  }
}
@media screen and (max-width: 480px) {
  #townmap .flexArea02 .flexItem {
    width: 100%;
  }
}
#townmap .btn_area .linkBtn:last-child {
  margin-top: -20px;
}
#townmap .mainText {
  margin-top: 90px;
  margin-bottom: 60px;
}
@media screen and (max-width: 1024px) {
  #townmap .mainText {
    margin-top: 60px;
  }
}
@media screen and (max-width: 480px) {
  #townmap .mainText {
    margin-top: 45px;
  }
}
#townmap .flex {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
#townmap .flexArea01 .flexItem {
  width: calc(33% - 20px);
  margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
  #townmap .flexArea01 .flexItem {
    width: calc(50% - 20px);
  }
}
@media screen and (max-width: 480px) {
  #townmap .flexArea01 .flexItem {
    width: 100%;
  }
}
#townmap .adNote {
  margin: 40px 0 0;
  padding-bottom: 60px;
}
@media screen and (max-width: 480px) {
  #townmap .adNote {
    margin: 20px 0 0;
    padding-bottom: 40px;
  }
}