@charset "UTF-8";

/* FUTUREページ専用 */

/* メインコピー 文字サイズ */
#container .mainCopy p {
  font-size: 30px;
}
@media screen and (max-width: 767px) {
  #container .mainCopy p {
    font-size: 18px;
  }
}

/* ランキング〜進化はまだ終わらない 余白調整 */
#container .bg_wht .section--index-nostalgy {
  padding-bottom: 4em !important;
}
#container #minatomirai21.section--index-nostalgy {
  padding-top: 4em !important;
  background: #E5E5E5;
}

/* みなとみらいエリア工事セクション（con01〜03）背景白 */
#construction {
  background: #FFF;
}

/* futureページ全体 タイトル行の罫線削除 */
.minato_con05 .minato_txtArea .flex_tx {
  border-bottom: none !important;
}

/* エリアバナー（他セクションのtxtbgと同サイズに統一） */
#future-area-banner {
  background: #000 !important;
  padding: 0.6em 0 !important;
  margin-bottom: 3em !important;
}
#future-area-banner p {
  color: #fff !important;
  font-size: 22px !important;
  letter-spacing: 0.1em !important;
  text-align: center !important;
}

/* みなとみらいエリア テキストエリア */
.minato_txtArea {
  margin-top: 3em;
  letter-spacing: 0.1em;
}
.minato_txtArea .flex_tx {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 2em;
}
.minato_txtArea .flex_tx .num {
  width: 30px;
  height: 30px;
  font-size: 21px;
  line-height: 1.4;
  margin-right: 10px;
  text-align: center;
  color: #fff;
  background-color: #000;
}
.minato_txtArea .flex_tx .ttl {
  font-size: 26px;
  letter-spacing: 0.15em;
  line-height: 1.3;
}
.minato_txtArea .flex_tx .ttl span {
  font-size: 18px;
  margin-top: 0.5em;
  line-height: 1.7;
  letter-spacing: 0.1em;
  display: block;
}

/* construction セクション */
.minato_con01,
.minato_con02,
.minato_con03 {
  padding: 0 0 10em;
  background: #FFF;
}
.minato_con01 {
  padding-top: 3em;
}
.minato_con01 .imagephoto {
  width: 100%;
}
.minato_con01 .imagephoto img {
  width: 100%;
  height: auto;
  display: block;
}
.minato_con01 .bor_Area {
  width: 80%;
  margin: 4em auto 0;
  padding: 3em 0;
  border: none !important;
}
.minato_con01 .bor_Area ul {
  display: flex;
  flex-wrap: wrap;
  gap: 4%;
  align-items: flex-start;
}
.minato_con01 .bor_Area ul li:nth-child(1) { width: 43%; }
.minato_con01 .bor_Area ul li:nth-child(2) { width: 48%; }
@media screen and (max-width: 767px) {
  .minato_con01 .bor_Area {
    width: 100%;
  }
  .minato_con01 .bor_Area ul {
    flex-direction: column !important;
    gap: 2em;
  }
  .minato_con01 .bor_Area ul li:nth-child(1) {
    width: 80% !important;
    margin: 0 auto;
  }
  .minato_con01 .bor_Area ul li:nth-child(2) {
    width: 100% !important;
  }
}
.minato_con01 .bor_Area img {
  width: 100%;
  height: auto;
  display: block;
}
.minato_con01 .bor_Area .ttl {
  font-size: 18px;
  margin-bottom: 0.8em;
}
.minato_con02 .imageCap img,
.minato_con03 .imageCap img {
  width: 100%;
  height: auto;
  display: block;
}

