/* 복구 후 추가한 정렬 보정.
   원본 스냅샷(src/)은 건드리지 않고 여기서만 덮어쓴다.
   post-32.css / post-86.css 보다 뒤에 로드되므로 같은 특이도면 이 파일이 이긴다. */

/* ── 메인: 히어로를 화면 세로 가운데로 ───────────────────────────── */
section.mcb-section-ksg2ihzly {
  min-height: 100vh;
  min-height: 100svh;      /* 모바일 주소창 높이 변동 대응 */
  display: flex;
  align-items: center;
  padding-top: 110px;      /* 고정 헤더에 로고가 가리지 않도록 */
  padding-bottom: 60px;
  box-sizing: border-box;
}
section.mcb-section-ksg2ihzly > .section_wrapper {
  width: 100%;
}

@media (max-width: 767px) {
  section.mcb-section-ksg2ihzly {
    padding-top: 90px;
    padding-bottom: 48px;
  }
}

/* ── 복구해서 새로 만든 페이지(프롤로그 / BLACK AREA) ───────────────
   Betheme의 .mcb-column-inner 는 넓은 화면에서 폭이 콘텐츠에 맞춰 줄고
   왼쪽에 붙는다. 원본 마크업이 갖고 있던 그리드 클래스가 없어서 그렇다.
   여기서는 항상 꽉 채우게 만들고, 가운데 정렬은 안쪽 max-width가 맡는다. */
.restored-section .mcb-column-inner,
.restored-section .column_attr,
.restored-section .column.mcb-column,
.restored-section .mcb-wrap-inner,
.restored-section .wrap.mcb-wrap {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

/* ── BLACK AREA: 새로 추가한 STORY 버튼을 나머지 5개와 똑같이 ────────
   원본 버튼들은 post-96.css 에서 항목 id 별로 같은 스타일을 받는다
   (테두리 double, 검정 글씨, 배경 투명, hover 시 빨강). 새 버튼에는 그 id 가
   없으니 여기서 동일한 규칙을 준다. */
.mcb-section .mcb-wrap .mcb-item-storybtn .button {
  border-style: double;
  color: #000000;
  background-color: rgba(0, 0, 0, 0);
}
.mcb-section .mcb-wrap .mcb-item-storybtn .button:hover {
  color: #ff0000;
  border-color: #ff0000;
}

/* ── BLACK AREA: 메뉴 버튼 줄 가운데 정렬 ──────────────────────────
   원본은 버튼 5개가 one-sixth 컬럼으로 왼쪽부터 채워지는 구조였다.
   STORY 를 더해 6개가 되면서 줄 배치가 어정쩡해져, 줄 전체를 가운데로 모은다.
   버튼 폭은 글자 길이에 맞추고 줄바꿈이 생겨도 가운데를 유지한다. */
.ba-menu-row {
  display: flex !important;
  flex-direction: column;
  align-items: center !important;
}
/* 이 줄에는 버튼 말고 본문·여백 컬럼도 같이 들어있다.
   그것들은 원래대로 한 줄을 다 쓰게 두고, 버튼만 글자 폭으로 줄여 가운데로 모은다. */
/* 버튼이 아닌 컬럼(본문·여백)은 원래대로 한 줄을 다 쓴다 */
.ba-menu-row > .column.mcb-column {
  width: 100%;
}
/* 버튼은 세로로 쌓고 폭을 통일한다.
   특이도 주의 — .column.mcb-column 이 클래스 3개라 .column_button 만으로는 밀린다. */
.ba-menu-row > .column.mcb-column.column_button {
  width: 260px !important;
  max-width: 90% !important;
  margin: 6px 0 !important;
  padding: 0 !important;
}
.ba-menu-row > .column_button .mcb-column-inner {
  text-align: center !important;
}
.ba-menu-row > .column_button .button {
  width: 100%;
  margin: 0;
}

/* ── 예약하기: 테마 정보 블록 가운데 정렬 ────────────────────────── */
section.mcb-section-ifbit9sit .mcb-column-inner,
section.mcb-section-ifbit9sit .column_attr {
  text-align: center;
}

/* ── 모바일 공통: 좌우로 붙지 않게 ──────────────────────────────── */
@media (max-width: 767px) {
  .content_wrapper .section_wrapper {
    padding-left: 18px;
    padding-right: 18px;
    box-sizing: border-box;
  }
}

/* ── 푸터: 인스타 아이콘 옆에 글자 ─────────────────────────────── */
.social .social-label {
  margin-left: .4em;
  font-size: 14px;
  vertical-align: middle;
}
.social li.instagram a {
  display: inline-flex;
  align-items: center;
  width: auto;
}