@charset "UTF-8";
/* 
  css設定 @charsetが消されるsass仕様へのハック用コメントです。削除しないでください。新規作成時も必須！
 */
/* ========================================================
 redevelop
======================================================== */
#redevelopment {
  overflow: hidden;
}

#redevelopment h3, #redevelopment h4, #redevelopment h5 {
  font-weight: normal;
}

#redevelopment .mv .mv-bg {
  background-image: url(../images/redevelopment/bg.jpg);
}

#redevelopment .mv .mv-bg .inners .txt {
  width: 33.2%;
}

#redevelopment .mv .small {
  display: inline-block;
  padding-bottom: 20rem;
  font-size: 30px;
}

#redevelopment .mv .mv01 {
  position: relative;
}

#redevelopment .mv .annotation {
  font-size: 10rem;
  line-height: 1.6;
  margin-top: 5rem;
  margin-left: 3%;
}

#redevelopment .header {
  text-align: center;
  padding-bottom: 68rem;
}

#redevelopment .header .title {
  font-size: 28rem;
  line-height: 1.5;
  padding-bottom: 40rem;
}

#redevelopment .header .lead {
  font-size: 14rem;
  line-height: 2;
}

#redevelopment .images .annotation {
  text-align: right;
  font-size: 10rem;
  padding-top: 6px;
}

#redevelopment .page-box {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 40rem;
  padding-bottom: 60rem;
}

#redevelopment .page-box .page-box-header {
  width: 45%;
  text-align: left;
  gap: 30rem;
}

#redevelopment .page-box .images {
  width: 52%;
  order: 1;
}

#redevelopment .page-box.img-right .page-box-header {
  order: 0;
}

#redevelopment .page-box.img-right .images {
  order: 1;
}

#redevelopment .page-box.img-left .page-box-header {
  order: 1;
}

#redevelopment .page-box.img-left .images {
  order: 0;
}

#redevelopment .page-box .ttl {
  font-size: 18rem;
  line-height: 1.6;
  background: linear-gradient(270deg, rgba(255, 255, 255, 0), #D196C4);
  padding: 12rem 20rem;
  color: #fff;
  margin-bottom: 12rem;
}

#redevelopment .page-box .ttl.color02 {
  background: linear-gradient(270deg, rgba(255, 255, 255, 0), #BC7D79);
}

#redevelopment .page-box .ttl.color03 {
  background: linear-gradient(270deg, rgba(255, 255, 255, 0), #96774E);
}

#redevelopment .page-box .ttl.color04 {
  background: linear-gradient(270deg, rgba(255, 255, 255, 0), #7D9C5B);
}

#redevelopment .page-box .ttl.color05 {
  background: linear-gradient(270deg, rgba(255, 255, 255, 0), #617AA5);
}

#redevelopment .page-box .ttl.color06 {
  background: linear-gradient(270deg, rgba(255, 255, 255, 0), #8CA9A7);
}

#redevelopment .page-box .annotation {
  font-size: 11rem;
  line-height: 1.6;
  word-break: break-all;
}

#redevelopment .page-box .annotation a {
  border-bottom: 1px solid;
}

#redevelopment .page-box .txt {
  font-size: 14rem;
  line-height: 2;
  padding: 20rem 0;
}

#redevelopment .introduce {
  text-align: center;
  padding: 80rem 0;
}

#redevelopment .introduce .box {
  display: flex;
  justify-content: space-between;
  padding-bottom: 50rem;
}

#redevelopment .introduce .box .img01 {
  width: 55%;
  padding-top: 160rem;
}

#redevelopment .introduce .box .imgs {
  width: 42%;
}

#redevelopment .introduce .box .img03 {
  padding-top: 54rem;
  width: 70%;
}

#redevelopment .hiroba .box01 {
  margin-left: 12%;
  padding-bottom: 60rem;
}

#redevelopment .hiroba .box01 .page-box-header {
  width: 35%;
}

#redevelopment .hiroba .box01 .images {
  width: 62%;
}

#redevelopment .others-img {
  margin: 0 auto;
  max-width: 1000rem;
  padding-bottom: 80rem;
}

#redevelopment .others .box02 {
  margin: 0 auto;
  max-width: 1000rem;
}

#redevelopment .others .box02 .page-box-header {
  width: 50%;
}

#redevelopment .others .box02 .images {
  width: 45%;
}

#redevelopment .others .box03 {
  align-items: start;
}

#redevelopment .others .box03 .ttl02 {
  margin-top: 45rem;
}

@media (max-width: 768px) {
  #redevelopment .mv .mv-bg {
    background-image: url(../images/redevelopment/bg-sp.jpg);
  }
  #redevelopment .mv .mv-bg .inners .txt {
    width: 71%;
  }
  #redevelopment .mv .page-name .big {
    font-size: 32px;
  }
  #redevelopment .mv .small {
    padding-bottom: 8rem;
    font-size: 12px;
  }
  #redevelopment .mv .annotation {
    width: 94%;
    margin: 5rem auto 0;
  }
  #redevelopment .header {
    padding-bottom: 36rem;
  }
  #redevelopment .header br {
    display: none;
  }
  #redevelopment .header .title {
    font-size: 24rem;
    line-height: 1.8;
    text-align: left;
  }
  #redevelopment .header .lead {
    text-align: left;
    line-height: 2;
  }
  #redevelopment .page-box {
    display: block;
    padding-bottom: 40rem;
  }
  #redevelopment .page-box .page-box-header {
    width: 100%;
  }
  #redevelopment .page-box .images {
    width: 100%;
    padding-bottom: 30rem;
  }
  #redevelopment .page-box .ttl {
    padding: 12rem 20rem;
    margin-bottom: 12rem;
  }
  #redevelopment .page-box .txt {
    padding: 20rem 0;
  }
  #redevelopment .introduce {
    padding: 80rem 0;
  }
  #redevelopment .introduce .images .annotation {
    text-align: left;
  }
  #redevelopment .introduce .box {
    display: block;
    padding-bottom: 50rem;
  }
  #redevelopment .introduce .box .img01 {
    width: auto;
    margin-left: 15%;
    padding-top: 0rem;
    padding-bottom: 45rem;
  }
  #redevelopment .introduce .box .imgs {
    width: 100%;
  }
  #redevelopment .introduce .box .img02 {
    margin-right: 15%;
  }
  #redevelopment .introduce .box .img03 {
    padding-top: 54rem;
    width: auto;
    margin-left: 15%;
  }
  #redevelopment .introduce .page-box .images {
    width: 85%;
  }
  #redevelopment .introduce .page-box .images img {
    transform: translateX(-4%);
  }
  #redevelopment .hiroba .box01 {
    margin-left: 0%;
    padding-bottom: 30rem;
  }
  #redevelopment .hiroba .box01 .page-box-header {
    width: 90%;
    margin: 0 auto;
  }
  #redevelopment .hiroba .box01 .images {
    width: 100%;
    padding-bottom: 20rem;
  }
  #redevelopment .others-img {
    padding-bottom: 40rem;
  }
  #redevelopment .others-img .annotation {
    padding-right: 5%;
  }
  #redevelopment .others .box02 .page-box-header {
    width: 100%;
  }
  #redevelopment .others .box02 .images {
    width: 100%;
  }
  #redevelopment .others .box03 {
    align-items: start;
  }
  #redevelopment .others .box03 .ttl02 {
    margin-top: 45rem;
  }
}

/*# sourceMappingURL=redevelop.css.map */