/* minato_con01〜con03・con05(4番) PC タイトルレイアウト調整 */
@media screen and (min-width: 768px) {
  .minato_con01 .minato_txtArea .flex_tx .ttl span:first-of-type {
    display: inline;
    font-size: 15px;
    margin-top: 0;
    letter-spacing: 0.05em;
  }
  .minato_con01 .minato_txtArea .flex_tx .ttl span:last-of-type {
    display: block;
    font-size: 17px;
    margin-top: 0.4em;
  }
  .minato_con02 .minato_txtArea .flex_tx .ttl span:first-of-type,
  .minato_con03 .minato_txtArea .flex_tx .ttl span:first-of-type {
    display: inline;
    font-size: 15px;
    margin-top: 0;
    letter-spacing: 0.05em;
  }
  .minato_con02 .minato_txtArea .flex_tx .ttl span:last-of-type,
  .minato_con03 .minato_txtArea .flex_tx .ttl span:last-of-type {
    display: block;
    font-size: 17px;
    margin-top: 0.4em;
  }
  .minato_con05 .minato_txtArea .flex_tx .ttl span {
    display: inline;
    font-size: 17px;
    margin-top: 0;
  }
}

/* minato_con05（5番）テキストサイズ調整 */
.minato_con05.is-white .con_flex.con_flex03 .txtArea01 .txt {
  font-size: 18px;
  line-height: 1.8;
}

/* minato_con05（5番）PC 画像・テキスト幅バランス調整 */
@media screen and (min-width: 768px) {
  .minato_con05.is-white .con_flex.con_flex03 .txtArea01 {
    width: 37%;
  }
  .minato_con05.is-white .con_flex.con_flex03 .imageCap {
    width: 60%;
  }
}

/* minato_con06（北仲通りエリア） */
.minato_con06 {
  padding: 0 0 10em;
  background: #f5f5f5;
}
.minato_con06 .con_flex06 {
  margin-top: 3em;
}
@media screen and (max-width: 767px) {
  .minato_con06 .con_flex06 {
    flex-direction: column;
  }
  .minato_con06 .con_flex06 .con06-left,
  .minato_con06 .con_flex06 .con06-right {
    width: 100%;
  }
  .minato_con06 .con_flex06 .con06-right {
    margin-top: 2em;
  }
}
.minato_con06 .con_flex06 .imageCap img {
  width: 100%;
  height: auto;
  display: block;
}
@media screen and (min-width: 768px) {
  .minato_con06 .minato_txtArea .flex_tx .ttl span:first-of-type {
    display: inline;
    font-size: 15px;
    margin-top: 0;
    letter-spacing: 0.05em;
  }
  .minato_con06 .minato_txtArea .flex_tx .ttl span:last-of-type {
    display: block;
    font-size: 17px;
    margin-top: 0.4em;
  }
  .minato_con06 .con_flex06 .con06-left {
    width: 40%;
    display: flex;
    flex-direction: column;
  }
  .minato_con06 .con_flex06 .con06-left .minato_txtArea {
    margin-top: 0;
  }
  .minato_con06 .con_flex06 .con06-left .imageCap {
    margin-top: auto;
  }
  .minato_con06 .con_flex06 .con06-right {
    width: 55%;
  }
}

/* テキストボックス 明朝体 */
#feeling .font01 {
  font-family: "fot-tsukuaoldmin-pr6n", serif;
  font-weight: 400;
  font-style: normal;
}

/* スライドショー上部の黒背景除去・下ボックスとの余白追加 */
#feeling .bg_br {
  padding-top: 0 !important;
}
#feeling #con04 {
  margin-bottom: 5em;
}

/* ランキング画像サイズ・配置調整 */
#container .ranking_list {
  justify-content: center;
  gap: 4%;
}
#container .ranking_list li {
  width: 42%;
}
@media screen and (max-width: 767px) {
  #container .ranking_list {
    flex-direction: column;
    align-items: center;
    gap: 2em;
  }
  #container .ranking_list li {
    width: 100%;
  }
  #container .ranking_list .ranking_ttl {
    font-size: 16px;
    text-align: center;
    margin: 0 0 0.8em;
  }
}

/* BASEGATE横浜関内 説明文 */
#position .imageCap .cap_text {
  font-size: 16px;
  line-height: 2.1;
}
@media screen and (max-width: 767px) {
  #position .imageCap .cap_text {
    font-size: 13px;
    line-height: 1.4;
  }
  .minato_con05 .section__inner04 {
    margin-top: 14em !important;
  }
}
