@charset "UTF-8";
.top_ttl {
  display: none;
}

.c-lower-ttl_bg.position {
  background: url(../img/position/lower-ttl-bg.jpg) center/cover no-repeat;
}
.c-lower-ttl_bg.position::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(35, 24, 21, 0.48);
  mix-blend-mode: multiply;
}

/* ==========================================================================
   NAKANO WARD / SAGINOMIYA AREA ギャラリー
   ========================================================================== */
.positionArea {
  background-color: #fff;
  padding: 96px 0;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .positionArea {
    padding: 24px 0 48px;
  }
}
.positionArea.-saginomiya {
  padding-bottom: 80px;
}
@media screen and (min-width: 1300px) {
  .positionArea.-saginomiya {
    padding-bottom: 24%;
  }
}
@media screen and (min-width: 1500px) {
  .positionArea.-saginomiya {
    padding-bottom: 28%;
  }
}
@media screen and (max-width: 1023px) {
  .positionArea.-saginomiya {
    padding-bottom: 48px;
  }
}
@media screen and (max-width: 767px) {
  .positionArea.-saginomiya {
    padding-bottom: 24;
  }
}

.positionArea_ttl {
  padding-left: 20px;
  margin-bottom: 40px;
  padding-right: 20px;
}
.positionArea_ttl.float-item {
  transform: translateX(-60px);
}
.positionArea_ttl.float-item.is-show {
  transform: translateX(0);
}
.positionArea_ttl img {
  display: block;
  width: 90%;
  max-width: 940px;
  height: auto;
}
@media screen and (max-width: 767px) {
  .positionArea_ttl {
    padding-left: 0;
    margin-bottom: 20px;
  }
  .positionArea_ttl img {
    max-width: 280px;
  }
}

.positionArea_gallery {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 24px;
}
@media screen and (max-width: 767px) {
  .positionArea_gallery {
    flex-direction: column;
    gap: 8px;
    padding-left: 0;
    padding-right: 0;
  }
}
.positionArea_gallery.-gap-none {
  gap: 0;
}
@media screen and (max-width: 767px) {
  .positionArea_gallery.-gap-none {
    gap: 8px;
  }
}

.positionArea_photo {
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}
.positionArea_photo img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.positionArea_caption {
  position: absolute;
  z-index: 1;
  bottom: 0;
  right: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 10px;
  line-height: 1;
  letter-spacing: -0.2px;
  color: #fff;
  padding: 4px;
}
@media screen and (max-width: 767px) {
  .positionArea_caption {
    font-size: 8px;
  }
}
.positionArea_caption.-black {
  color: #231815;
  text-shadow: 0 0 4px #fff, 0 0 4px #fff, 0 0 4px #fff;
}
.positionArea_caption.-left {
  right: auto;
  left: 0;
}
.positionArea_caption.-static {
  position: static;
  text-align: right;
  color: #231815;
}

.positionArea_side {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0;
}
@media screen and (max-width: 767px) {
  .positionArea_side {
    gap: 8px;
  }
}

.positionArea_row {
  display: flex;
  gap: 24px;
}
@media screen and (max-width: 767px) {
  .positionArea_row {
    gap: 8px;
  }
}

/* -- NAKANO WARD -- */
.positionArea_photo.-main {
  width: 35%;
  aspect-ratio: 678/1023;
}
@media screen and (max-width: 767px) {
  .positionArea_photo.-main {
    width: 100%;
  }
}

.positionArea_photo.-arcade {
  flex: 518;
  aspect-ratio: 518/378;
}

.positionArea_photo.-building {
  flex: 671;
  aspect-ratio: 671/378;
}

.positionArea_photo.-station {
  aspect-ratio: 755/509;
  max-width: 755px;
}

.positionArea_photo.-cherry {
  aspect-ratio: 755/509;
  max-width: 755px;
}

@media screen and (max-width: 767px) {
  .positionArea.-nakano .positionArea_gallery {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .positionArea.-nakano .positionArea_side,
  .positionArea.-nakano .positionArea_row {
    display: contents;
  }
  .positionArea.-nakano .positionArea_photo.-main {
    grid-column: 1;
    grid-row: 1/span 2;
    width: auto;
    max-width: none;
    aspect-ratio: 176/247;
  }
  .positionArea.-nakano .positionArea_photo.-arcade {
    grid-column: 2;
    grid-row: 1;
    aspect-ratio: 176/119.5;
  }
  .positionArea.-nakano .positionArea_photo.-building {
    grid-column: 2;
    grid-row: 2;
    aspect-ratio: 176/119.5;
  }
  .positionArea.-nakano .positionArea_photo.-station {
    grid-column: 1;
    grid-row: 3;
    max-width: none;
    aspect-ratio: 176/119.5;
  }
  .positionArea.-nakano .positionArea_photo.-cherry {
    grid-column: 2;
    grid-row: 3;
    max-width: none;
    aspect-ratio: 176/119.5;
  }
}
/* -- SAGINOMIYA AREA --
   写真はflexboxの通常フローで配置し、縦書きテキストのみ写真に重ねる
   装飾要素としてabsoluteで実装している。 */
.positionArea.-saginomiya .positionArea_gallery {
  display: flex;
  flex-direction: column;
}

.positionArea_stage {
  position: relative;
  display: flex;
  gap: 24px;
  margin: 0 8% 0 0;
}
@media screen and (max-width: 767px) {
  .positionArea_stage {
    flex-direction: column;
    gap: 8px;
    margin: 0;
  }
}

.positionArea_colLeft {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 24px;
  width: 57%;
}
@media screen and (max-width: 767px) {
  .positionArea_colLeft {
    display: contents;
  }
}

.positionArea_colRight {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0;
}
@media screen and (max-width: 767px) {
  .positionArea_colRight {
    display: contents;
  }
}

.positionArea_photo.-garden {
  width: 100%;
  aspect-ratio: 1023/740;
}

.positionArea_photo.-wall {
  width: 76%;
  aspect-ratio: 772/298;
}
@media screen and (max-width: 767px) {
  .positionArea_photo.-wall {
    width: 100%;
  }
}

.positionArea_row {
  display: flex;
  gap: 24px;
}
@media screen and (max-width: 767px) {
  .positionArea_row {
    gap: 8px;
  }
}

.positionArea_stack {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0;
}
@media screen and (max-width: 767px) {
  .positionArea_stack {
    gap: 8px;
  }
}

.positionArea_photo.-sign {
  aspect-ratio: 361/232;
}

.positionArea_photo.-stationSign {
  aspect-ratio: 361/232;
}

.positionArea_photo.-shop {
  flex: 1;
  aspect-ratio: 361/488;
}

.positionArea_photo.-tree {
  aspect-ratio: 746/892;
}

.positionArea_vertical {
  position: absolute;
  z-index: 1;
  left: 32%;
  top: 0;
  width: 24%;
  pointer-events: none;
}
.positionArea_vertical img {
  display: block;
  width: 100%;
  height: auto;
}
@media screen and (max-width: 767px) {
  .positionArea_vertical {
    left: auto;
    right: 2%;
    top: 0;
    width: 48%;
  }
}

/* ==========================================================================
   地域商業の更なる発展／リセールバリュー
   ========================================================================== */
.positionDevelopment {
  background-color: #fff;
  padding: 0 0 88px;
}
@media screen and (max-width: 767px) {
  .positionDevelopment {
    padding: 0 0 48px;
  }
}

.positionDevelopment_head {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-bottom: 64px;
}
@media screen and (max-width: 767px) {
  .positionDevelopment_head {
    gap: 12px;
    margin-bottom: 32px;
  }
}

.positionDevelopment_ttl {
  font-family: "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 24px;
  line-height: 1;
  color: #7f6f42;
  letter-spacing: 0.96px;
}
@media screen and (max-width: 767px) {
  .positionDevelopment_ttl {
    font-size: 16px;
  }
}

.positionDevelopment_body p {
  font-family: "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.56px;
  color: #231815;
}
@media screen and (max-width: 767px) {
  .positionDevelopment_body p {
    font-size: 12px;
    line-height: 1.8;
  }
}

.positionDevelopment_map {
  margin-bottom: 96px;
}
.positionDevelopment_map img {
  display: block;
  width: 100%;
  height: auto;
}
@media screen and (max-width: 767px) {
  .positionDevelopment_map {
    margin-bottom: 48px;
  }
}

.positionResale {
  display: flex;
  align-items: center;
  gap: 64px;
  margin-bottom: 64px;
}
.positionResale:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 767px) {
  .positionResale {
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
  }
}

.positionResale_body {
  flex: 0 0 45%;
}
@media screen and (max-width: 767px) {
  .positionResale_body {
    flex: auto;
  }
}

.positionResale_ttl {
  font-family: "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 24px;
  line-height: 1.3;
  color: #5d512d;
  letter-spacing: 0.96px;
  margin-bottom: 16px;
}
@media screen and (max-width: 767px) {
  .positionResale_ttl {
    font-size: 18px;
  }
}

.positionResale_txt {
  font-family: "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.56px;
  color: #231815;
  text-align: justify;
}
@media screen and (max-width: 767px) {
  .positionResale_txt {
    font-size: 12px;
    line-height: 1.8;
  }
}

.positionDevelopment_caption {
  color: #231815;
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: 10px;
}

.positionResale_chart {
  flex: 1;
  min-width: 0;
  position: relative;
}
.positionResale_chart img {
  display: block;
  width: 100%;
  height: auto;
}

.positionResale_caption {
  color: #231815;
  position: absolute;
  bottom: -2em;
  right: 0;
  font-size: 10px;
}

/* ==========================================================================
   SAGINOMIYA AREA ファサードコンセプト
   ========================================================================== */
.positionFacade {
  width: 76%;
  padding-right: 35%;
}
@media screen and (max-width: 1023px) {
  .positionFacade {
    padding-right: 30%;
  }
}
@media screen and (max-width: 767px) {
  .positionFacade {
    margin: 32px auto 0;
    width: 100%;
    padding-right: 0;
  }
}
@media screen and (max-width: 767px) {
  .positionFacade.-sp-pd {
    padding-right: 10px;
    padding-left: 10px;
  }
}

.positionFacade_ttl {
  font-family: "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 24px;
  line-height: 1.3;
  color: #5d512d;
  letter-spacing: 0.96px;
  margin-bottom: 32px;
}
@media screen and (max-width: 767px) {
  .positionFacade_ttl {
    font-size: 18px;
    margin-bottom: 16px;
  }
}

.positionFacade_txt {
  font-family: "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.56px;
  color: #231815;
  text-align: justify;
}
@media screen and (max-width: 767px) {
  .positionFacade_txt {
    font-size: 12px;
    line-height: 1.8;
  }
}