/* Theme base styles */

/* Tools
Any animations, or functions used throughout the project.
Note: _macros.css needs to be imported into each stylesheet where macros are used and not included here
*/

/* Generic
This is where reset, normalize & box-sizing styles go.
*/

*, *:before, *:after {
  box-sizing: border-box;
}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * Add the correct box sizing in Firefox.
 */

hr {
  box-sizing: content-box;
  height: 0;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Remove the inheritance of text transform in Edge and Firefox.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * Remove the padding so developers are not caught out when they zero out `fieldset` elements in all browsers.
 */

legend {
  padding: 0;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Objects
Non-cosmetic design patterns including grid and layout classes)
*/



/* CSS variables */

:root {
  --column-gap: 2.13%;
  --column-width-multiplier: 8.333;
}

/* Mobile layout */

.row-fluid {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}


  .row-fluid .span1,
  .row-fluid .span2,
  .row-fluid .span3,
  .row-fluid .span4,
  .row-fluid .span5,
  .row-fluid .span6,
  .row-fluid .span7,
  .row-fluid .span8,
  .row-fluid .span9,
  .row-fluid .span10,
  .row-fluid .span11,
  .row-fluid .span12{
  min-height: 1px;
  width: 100%;
}

/* Desktop layout */

@media (min-width: 768px) {
  .row-fluid {
    flex-wrap: nowrap;
    justify-content: space-between;
  }

  
    .row-fluid .span1 {
      width: calc(var(--column-width-multiplier) * 1% * 1 - var(--column-gap) * (11 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span2 {
      width: calc(var(--column-width-multiplier) * 1% * 2 - var(--column-gap) * (10 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span3 {
      width: calc(var(--column-width-multiplier) * 1% * 3 - var(--column-gap) * (9 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span4 {
      width: calc(var(--column-width-multiplier) * 1% * 4 - var(--column-gap) * (8 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span5 {
      width: calc(var(--column-width-multiplier) * 1% * 5 - var(--column-gap) * (7 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span6 {
      width: calc(var(--column-width-multiplier) * 1% * 6 - var(--column-gap) * (6 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span7 {
      width: calc(var(--column-width-multiplier) * 1% * 7 - var(--column-gap) * (5 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span8 {
      width: calc(var(--column-width-multiplier) * 1% * 8 - var(--column-gap) * (4 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span9 {
      width: calc(var(--column-width-multiplier) * 1% * 9 - var(--column-gap) * (3 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span10 {
      width: calc(var(--column-width-multiplier) * 1% * 10 - var(--column-gap) * (2 * var(--column-width-multiplier) / 100));
    }
  
    .row-fluid .span11 {
      width: calc(var(--column-width-multiplier) * 1% * 11 - var(--column-gap) * (1 * var(--column-width-multiplier) / 100));
    }
  
}
.content-wrapper {
  margin: 0 auto;
  padding: 0 1rem;
}

@media screen and (min-width: 1380px) {
  .content-wrapper {
    padding: 0;
  }
}

.dnd-section > .row-fluid {
  margin: 0 auto;
}

.dnd-section .dnd-column {
  padding: 0 1rem;
}

@media (max-width: 767px) {
  .dnd-section .dnd-column {
    padding: 0;
  }
}

/* Elements
Base HTML elements are styled in this section (<body>, <h1>, <a>, <p>, <button> etc.)
*/

/* The overflow-wrap is meant to prevent long/large words from breaking the mobile responsiveness of a page (e.g. horizontal scrolling). It is preferred to reduce font sizes on mobile to address this, with this CSS specifically helping with extreme scenarios where a reduction in font size is not possible. */

body {
  line-height: 1.4;
  overflow-wrap: break-word;
}

/* Handles word breaking for a few specific languages which handle breaks in words differently. If your content is not translated into these languages, you can safely remove this.  */

html[lang^="ja"] body,
html[lang^="zh"] body,
html[lang^="ko"] body {
  line-break: strict;
  overflow-wrap: normal;
  word-break: break-all;
}

/* Paragraphs */

p {
  font-size: 1rem;
  margin: 0 0 1.4rem;
}

/* Anchors */

a {
  cursor: pointer;
}

/* Headings */

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0 0 1.4rem;
}

/* Lists */

ul,
ol {
  margin: 0 0 1.4rem;
}

ul ul,
ol ul,
ul ol,
ol ol {
  margin: 0;
}

ul.no-list {
  list-style: none;
  margin: 0;
  padding-left: 0;
}

/* Code blocks */

pre {
  overflow: auto;
}

code {
  vertical-align: bottom;
}

/* Blockquotes */

blockquote {
  border-left: 2px solid;
  margin: 0 0 1.4rem;
  padding-left: 0.7rem;
}

/* Horizontal rules */

hr {
  border: none;
  border-bottom: 1px solid #CCC;
}

/* Image alt text */

img {
  font-size: 0.583rem;
  word-break: normal;
}
button,
.button,
.hs-button {
  cursor: pointer;
  display: inline-block;
  text-align: center;
  transition: all 0.15s linear;
  white-space: normal;
}

button:disabled,
.button:disabled,
.hs-button:disabled {
  background-color: #D0D0D0;
  border-color: #D0D0D0;
  color: #E6E6E6;
}

/* No button */

.no-button,
.no-button:hover,
.no-button:focus,
.no-button:active {
  background: none;
  border: none;
  border-radius: 0;
  color: initial;
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  margin-bottom: 0;
  padding: 0;
  text-align: left;
  text-decoration: none;
  transition: none;
}
/* Fields */

.hs-form-field {
  margin-bottom: 1.4rem;
}

/* Labels */

form label {
  display: block;
  font-size: 0.875rem;
  margin-bottom: 0.35rem;
}

/* Form Title */
.form-title {
  margin-bottom: 0;
}

/* Help text */

form legend {
  font-size: 0.875rem;
}

/* Inputs */

form input[type=text],
form input[type=search],
form input[type=email],
form input[type=password],
form input[type=tel],
form input[type=number],
form input[type=file],
form select,
form textarea {
  display: inline-block;
  font-size: 0.875rem;
  padding: 0.7rem;
  width: 100%;
}

form textarea {
  resize: vertical;
}

form fieldset {
  max-width: 100% !important;
}

/* Inputs - checkbox/radio */

form .inputs-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

form .inputs-list > li {
  display: block;
  margin: 0.7rem 0;
}

form .inputs-list input,
form .inputs-list span {
  vertical-align: middle;
}

form input[type=checkbox],
form input[type=radio] {
  cursor: pointer;
  margin-right: 0.35rem;
}

/* Inputs - date picker */

.hs-dateinput {
  position: relative;
}

.hs-dateinput:before {
  content:'\01F4C5';
  position: absolute;
  right: 10%;
  top: 50%;
  transform: translateY(-50%);
}

.fn-date-picker .pika-table thead th {
  color: #FFF;
}

.fn-date-picker td.is-selected .pika-button {
  border-radius: 0;
  box-shadow: none;
}

.fn-date-picker td .pika-button:hover,
.fn-date-picker td .pika-button:focus {
  border-radius: 0 !important;
  color: #FFF;
}

/* Inputs - file picker */

form input[type=file] {
  background-color: transparent;
  border: initial;
  padding: initial;
}

/* Headings and text */

form .hs-richtext,
form .hs-richtext p {
  font-size: 0.875rem;
  margin: 0 0 1.4rem;
}

form .hs-richtext img {
  max-width: 100% !important;
}

/* GDPR */

.legal-consent-container .hs-form-booleancheckbox-display > span,
.legal-consent-container .hs-form-booleancheckbox-display > span p {
  margin-left: 1rem !important;
}

/* Validation */

.hs-form-required {
  color: #EF6B51;
}

.hs-input.invalid.error {
  border-color: #EF6B51;
}

.hs-error-msg {
  color: #EF6B51;
  margin-top: 0.35rem;
}

/* Submit button */

form input[type=submit],
form .hs-button {
  cursor: pointer;
  display: inline-block;
  text-align: center;
  transition: all 0.15s linear;
  white-space: normal;
}

/* Captcha */

.grecaptcha-badge {
  margin: 0 auto;
}


  /* Search button input field and suggestions */
  .body-container-wrapper .hs-search-field__button {
    padding: 15px;
  }

  .body-container-wrapper .hs-search-field__bar--button-inline .hs-search-field__button {
    margin-left: 6px;
    margin-bottom: 0;
  }

  .body-container-wrapper .hs-search-field__button svg {
    height: 15px;
    fill: #fff;
  }

  .body-container-wrapper .hs-search-field__bar > form > .hs-search-field__input {
    padding: 10px;
  }

  .body-container-wrapper .hs-search-field__suggestions li a {
    color: #494A52;
    padding: 0.35rem 0.7rem;
    text-decoration: none;
    transition: background-color 0.3s;
  }

/* Table */

table {
  border-collapse: collapse;
  margin-bottom: 1.4rem;
  overflow-wrap: break-word;
}

/* Table cells */

td,
th {
  vertical-align: top;
}

/* Table header */

thead th {
  vertical-align: bottom;
}

/* Components
Specific pieces of UI that are stylized. Typically used for global partial styling
*/

/* =========================================================
   共通ヘッダー（高見澤 エステートセグメント）
   Figma: PC_追従header(2268:14922) / PC_トップ専用header(2273:31670)
   ========================================================= */

/* スキップリンク: 常に視覚的に非表示（リサイズ/フォーカス時も表示しない）。
   スクリーンリーダーには残すため display:none ではなく clip 方式。 */
.est-header__skip,
.est-header__skip:focus,
.est-header__skip:active {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* global_partial のラッパーdivを透過させ、ヘッダーを body-wrapper 直下扱いに。
   （ラッパーdivの高さがヘッダー分しかないと sticky が追従しないため） */
.body-wrapper > [data-global-resource-path$="header.html"] {
  display: contents;
}

.est-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #fff;
  box-shadow: 0 5px 10px rgba(65, 42, 0, 0.1);
}

.est-header__inner {
  display: flex;
  align-items: stretch;
  min-height: 92px;
  padding-left: 32px;
}

/* ---- ロゴ ---- */
.est-header__logo {
  display: flex;
  align-items: center; /* ロゴを縦中央に（上下の隙間を均等に） */
  gap: 24px;
  text-decoration: none;
  padding-block: 20px;
  position: relative;
}
.est-header__tagline {
  position: absolute;
  top: 12px;
  left: 40px;
  font-size: 10px;
  letter-spacing: 0.15em;
  color: var(--est-text);
  white-space: nowrap;
}
.est-header__logo-img {
  display: block;
  line-height: 0;
}
.est-header__logo-img img {
  display: block;
  width: 267px;
  height: auto;
}
/* 既定（下層ページ・ソリッド）はダークロゴのみ表示。
   .est-header__logo-img img { display:block }(0,1,1) に勝つよう詳細度を確保する */
.est-header__logo-img img.est-header__logo--white { display: none; }
.est-header__logo-img img.est-header__logo--dark { display: block; }

/* 縦線・テキストはロゴの縦中心より少し下（約7px）、両者は同じ縦位置で揃える */
.est-header__divider {
  width: 1px;
  height: 23px;
  background: #d5d5d5;
  position: relative;
  top: 7px;
}
.est-header__seg {
  font-size: 20px;
  font-weight: 700;
  color: var(--est-text);
  line-height: 1;
  position: relative;
  top: 7px;
}

/* ---- 右側ナビ ---- */
.est-header__right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 10px;
  margin-left: auto;
  padding-right: 25px;
}
.est-header__utility {
  display: flex;
  align-items: center;
  gap: 24px;
}
.est-header__utility-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  font-weight: 700;
  color: var(--est-text);
  text-decoration: none;
}
/* 外部リンクアイコン（SVGは白ストローク）。ソリッド白ヘッダーでは暗く、
   トップ透過ヘッダーでは白のまま表示する */
.est-header__ext-icon { display: block; width: 10px; height: 8px; object-fit: contain; filter: brightness(0); opacity: 0.6; }
.est-page--home .est-header__ext-icon { filter: none; opacity: 1; }
.est-page--home .est-header.is-scrolled .est-header__ext-icon { filter: brightness(0); opacity: 0.6; }

.est-header__nav {
  display: flex;
  align-items: center;
  gap: 32px;
}
.est-header__nav a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 16px;
  font-weight: 700;
  color: var(--est-text);
  text-decoration: none;
  transition: color 0.2s ease;
}
.est-header__utility-link:hover,
.est-header__nav a:hover {
  color: #488462;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* ---- お問い合わせボタン ---- */
.est-header__contact {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  background: #488462;
  color: #fff;
  text-decoration: none;
  padding-inline: 24px;
  min-width: 120px;
  transition: background-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}
.est-header__contact:hover { background: #2a6141; }
.est-header__contact span {
  font-size: 16px;
  font-weight: 700;
  white-space: nowrap;
  transition: color 0.2s ease;
}
.est-header__mail-icon { display: block; width: 15px; height: 10px; object-fit: contain; }

/* ---- SP ハンバーガー（既定は非表示） ---- */
.est-header__toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 7px;                 /* Figma: 線の中心間9px（線2px＋隙間7px） */
  width: 28px;              /* 線幅に合わせる */
  padding: 8px 0;           /* タップ領域を縦に確保 */
  margin-left: auto;        /* タブレット/モバイルでハンバーガーを右端へ */
  margin-right: 12px;       /* ブラウザ右端との距離を12pxに */
  border: 0;
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  box-shadow: none;
  -webkit-tap-highlight-color: transparent;
  cursor: pointer;
}
/* テーマの button 既定スタイル（背景色等）を全状態で無効化 */
.est-header__toggle,
.est-header__toggle:hover,
.est-header__toggle:focus,
.est-header__toggle:active {
  background: transparent;
  border: 0;
  box-shadow: none;
  outline: none;
}
.est-header__toggle span {
  display: block;
  width: 28px;
  height: 2px;
  margin-inline: auto;
  background: var(--est-text);
  transition: transform 0.25s ease, opacity 0.25s ease;
}

/* ---- SP ドロワー ---- */
.est-drawer {
  display: none;
}

/* =========================================================
   オーバーレイ表示（トップページ・ヒーロー上に透過）
   body.est-page--home のとき有効。スクロールで .is-scrolled → 白背景
   ========================================================= */
/* トップ初期状態: 固定しない（FV上に重なり、スクロールで一緒に流れる） */
.est-page--home .est-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background: transparent;
  box-shadow: none;
}
/* 透過ヘッダーの白文字を明るいFV上でも読めるように、上→下に薄れる暗いスクリムを背後に敷く。
   Figma「PC_トップ専用header」(2273:31670) の背景フィル＝黒 alpha0.19→0 の縦グラデーションを再現。 */
.est-page--home .est-header::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 150px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.19) 0%, rgba(0, 0, 0, 0) 90%);
  pointer-events: none;
  z-index: -1;
}
/* スクロールで固定・白背景になった後、およびドロワー展開時（白背景）はスクリム不要 */
.est-page--home .est-header.is-scrolled::before,
.est-page--home .est-header.is-drawer-open::before {
  display: none;
}
.est-page--home .est-header .est-header__tagline,
.est-page--home .est-header__seg,
.est-page--home .est-header__utility-link,
.est-page--home .est-header__nav a {
  color: #fff;
}
.est-page--home .est-header__logo-img img.est-header__logo--dark { display: none; }
.est-page--home .est-header__logo-img img.est-header__logo--white { display: block; }
.est-page--home .est-header__divider { background: rgba(255, 255, 255, 0.6); }
.est-page--home .est-header__contact {
  background: #fff;
  color: var(--est-text);
  border-bottom-left-radius: 5px;
}
.est-page--home .est-header__contact span { color: var(--est-text); }
/* 透過時は白ボタン上なのでメールアイコンを黒に（白SVGが見えないため） */
.est-page--home .est-header__mail-icon { filter: brightness(0); }

/* トップ透過時の hover（ナビ=薄緑+下線、ボタン=薄緑地） */
.est-page--home .est-header__utility-link:hover,
.est-page--home .est-header__nav a:hover {
  color: #f6faef;
}
.est-page--home .est-header__contact:hover {
  background: #f6faef;
}
.est-page--home .est-header__contact:hover span { color: var(--est-text); }

/* About Us 最上部がビューポート最上部に到達したら、フェードインで固定＋通常色に */
.est-page--home .est-header.is-scrolled {
  position: fixed;
  background: #fff;
  box-shadow: 0 5px 10px rgba(65, 42, 0, 0.1);
  opacity: 1;
  animation: estHeaderFadeIn 0.4s ease;
}
@keyframes estHeaderFadeIn {
  from { opacity: 0; transform: translateY(-100%); }
  to   { opacity: 1; transform: translateY(0); }
}
.est-page--home .est-header.is-scrolled .est-header__tagline,
.est-page--home .est-header.is-scrolled .est-header__seg,
.est-page--home .est-header.is-scrolled .est-header__utility-link,
.est-page--home .est-header.is-scrolled .est-header__nav a {
  color: var(--est-text);
}
.est-page--home .est-header.is-scrolled .est-header__logo-img img.est-header__logo--dark { display: block; }
.est-page--home .est-header.is-scrolled .est-header__logo-img img.est-header__logo--white { display: none; }
.est-page--home .est-header.is-scrolled .est-header__divider { background: #d5d5d5; }
.est-page--home .est-header.is-scrolled .est-header__contact {
  background: #488462;
  color: #fff;
  border-radius: 0;
}
.est-page--home .est-header.is-scrolled .est-header__contact span { color: #fff; }
/* スクロール後は緑ボタンに戻るのでメールアイコンも白へ戻す */
.est-page--home .est-header.is-scrolled .est-header__mail-icon { filter: none; }

/* スクロール後（ソリッド）の hover はソリッド仕様に戻す */
.est-page--home .est-header.is-scrolled .est-header__utility-link:hover,
.est-page--home .est-header.is-scrolled .est-header__nav a:hover {
  color: #488462;
}
.est-page--home .est-header.is-scrolled .est-header__contact:hover {
  background: #2a6141;
}
.est-page--home .est-header.is-scrolled .est-header__contact:hover span { color: #fff; }

/* ---- トップページ：モバイルでドロワーを開いた時は白背景＋通常色（他ページと同じロゴ／文字色） ---- */
.est-page--home .est-header.is-drawer-open {
  background: #fff;
  box-shadow: 0 5px 10px rgba(65, 42, 0, 0.1);
}
.est-page--home .est-header.is-drawer-open .est-header__seg { color: var(--est-text); }
.est-page--home .est-header.is-drawer-open .est-header__logo-img img.est-header__logo--dark { display: block; }
.est-page--home .est-header.is-drawer-open .est-header__logo-img img.est-header__logo--white { display: none; }
.est-page--home .est-header.is-drawer-open .est-header__divider { background: #d5d5d5; }

/* =========================================================
   中間幅（タブレット閾値〜1280px）：PCナビの窮屈さを緩和
   ========================================================= */
@media screen and (min-width: 1000px) and (max-width: 1280px) {
  .est-header__inner { padding-left: 20px; }
  .est-header__logo { gap: 16px; }
  .est-header__logo-img img { width: 210px; }
  .est-header__seg { font-size: 17px; }
  .est-header__right { padding-right: 16px; gap: 8px; }
  .est-header__nav { gap: 20px; }
  .est-header__nav a { font-size: 14px; }
  .est-header__utility { gap: 16px; }
  .est-header__contact { padding-inline: 18px; min-width: 104px; }
  .est-header__contact span { font-size: 14px; }
}

/* =========================================================
   タブレット
   ========================================================= */
@media screen and (max-width: 999px) {
  .est-header__inner { padding-left: 20px; padding-right: 16px; min-height: 68px; align-items: center; }
  /* ヘッダーが低くなるぶんスクリムも低く */
  .est-page--home .est-header::before { height: 120px; }
  .est-header__logo { gap: 12px; padding-block: 0; align-items: center; }
  .est-header__logo-img img { width: 180px; }
  .est-header__tagline { font-size: 8px; left: 28px; top: 6px; }
  .est-header__seg { font-size: 15px; margin-bottom: 0; }
  .est-header__divider { margin-bottom: 0; }
  .est-header__right,
  .est-header__contact { display: none; }
  .est-header__toggle { display: flex; }
  /* オーバーレイ時もSPロゴは白のまま */
  .est-page--home .est-header__toggle span { background: #fff; }
  .est-page--home .est-header.is-scrolled .est-header__toggle span { background: var(--est-text); }
  /* ドロワー展開時（白背景）はハンバーガー／×も濃色に */
  .est-page--home .est-header.is-drawer-open .est-header__toggle span { background: var(--est-text); }
}

/* =========================================================
   モバイル（SP_header 2268:7495 準拠：ロゴ｜区切り｜エステートセグメント＋右端ハンバーガー）
   ========================================================= */
@media screen and (max-width: 500px) {
  .est-header__inner { min-height: 60px; padding-left: 16px; padding-right: 0; }
  .est-page--home .est-header::before { height: 110px; }
  .est-header__logo { gap: 8px; }
  .est-header__logo-img img { width: 128px; }
  /* 縦線は13px、縦線・テキストはロゴ中心よりの下げ量を控えめに（上へ寄せる） */
  .est-header__divider { display: block; height: 13px; top: 2px; }
  .est-header__seg { display: block; font-size: 12px; top: 2px; }
  /* 線幅28px・右端12pxは基底ルールを継承（モバイルでも上書きしない） */
}

/* ---- ドロワー展開時 ---- */
.est-header.is-drawer-open .est-drawer {
  display: block;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #fff;
  box-shadow: 0 10px 20px rgba(65, 42, 0, 0.12);
  padding: 24px 20px 32px;
}
.est-header.is-drawer-open .est-drawer__nav {
  display: flex;
  flex-direction: column;
}
.est-header.is-drawer-open .est-drawer__nav a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 4px;
  font-size: 16px;
  font-weight: 700;
  color: var(--est-text);
  text-decoration: none;
  border-bottom: 1px solid #eee;
}
/* 外部リンクアイコンをテキスト右横に・大きめに */
.est-header.is-drawer-open .est-drawer__nav a .est-header__ext-icon {
  width: 18px;
  height: 15px;
  filter: brightness(0);
  opacity: 0.55;
}
.est-header.is-drawer-open .est-drawer__contact {
  margin-top: 24px;
}
.est-header.is-drawer-open .est-header__toggle span:nth-child(1) {
  transform: translateY(9px) rotate(45deg);
}
.est-header.is-drawer-open .est-header__toggle span:nth-child(2) {
  opacity: 0;
}
.est-header.is-drawer-open .est-header__toggle span:nth-child(3) {
  transform: translateY(-9px) rotate(-45deg);
}
/* =========================================================
   共通フッター（高見澤 エステートセグメント）
   Figma: pc_footer(2268:6704) 背景 #4e4a44
   ========================================================= */

.est-footer {
  background: #4e4a44;
  color: #fff;
}

.est-footer__inner {
  position: relative;
  max-width: 1568px;
  margin-inline: auto;
  padding: 88px 8.3% 80px;
  display: flex;
  gap: 60px;
  box-sizing: border-box;
}

/* ---- 左：ブランド ---- */
.est-footer__brand {
  display: flex;
  flex-direction: column;
  gap: 27px;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}
.est-footer__logo {
  position: relative;
}
.est-footer__tagline {
  position: absolute;
  top: -14px;
  left: 42px;
  font-size: 9px;
  letter-spacing: 0.15em;
  color: #fff;
  white-space: nowrap;
}
.est-footer__logo img {
  display: block;
  width: 256px;
  height: auto;
}
.est-footer__seg {
  margin: 12px 0 0;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}
.est-footer__address {
  font-style: normal;
  font-size: 16px;
  font-weight: 500;
  line-height: 2;
  color: #fff;
}
/* 住所内のTELリンク等はブラウザ既定の青を打ち消し、他のフッター文字と同色にする */
.est-footer__address a {
  color: inherit;
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.est-footer__address a:hover {
  opacity: 0.7;
}
.est-footer__corp {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 289px;
  padding: 20px;
  border: 1px solid #fff;
  border-radius: 5px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  box-sizing: border-box;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.est-footer__corp img { display: block; }
.est-footer__corp:hover {
  background: rgba(255, 255, 255, 0.3);
  color: #fff;
}

/* ---- 中央：ナビ ---- */
.est-footer__nav {
  display: flex;
  gap: 60px;
  position: relative;
  z-index: 1;
  padding-top: 8px;
}
.est-footer__col {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 160px;
}
.est-footer__group {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.est-footer__link {
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.est-footer__link:hover {
  opacity: 0.7;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.est-footer__ext { display: block; width: 14px; height: 11px; object-fit: contain; }
.est-footer__sub {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-left: 16px;
}
.est-footer__link--child {
  font-size: 14px;
  color: #efefef;
}
.est-footer__link--child::before {
  content: "";
  width: 10px;
  height: 1px;
  background: currentColor;
  flex-shrink: 0;
}

/* ---- 右：街並みライン装飾 ---- */
/* Figma: イラスト下端が下部バーのすぐ上に接地する位置（低め） */
.est-footer__skyline {
  position: absolute;
  right: 0;
  bottom: 16px;
  width: 55%;
  height: auto;
  opacity: 0.9;
  pointer-events: none;
  z-index: 0;
}

/* ---- 下部バー ---- */
.est-footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.3);
}
.est-footer__bottom-inner {
  max-width: 1568px;
  margin-inline: auto;
  padding: 15px 8.3%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  box-sizing: border-box;
}
.est-footer__legal {
  display: flex;
  gap: 32px;
}
.est-footer__legal a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.est-footer__legal a:hover {
  opacity: 0.7;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.est-footer__legal img { display: block; }
.est-footer__copy {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
}

/* =========================================================
   タブレット
   ========================================================= */
@media screen and (max-width: 999px) {
  /* ブランドとナビは横並び・街並み(全幅)は下に折り返す */
  .est-footer__inner {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 40px 60px;
    padding: 56px 24px 48px;
  }
  .est-footer__skyline {
    position: static;
    width: 100%;
    order: 3;
    opacity: 0.5;
  }
  /* brandは住所の長い行で幅を取らないよう縮小可に（横並び維持） */
  .est-footer__brand { flex-shrink: 1; min-width: 0; }
  /* ナビ内の2カラムは縦積み（brandとnavは横並びのまま） */
  .est-footer__nav { padding-top: 0; flex-direction: column; gap: 32px; min-width: 0; flex-shrink: 0; }
  .est-footer__col { min-width: 0; }
  .est-footer__bottom-inner { padding-inline: 24px; }
}

/* =========================================================
   モバイル（SP_footer 808:5311 準拠）
   構成: ①ナビ全幅リスト（区切り線）②ブランド中央寄せ ③街並み ④下部バー中央縦積み
   ========================================================= */
@media screen and (max-width: 500px) {
  .est-footer__inner {
    flex-direction: column;
    gap: 0;
    padding: 0 20px 32px;
  }

  /* --- ①ナビ（最上部・全幅1カラムリスト） --- */
  .est-footer__nav {
    order: 1;
    flex-direction: column;
    gap: 0;
    width: 100%;
    padding-top: 8px;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
  }
  .est-footer__col { width: 100%; gap: 0; }
  .est-footer__group { gap: 0; }
  /* 区切り線: col1は各グループ末尾／col2は各リンク末尾 */
  .est-footer__group,
  .est-footer__col:last-child .est-footer__link--head {
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
  }
  .est-footer__link--head {
    display: flex;
    align-items: center;
    justify-content: flex-start; /* テキスト＋外部アイコンを左に寄せる（アイコンが右端に飛ぶのを防ぐ） */
    gap: 6px;
    width: 100%;
    padding: 18px 2px;
    font-size: 15px;
  }
  /* 子を持つ見出し（事業紹介）はチェブロンを右端へ寄せるため space-between に戻す */
  .est-footer__group:has(.est-footer__sub) > .est-footer__link--head {
    justify-content: space-between;
  }
  /* 事業紹介など子を持つ見出しに展開チェブロン */
  .est-footer__group:has(.est-footer__sub) > .est-footer__link--head::after {
    content: "";
    width: 8px; height: 8px;
    border-top: 1.5px solid #fff;
    border-left: 1.5px solid #fff;
    transform: rotate(45deg);
    margin-right: 4px;
  }
  .est-footer__sub {
    padding: 0 2px 16px;
    gap: 10px;
  }
  .est-footer__link--child { font-size: 14px; }

  /* --- ②ブランド（中央寄せ） --- */
  .est-footer__brand {
    order: 2;
    align-items: center;
    text-align: center;
    gap: 20px;
    padding-top: 40px;
  }
  .est-footer__logo { display: flex; flex-direction: column; align-items: center; }
  .est-footer__seg { text-align: center; }
  .est-footer__address { text-align: center; }
  .est-footer__corp { width: 100%; max-width: 320px; margin-inline: auto; }

  /* --- ③街並み（SP_footer 808:5311: 高さ約116px・中央クロップで全幅ブリード） --- */
  .est-footer__skyline {
    order: 3;
    margin-top: 24px;
    width: calc(100% + 40px);   /* inner の左右padding 20px を打ち消して全幅 */
    margin-inline: -20px;
    height: 116px;
    object-fit: cover;
    object-position: center bottom;
  }

  /* --- ④下部バー（中央・縦積み） --- */
  .est-footer__bottom-inner {
    flex-direction: column;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    text-align: center;
  }
  .est-footer__legal {
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }
}
/* =========================================================
   不動産情報（物件詳細モジュール + 一覧カード）
   Figma: 物件詳細 107:128 / 不動産情報一覧 107:350
   ========================================================= */

/* ===== 共通：ページタイトルバー（下層ページ共通） ===== */
.est-page-title {
  background: #4e4a44;
  color: #fff;
}
.est-page-title__inner {
  max-width: calc(var(--est-content-width) + 64px);
  margin-inline: auto;
  padding: 40px 32px;
  box-sizing: border-box;
}
.est-page-title__en {
  display: block;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--est-green);
  margin-bottom: 6px;
}
.est-page-title__ja {
  margin: 0;
  font-size: 28px;
  font-weight: 700;
}
@media screen and (max-width: 500px) {
  .est-page-title__inner { padding: 24px 20px; }
  .est-page-title__ja { font-size: 22px; }
}

/* ===== パンくず（下層ページ共通） ===== */
.est-breadcrumb {
  border-top: 1px solid #ddd;
}
/* 全幅・左端はヘッダーのロゴ開始位置(32px)に合わせる（コンテンツ幅で中央寄せしない） */
.est-breadcrumb__inner {
  max-width: none;
  margin: 0;
  padding: 20px 32px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  box-sizing: border-box;
}
.body-container-wrapper .est-breadcrumb__inner a,
.body-container-wrapper .est-breadcrumb__inner a:hover,
.body-container-wrapper .est-breadcrumb__inner a:focus,
.body-container-wrapper .est-breadcrumb__inner a:active,
.body-container-wrapper .est-breadcrumb__inner a:visited {
  color: #412a00;
  font-size: 12px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.body-container-wrapper .est-breadcrumb__inner a:hover { opacity: 0.7; }
/* ヘッダーが padding 20px になる幅ではパンくずも合わせる */
@media screen and (max-width: 1280px) {
  .est-breadcrumb__inner { padding-inline: 20px; }
}
.est-breadcrumb__current {
  color: #333;
  font-size: 12px;
  font-weight: 500;
}
/* 区切りシェブロン（CSS描画・文字色に合わせた濃茶で鮮明に） */
.est-breadcrumb__sep {
  flex-shrink: 0;
  width: 6px; height: 6px;
  border-top: 1.5px solid #999999;
  border-right: 1.5px solid #999999;
  transform: rotate(45deg);
}
@media screen and (max-width: 500px) {
  .est-breadcrumb__inner { padding: 14px 20px; gap: 10px; }
}

/* =========================================================
   本文リンクのデフォルト装飾（青字・下線）から独自UIを保護
   theme-overrides.css の「.body-container-wrapper a」(0,1,1) が main.css より
   後に読み込まれ同詳細度で勝つため、こちらは .body-container-wrapper を前置して
   詳細度を上げて確実に上書きする。
   ========================================================= */
/* hover/focus/active/visited すべての状態で既定の青字＋下線を無効化
   （クリック時の一瞬のフラッシュも防ぐ） */
.body-container-wrapper .prop-cards a,
.body-container-wrapper .prop-cards a:hover,
.body-container-wrapper .prop-cards a:focus,
.body-container-wrapper .prop-cards a:active,
.body-container-wrapper .prop-cards a:visited { color: inherit; text-decoration: none; }

.body-container-wrapper .prop-filter a,
.body-container-wrapper .prop-filter a:hover,
.body-container-wrapper .prop-filter a:focus,
.body-container-wrapper .prop-filter a:active,
.body-container-wrapper .prop-filter a:visited { color: #333; text-decoration: none; }

.body-container-wrapper .prop-pager a,
.body-container-wrapper .prop-pager a:visited { color: var(--est-text); text-decoration: none; }
.body-container-wrapper .prop-pager a:hover,
.body-container-wrapper .prop-pager a:focus,
.body-container-wrapper .prop-pager a:active { color: var(--est-green); text-decoration: none; }

.body-container-wrapper .prop .prop__cta,
.body-container-wrapper .prop .prop__cta:hover,
.body-container-wrapper .prop .prop__cta:focus,
.body-container-wrapper .prop .prop__cta:active,
.body-container-wrapper .prop .prop__cta:visited { color: #fff; text-decoration: none; }

.body-container-wrapper .prop__detail-btn,
.body-container-wrapper .prop__detail-btn:hover,
.body-container-wrapper .prop__detail-btn:focus,
.body-container-wrapper .prop__detail-btn:active,
.body-container-wrapper .prop__detail-btn:visited { color: #fff; text-decoration: none; font-weight: 700; }

/* =========================================================
   物件詳細モジュール（Figma 1024:2702 準拠）
   ========================================================= */
.prop {
  max-width: calc(1120px + 64px);
  margin-inline: auto;
  padding: 48px 32px 80px;
  box-sizing: border-box;
}

/* ---- 上部：ギャラリー + 情報 ---- */
.prop__top {
  display: grid;
  grid-template-columns: 704fr 456fr;
  align-items: start;
}
.prop__gallery-main {
  overflow: hidden;
  border-radius: 0;
}
.prop__gallery-main-track {
  display: flex;
  transition: transform 0.4s ease;
}
.prop__gallery-slide {
  flex: 0 0 100%;
  min-width: 0;
}
.prop__gallery-slide img {
  width: 100%;
  height: auto; /* HTMLのheight属性を打ち消して aspect-ratio を有効化（モバイル縦長対策） */
  aspect-ratio: 704 / 470;
  /* 縦写真・間取り図が見切れないよう全体表示（余白はレターボックス背景で埋める） */
  object-fit: contain;
  background: #eceae5;
  display: block;
  border-radius: 0;
}
.prop__gallery-main--empty {
  width: 100%;
  aspect-ratio: 704 / 470;
  border-radius: 8px;
  background: #eceae5;
  display: block;
}
/* サムネイル・スライダー（PC最大5枚・SP最大4枚＋左右矢印） */
.prop__gallery-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}
.prop__gallery-viewport {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
}
.prop__gallery-track {
  display: flex;
  gap: 10px;
  transition: transform 0.3s ease;
}
/* サムネが表示上限未満のときは中央揃え */
.prop__gallery-track.is-centered {
  justify-content: center;
}
.prop__thumb {
  flex: 0 0 calc((100% - 40px) / 5); /* 5枚・gap10×4 */
  aspect-ratio: 141 / 94;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 0;
  overflow: hidden;
  background: none;
  cursor: pointer;
}
.prop__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.prop__thumb.is-active { border-color: var(--est-green); }

/* 左右矢印（CSSシェブロン） */
.prop__gallery-arrow {
  flex: 0 0 auto;
  width: 16px;
  height: 40px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  position: relative;
}
.prop__gallery-arrow::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 9px;
  height: 9px;
  border-top: 2px solid #488462; /* 緑ボタン通常色 */
  border-right: 2px solid #488462; /* 緑ボタン通常色 */
}
.prop__gallery-arrow--prev::before { transform: translate(-30%, -50%) rotate(-135deg); }
.prop__gallery-arrow--next::before { transform: translate(-70%, -50%) rotate(45deg); }
.prop__gallery-arrow:hover::before { border-color: #2b6141; /* 緑ボタンホバー色 */ }

/* ---- 情報カラム ---- */
.prop__info {
  padding-left: 40px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.prop__cat {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #488462;
  font-size: 18px;
  font-weight: 700;
}
.prop__cat img { display: block; width: 20px; height: 20px; object-fit: contain; }
.prop__head { display: flex; flex-direction: column; gap: 5px; }
.prop__name {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: #0a0a0a;
  line-height: 1.3;
}
.prop__price {
  margin: 0;
  color: #0a0a0a;
  line-height: 1.2;
}
.prop__price-num { font-size: 60px; font-weight: 500; }
.prop__price-unit { font-size: 30px; font-weight: 500; }
.prop__price-note { font-size: 36px; font-weight: 700; }

.prop__line {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 18px;
  font-weight: 500;
  color: #333;
}
.prop__line-icon { display: block; flex-shrink: 0; width: 20px; height: 20px; object-fit: contain; }
.prop__inline-spec p {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.6;
  color: #333;
}
.prop__desc {
  font-size: 16px;
  line-height: 2;
  color: #333;
}
/* リッチテキスト内の p はテーマ既定の p スタイル（font-size 24px 等）を受けないよう明示 */
.prop__desc p {
  margin: 0 0 0.5em;
  font-size: 16px;
  line-height: 2;
  color: #333;
  font-weight: 400;
}
.prop__desc p:last-child { margin-bottom: 0; }

/* ---- 詳細リンク（360°パノラマ等） ---- */
.prop__detail {
  padding-top: 20px;
  width: 352px;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}
.prop__detail-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  margin: 0;
  color: #488462;
  font-size: 16px;
  font-weight: 700;
}
.prop__detail-line {
  width: 1px;
  height: 24px;
  background: #488462;
  transform: rotate(-28deg);
}
.prop__detail-line--r { transform: rotate(28deg); }
.prop__detail-btn {
  width: 100%;
  height: 77px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  background: #488462;
  color: #fff;
  border-radius: 5px;
  font-size: 18px;
  font-weight: 700;
  text-decoration: none;
  transition: background-color 0.2s ease;
}
.prop__detail-btn img { display: block; width: 6px; height: 11px; object-fit: contain; }
.prop__detail-btn:hover { background: #2a6141; }

/* ---- 物件情報見出し ---- */
/* 物件情報セクション：上部に区切り線（Figma Vector114 #d4d4d4）＋左バーは文字のみ */
.prop__h2 {
  margin: 56px 0 32px;
  padding-top: 100px;
  border-top: 1px solid #d4d4d4;
}
.prop__h2-text {
  display: block;
  padding: 10px 0 10px 24px;
  border-left: 4px solid #412a00;
  font-size: 30px;
  font-weight: 700;
  color: #333;
  line-height: 1.3;
}

/* ---- スペック表（2カラムのラベル/値ペア） ---- */
.prop-spec {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid #d4d4d4;
  border-left: 1px solid #d4d4d4;
}
.prop-spec__item {
  display: grid;
  grid-template-columns: 163px 1fr;
  border-bottom: 1px solid #d4d4d4;
  border-right: 1px solid #d4d4d4;
}
.prop-spec__item dt {
  margin: 0;
  background: #fdf8ec;
  padding: 16px 20px;
  border-right: 1px solid #d4d4d4;
  font-size: 16px;
  font-weight: 500;
  color: #333;
  display: flex;
  align-items: center;
}
.prop-spec__item dd {
  margin: 0;
  background: #fff;
  padding: 16px 20px;
  font-size: 16px;
  color: #333;
  display: flex;
  align-items: center;
}

/* ---- POINT ---- */
.prop-point {
  margin-top: 60px;
  position: relative;
}
.prop-point__label {
  position: absolute;
  top: -25px;
  left: 0;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #488462;
  color: #fff;
  border-radius: 10px;
  padding: 12px 20px;
  font-family: "Oswald", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1;
}
.prop-point__label img { display: block; width: 36px; height: 29px; object-fit: contain; }
.prop-point__box {
  border: 2px solid #488462;
  border-radius: 8px;
  background: #fff;
  padding: 60px 32px 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.prop-point__item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.prop-point__bullet { flex-shrink: 0; display: block; width: 18px; height: 26px; object-fit: contain; }
.prop-point__item p {
  margin: 0;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.6;
  color: #333;
}

/* ---- 物件詳細 レスポンシブ ---- */
@media screen and (max-width: 999px) {
  .prop { padding: 32px 24px 64px; }
  .prop__top { grid-template-columns: 1fr; }
  .prop__info { padding-left: 0; margin-top: 24px; }
  .prop__price-num { font-size: 48px; }
  .prop__price-unit { font-size: 24px; }
  .prop__h2 { margin-top: 40px; padding-top: 56px; }
  .prop__h2-text { font-size: 24px; }
  .prop__detail { width: 100%; }
}
@media screen and (max-width: 500px) {
  .prop { padding: 24px 20px 48px; }
  .prop__info { margin-top: 38px; }
  .prop__price-num { font-size: 40px; }
  .prop__line { font-size: 16px; }
  /* 詳細ボタン: 幅100%でなく内容幅・中央（Figma SP 1827:4975 padding16/32・font16） */
  .prop__detail-btn { width: auto; height: auto; padding: 16px 32px; font-size: 16px; }
  .prop__thumb { flex: 0 0 calc((100% - 30px) / 4); } /* SP最大4枚・gap10×3 */
  .prop-spec { grid-template-columns: 1fr; }
  .prop-spec__item { grid-template-columns: 110px 1fr; }
  /* POINTラベル: 浮きラベルのまま、サイズをモバイルデザインに（Figma 1833:4263） */
  .prop-point__label {
    top: -21px;
    padding: 10px;
    gap: 6px;
    border-radius: 10px;
    font-size: 18px;
  }
  .prop-point__label img { width: 26px; height: 23px; }
  .prop-point__box { padding: 48px 20px 24px; }
  .prop-point__item p { font-size: 16px; }
}

/* =========================================================
   物件への問い合わせセクション（詳細ページ）
   ========================================================= */
.prop-inquiry {
  background: #f5f5f5; /* Figma Rectangle 1798 */
}
.prop-inquiry__inner {
  max-width: calc(928px + 64px); /* コンテンツ幅928px（Figma）＋左右padding */
  margin-inline: auto;
  padding: 64px 32px 80px;
  box-sizing: border-box;
}
.prop-inquiry__title {
  text-align: center;
  font-size: 40px; /* Figma 1024:2973 */
  font-weight: 700;
  color: #333;
  line-height: 1.5;
  margin: 0 0 40px;
}
@media screen and (max-width: 999px) {
  .prop-inquiry__title { font-size: 32px; }
}
@media screen and (max-width: 500px) {
  /* SP: セクション上下60px・左右20px、見出し26px・margin-bottom32px（Figma 1811:4168） */
  .prop-inquiry__inner { padding: 60px 20px 60px; }
  .prop-inquiry__title { font-size: 26px; margin: 0 0 32px; }
}

/* ---- HubSpotフォームのスタイル（ブランド適用） ---- */
.prop-inquiry__form { max-width: 100%; margin-inline: auto; }

.prop-inquiry__form .hs-form-field { margin-bottom: 24px; }

/* ラベル */
.prop-inquiry__form .hs-form-field > label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--est-text);
}
.prop-inquiry__form .hs-form-required { color: #d64545; margin-left: 4px; }
.prop-inquiry__form .hs-field-desc {
  margin: 0 0 8px;
  font-size: 12px;
  color: var(--est-text-sub);
}

/* 入力欄 */
.prop-inquiry__form .hs-input:not([type="checkbox"]):not([type="radio"]) {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #d1d6dc;
  border-radius: var(--est-radius);
  background: #fff;
  font-size: 15px;
  font-family: inherit;
  color: var(--est-text);
  box-sizing: border-box;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.prop-inquiry__form textarea.hs-input { min-height: 140px; resize: vertical; }
.prop-inquiry__form .hs-input:focus {
  outline: none;
  border-color: var(--est-green);
  box-shadow: 0 0 0 3px rgba(72, 132, 99, 0.15);
}
.prop-inquiry__form select.hs-input { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23488463' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px; }

/* チェックボックス・ラジオ */
.prop-inquiry__form .inputs-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px 24px; }
.prop-inquiry__form .inputs-list > li { margin: 0; }
.prop-inquiry__form .hs-form-booleancheckbox-display,
.prop-inquiry__form .inputs-list label {
  display: inline-flex;
  align-items: flex-start;
  gap: 8px;
  font-weight: 400;
  font-size: 14px;
  color: var(--est-text);
  cursor: pointer;
}
.prop-inquiry__form .inputs-list input[type="checkbox"],
.prop-inquiry__form .inputs-list input[type="radio"] {
  width: 18px; height: 18px; margin-top: 1px; accent-color: var(--est-green); flex-shrink: 0;
}

/* エラー */
.prop-inquiry__form .hs-error-msgs { list-style: none; margin: 6px 0 0; padding: 0; }
.prop-inquiry__form .hs-error-msg,
.prop-inquiry__form .hs-error-msgs label { color: #d64545; font-size: 13px; }
.prop-inquiry__form .hs-input.invalid { border-color: #d64545; }

/* 個人情報同意（legal） */
.prop-inquiry__form .legal-consent-container {
  margin: 8px 0 24px;
  font-size: 13px;
  color: var(--est-text-sub);
  line-height: 1.7;
}
.prop-inquiry__form .legal-consent-container a { color: var(--est-green); }

/* 送信ボタン */
.prop-inquiry__form .hs_submit { text-align: center; margin-top: 8px; }
.prop-inquiry__form .hs-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 280px;
  padding: 18px 40px;
  border: 0;
  border-radius: 999px;
  background: var(--est-green);
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  transition: background-color 0.2s ease, opacity 0.2s ease;
}
.prop-inquiry__form .hs-button:hover { background: #2a6141; }

/* 送信完了メッセージ */
.prop-inquiry__form .submitted-message {
  text-align: center;
  padding: 32px;
  background: #fff;
  border: 1px solid var(--est-green);
  border-radius: var(--est-radius);
  color: var(--est-text);
}

@media screen and (max-width: 500px) {
  .prop-inquiry__form .hs-button { width: 100%; min-width: 0; }
}

/* 新型HubSpotフォーム（hsfc-*）のスタイルは css/components/_form.css に集約（全フォーム共通）。
   旧レガシー .hs-form 系（上部）は現行フォームが hsfc のため未使用。 */

/* =========================================================
   不動産情報 一覧（Figma: PC_不動産情報（一覧）980:2276）
   ========================================================= */

/* ---- ヒーロー（葉写真背景＋見出し・360px） ---- */
.prop-hero {
  position: relative;
  overflow: hidden;
  background: #fff;
}
.prop-hero__bg { position: absolute; inset: 0; z-index: 0; }
.prop-hero__bg img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 35%;
  opacity: 0.4; display: block;
}
.prop-hero__wave {
  position: absolute; left: 0; right: 0; bottom: 0;
  width: 100%; height: auto; z-index: 1; pointer-events: none;
}
.prop-hero__inner {
  position: relative; z-index: 2;
  max-width: calc(1312px + 64px); /* デザイン: h1/パンくずは左マージン128（通常コンテンツより96px広い） */
  margin-inline: auto;
  padding: 20px 32px 0;
  min-height: 360px;
  box-sizing: border-box;
}
.prop-breadcrumb { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.body-container-wrapper .prop-breadcrumb a,
.body-container-wrapper .prop-breadcrumb a:hover,
.body-container-wrapper .prop-breadcrumb a:focus,
.body-container-wrapper .prop-breadcrumb a:active,
.body-container-wrapper .prop-breadcrumb a:visited { color: #412a00; text-decoration: none; }
.body-container-wrapper .prop-breadcrumb a:hover { text-decoration: underline; }
/* 区切りシェブロン: CSSボーダーで描画（色 #999999） */
.prop-breadcrumb__sep {
  flex-shrink: 0;
  width: 6px; height: 6px;
  border-top: 1.5px solid #999999;
  border-right: 1.5px solid #999999;
  transform: rotate(45deg);
}
.prop-breadcrumb__current { color: #412a00; }
.prop-hero__head { padding-top: 72px; }
.prop-hero__en {
  margin: 0;
  font-family: "Cormorant Garamond", serif;
  font-weight: 500;
  font-size: 80px;
  line-height: 1;
  color: #412a00;
  text-transform: capitalize;
}
.prop-hero__ja {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 20px;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 18px;
  letter-spacing: 0.04em;
  color: #412a00;
}
.prop-hero__ja::before { content: ""; width: 24px; height: 1px; background: var(--est-green); }

/* ---- 一覧本体コンテナ ---- */
.prop-listing {
  max-width: calc(1120px + 64px); /* デザイン: 通常コンテンツ幅1120（カード352×3+gap32×2） */
  margin-inline: auto;
  padding: 48px 32px 80px;
  box-sizing: border-box;
}

/* ---- フィルター（チェックボックス） ---- */
.prop-filter { margin-bottom: 48px; }
.prop-filter__group { padding: 32px 20px; border-bottom: 1px solid #d4d4d4; }
.prop-filter__group:first-child { border-top: 1px solid #d4d4d4; }
.prop-filter__label { font-size: 16px; font-weight: 700; color: #333; margin: 0 0 24px; }
.prop-filter__items { display: flex; flex-wrap: wrap; gap: 16px 32px; }
.prop-filter__check {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 16px; color: #333; text-decoration: none; cursor: pointer;
}
.prop-filter__box {
  width: 20px; height: 20px;
  border: 1.5px solid #d4d4d4;
  border-radius: 4px;
  background: #fff;
  flex-shrink: 0;
  position: relative;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.prop-filter__check:hover .prop-filter__box { border-color: var(--est-green); }
.prop-filter__check.is-checked .prop-filter__box { background: var(--est-green); border-color: var(--est-green); }
.prop-filter__check.is-checked .prop-filter__box::after {
  content: "";
  position: absolute;
  left: 6px; top: 2px;
  width: 5px; height: 10px;
  border: solid #fff; border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* ---- カードグリッド（縦型3列） ---- */
.prop-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.prop-card {
  display: flex; flex-direction: column;
  background: #fff;
  border-radius: 5px;
  overflow: hidden;
  box-shadow: 0 0 10px rgba(25, 59, 16, 0.2);
  text-decoration: none;
  color: inherit;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.prop-card:hover { transform: translateY(-4px); box-shadow: 0 8px 20px rgba(25, 59, 16, 0.28); }
.prop-card__media { position: relative; aspect-ratio: 352 / 235; background: #eceae5; overflow: hidden; }
/* imgを絶対配置にして枠の高さ計算から切り離す（縦長画像でも aspect-ratio 通りに高さが揃う）。
   直下の img（サムネイル本体）のみを対象にし、> でバッジ内アイコン(.prop-card__badge img)を除外する */
.prop-card__media > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.prop-card__badge {
  position: absolute; top: 10px; left: 10px;
  display: inline-flex; align-items: center; gap: 6px;
  height: 28px; padding: 0 12px;
  border-radius: 20px;
  background: #fff; border: 1px solid #d4d4d4;
  font-size: 14px; color: var(--est-green);
  white-space: nowrap;
}
.prop-card__badge img { display: block; width: 12px; height: 12px; object-fit: contain; }
.prop-card__body { padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.prop-card__head { display: flex; flex-direction: column; gap: 5px; }
.prop-card__name { margin: 0; font-size: 18px; font-weight: 500; line-height: 1.3; color: #0a0a0a; }
.prop-card__price { margin: 0; color: #0a0a0a; font-weight: 500; line-height: 1.2; }
.prop-card__price-num { font-size: 40px; }
.prop-card__price-unit { font-size: 20px; }
.prop-card__line { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; line-height: 1.3; color: #4a5565; }
.prop-card__line-icon { display: block; width: 16px; height: 16px; flex-shrink: 0; object-fit: contain; }
.prop-card__access { margin: 0; font-size: 14px; line-height: 1.3; color: #4a5565; }
.prop-card__spec { margin: 0; font-size: 14px; line-height: 1.4; color: #4a5565; }
.prop-card__spec span { display: block; }

.prop-list__empty { text-align: center; color: var(--est-text-sub); padding: 64px 0; grid-column: 1 / -1; }

/* ---- ページネーション ---- */
.prop-pager { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 56px; }
.prop-pager a,
.prop-pager span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 40px; height: 40px; padding: 0 8px;
  border-radius: 4px; border: 1px solid #e5e2dc;
  color: var(--est-text); text-decoration: none; font-size: 14px;
}
.prop-pager a:hover { border-color: var(--est-green); color: var(--est-green); }
.prop-pager .is-current { background: var(--est-green); border-color: var(--est-green); color: #fff; }

/* ---- 一覧 レスポンシブ ---- */
@media screen and (max-width: 999px) {
  .prop-hero__inner { padding: 20px 24px 0; min-height: 280px; }
  .prop-hero__en { font-size: 56px; }
  .prop-hero__head { padding-top: 48px; }
  .prop-listing { padding: 40px 24px 64px; }
  .prop-cards { grid-template-columns: repeat(2, 1fr); gap: 24px; }
  .prop-filter__items { gap: 14px 24px; }
}
@media screen and (max-width: 500px) {
  .prop-hero__inner { padding: 16px 20px 0; min-height: 200px; }
  .prop-hero__en { font-size: 40px; }
  .prop-hero__head { padding-top: 28px; }
  .prop-hero__ja { font-size: 15px; margin-top: 12px; }
  .prop-listing { padding: 32px 20px 48px; }
  .prop-cards { grid-template-columns: 1fr; gap: 20px; }
  .prop-filter__group { padding: 24px 4px; }
  .prop-filter__items { gap: 14px 20px; }
  .prop-card__price-num { font-size: 34px; }
}
/* =========================================================
   お知らせ（News）一覧・詳細
   Figma: 一覧 981:2599 / 詳細 986:2958
   ヒーローは _property.css の .prop-hero を再利用
   ========================================================= */

/* ===== 本文リンクのデフォルト装飾（青字下線）から保護 ===== */
.body-container-wrapper .news a,
.body-container-wrapper .news a:hover,
.body-container-wrapper .news a:focus,
.body-container-wrapper .news a:active,
.body-container-wrapper .news a:visited { text-decoration: none; }

/* ===== レイアウト（サイドバー242 + 本文960） ===== */
.news {
  max-width: calc(1312px + 64px);
  margin-inline: auto;
  padding: 80px 32px 96px;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 242px 1fr;
  column-gap: 110px;
  align-items: start;
}

/* ===== サイドバー カテゴリ ===== */
.news-cats { display: flex; flex-direction: column; gap: 16px; }
.news-cats__item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 24px;
  border: 1px solid #fdf8ec;
  border-radius: 40px;
  background: #fff;
  color: #412a00;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-align: center;
  box-shadow: 0 10px 5px rgba(175, 114, 0, 0.1);
  transition: background-color 0.2s ease, color 0.2s ease;
}
.news-cats__item:hover { background: #f7f2e6; }
.news-cats__item.is-active {
  background: #412a00;
  color: #fff;
  font-weight: 700;
}
.news-cats__item.is-active:hover { background: #412a00; }

/* ===== 本文 見出し ===== */
.news__h2 {
  margin: 0 0 32px;
  padding: 6px 0 6px 24px;
  border-left: 4px solid #412a00;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.3;
  color: #333;
}

/* ===== 一覧リスト ===== */
.news-list { display: flex; flex-direction: column; }
.news-item {
  display: block;
  padding: 0 0 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #d4d4d4;
  color: inherit;
}
.news-item:first-child { }
.news-item__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 10px;
}
.news-item__date {
  font-size: 14px;
  font-weight: 500;
  color: #999;
}
.news-item__tag {
  display: inline-flex;
  align-items: center;
  padding: 6px 16px;
  border: 1px solid #d4d4d4;
  border-radius: 6px;
  background: #fff;
  font-size: 14px;
  font-weight: 400;
  color: #333;
  white-space: nowrap;
}
.news-item__title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  color: #333;
  transition: color 0.2s ease;
}
.news-item:hover .news-item__title { color: var(--est-green); }

.news-list__empty { color: var(--est-text-sub); padding: 40px 0; }

/* ===== ページネーション ===== */
.news-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-top: 48px;
}
.news-pager__nav {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 40px;
  border: 1px solid #412a00;
  border-radius: 30px;
  color: #412a00;
  font-size: 16px;
  font-weight: 700;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.news-pager__nav:hover { background: #412a00; color: #fff; }
.news-pager__nav.is-disabled { opacity: 0.3; pointer-events: none; }
.news-pager__nums { display: flex; align-items: center; gap: 10px; }
.news-pager__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 55px;
  padding: 16px 18px;
  border: 1px solid #412a00;
  border-radius: 30px;
  color: #412a00;
  font-size: 16px;
  font-weight: 700;
  box-sizing: border-box;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.news-pager__num:hover { background: #f2ede2; }
.news-pager__num.is-current { background: #412a00; color: #fff; }
.news-pager__arw {
  width: 5px; height: 10px; flex-shrink: 0;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0 0l5 5-5 5' fill='none' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0 0l5 5-5 5' fill='none' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center / contain;
}
.news-pager__arw--prev { transform: rotate(180deg); }

/* =========================================================
   詳細ページ（記事）
   ========================================================= */
.news-article {
  max-width: calc(1312px + 64px);
  margin-inline: auto;
  padding: 40px 32px 96px;
  box-sizing: border-box;
  display: grid;
  /* minmax(0,1fr)：本文カラムが min-content 未満まで縮めるようにし、
     中サイズ幅で 350px サイドバーがコンテナ外へはみ出すのを防ぐ */
  grid-template-columns: minmax(0, 1fr) 350px;
  column-gap: 130px;
  align-items: start;
}
/* グリッド子が min-content で膨らまないように */
.news-article__main { min-width: 0; }
.news-article__cat {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 16px;
  font-weight: 700;
  color: #488462;
  margin-bottom: 8px;
}
.news-article__cat img { display: block; width: 20px; height: 20px; object-fit: contain; }
.news-article__title {
  margin: 0 0 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid #ddd;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.5;
  color: #333;
}
.news-article__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}
.news-article__tags { display: flex; flex-wrap: wrap; gap: 10px; }
.news-article__date { font-size: 14px; font-weight: 500; color: #999; white-space: nowrap; }

/* ===== 右サイドバー：カテゴリ（Figma 1409:5145） =====
   茶ヘッダー(#412a00・白文字20px)＋白地の行・#ddd横罫線のみ（角丸/外枠なし）。 */
.news-side { overflow: hidden; }
.news-side__title {
  margin: 0;
  padding: 10px 20px;
  background: #412a00;
  border-bottom: 1px solid #ddd;
  font-size: 20px;
  font-weight: 500;
  color: #fff;
}
.news-side__list { display: flex; flex-direction: column; }
.news-side__item {
  display: flex;
  align-items: center;
  min-height: 63px;
  padding: 12px 20px;
  background: #fff;
  border-bottom: 1px solid #ddd;
  font-size: 16px;
  font-weight: 500;
  color: #333;
  transition: color 0.2s ease, background-color 0.2s ease;
}
.news-side__item:hover { color: var(--est-green); background: #f7f5ef; }

/* ===== 記事本文（リッチテキスト rte） ===== */
.news-article__body { margin-top: 8px; }
.rte { font-size: 16px; line-height: 2; color: #333; }
.rte > *:first-child { margin-top: 0; }
.rte p { margin: 0 0 1.5em; font-size: 16px; line-height: 2; color: #333; }
.rte a { color: var(--est-green); text-decoration: underline; text-underline-offset: 2px; }
.rte img { max-width: 100%; height: auto; display: block; margin: 8px 0; border-radius: 4px; }
.rte figure { margin: 24px 0; }
.rte figcaption { margin-top: 8px; font-size: 13px; line-height: 1.8; color: #999; }
/* ===== YouTube・Vimeo等の埋め込みを幅100%で表示 ===== */
.rte iframe { max-width: 100%; }

/* HubSpotリッチテキストの動画埋め込みラッパー
   <div class="hs-embed-wrapper" ... style="max-width:256px; min-width:256px"> のように
   インラインで固定幅が入るため、これを解除して本文幅いっぱいにする。
   内側（padding-bottomでアスペクト比維持・iframeは絶対配置100%）はそのままでOK。 */
.rte .hs-embed-wrapper,
.rte .hs-responsive-embed,
.rte div[class*="hs-responsive-embed"] {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 24px auto !important;
}

/* ラッパー無しで直接貼られた素の動画iframe（絶対配置でないもの）を16:9・幅100%に。
   HubSpotラッパー内のiframe（position:absolute）は除外して壊さない。 */
.rte iframe[src*="youtube"]:not([style*="absolute"]),
.rte iframe[src*="youtube-nocookie"]:not([style*="absolute"]),
.rte iframe[src*="youtu.be"]:not([style*="absolute"]),
.rte iframe[src*="vimeo"]:not([style*="absolute"]) {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
  display: block;
  margin: 24px 0;
}
/* 見出し */
.rte h2 {
  margin: 72px 0 32px;
  padding: 10px 0 10px 24px;
  border-left: 4px solid #412a00;
  font-size: 30px; font-weight: 700; line-height: 1.3; color: #333;
}
.rte h3 {
  margin: 60px 0 24px;
  padding: 20px;
  background: #fdf8ec;
  border-bottom: 1px solid #412a00;
  font-size: 26px; font-weight: 500; line-height: 1.3; color: #333;
}
.rte h4 {
  margin: 40px 0 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid #412a00;
  font-size: 22px; font-weight: 500; line-height: 1.3; color: #333;
}
.rte h5 {
  margin: 32px 0 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
  font-size: 18px; font-weight: 500; line-height: 1.3; color: #333;
}
/* リスト */
.rte ul, .rte ol { margin: 0 0 1.5em; padding-left: 0; }
.rte ul { list-style: none; }
.rte ul li {
  position: relative;
  padding-left: 30px;
  margin-bottom: 8px;
  line-height: 1.7;
}
.rte ul li::before {
  content: "";
  position: absolute;
  left: 4px; top: 0.7em;
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--est-green);
}
.rte ol { list-style: none; counter-reset: rte-ol; }
.rte ol li {
  position: relative;
  padding-left: 30px;
  margin-bottom: 8px;
  line-height: 1.7;
  counter-increment: rte-ol;
}
.rte ol li::before {
  content: counter(rte-ol) ".";
  position: absolute;
  left: 0; top: 0;
  font-weight: 700;
  color: #412a00;
}
/* 引用 */
.rte blockquote {
  margin: 24px 0;
  padding: 24px 32px;
  background: #f7f5ef;
  border-radius: 4px;
  font-size: 14px;
  line-height: 2;
  color: #555;
}
.rte blockquote p:last-child { margin-bottom: 0; }
/* テーブル */
.rte table { width: 100%; border-collapse: collapse; margin: 24px 0; font-size: 15px; }
.rte th, .rte td { border: 1px solid #d4d4d4; padding: 16px 20px; text-align: left; vertical-align: top; line-height: 1.7; }
.rte th { background: #fdf8ec; font-weight: 700; color: #333; white-space: nowrap; }
.rte td { color: #555; }

/* リンク保護（本文は緑下線を維持） */
.body-container-wrapper .news-article__body a { color: var(--est-green); text-decoration: underline; }

/* ===== 記事下ナビ（前のページ / 一覧に戻る / 次のページ）=====
   Figma PC 986:4047 / SP 1940:7079。上に区切り線、3ボタン中央寄せ。 */
.news-postnav {
  grid-column: 1;   /* グリッド左列（本文カラム）の下（row2）に配置 */
  margin-top: 56px;
}
.news-postnav__inner {
  border-top: 1px solid #ddd;
  padding-top: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
.news-postnav__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  box-sizing: border-box;
  padding: 16px 24px;
  border: 1px solid #412a00;
  border-radius: 999px;
  font-size: 16px;
  font-weight: 700;
  color: #412a00;
  background: #fff;
  transition: background-color 0.2s ease, color 0.2s ease;
}
/* 前/次＝白地・茶アウトライン（min-width 175） */
.news-postnav__btn--prev,
.news-postnav__btn--next { min-width: 175px; }
.news-postnav__btn--prev:hover,
.news-postnav__btn--next:hover { background: #fdf8ec; color: #412a00; }
/* 中央「一覧に戻る」＝茶塗り（min-width 250） */
.news-postnav__btn--list {
  min-width: 250px;
  background: #412a00;
  color: #fff;
}
.news-postnav__btn--list:hover { background: #333; color: #fff; }
/* 無効（前/次の記事が無い場合） */
.news-postnav__btn.is-disabled { opacity: 0.3; pointer-events: none; }
/* 矢印（currentColorのマスク） */
.news-postnav__arw {
  width: 6px; height: 11px;
  flex-shrink: 0;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='11' viewBox='0 0 6 11'%3E%3Cpath d='M5.5 0.5l-5 5 5 5' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='11' viewBox='0 0 6 11'%3E%3Cpath d='M5.5 0.5l-5 5 5 5' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center / contain;
}
.news-postnav__arw--next { transform: rotate(180deg); }
.body-container-wrapper .news-postnav a,
.body-container-wrapper .news-postnav a:hover { text-decoration: none; }

/* =========================================================
   タブレット
   ========================================================= */
@media screen and (max-width: 999px) {
  .news {
    grid-template-columns: 1fr;
    row-gap: 40px;
    padding: 48px 24px 72px;
  }
  /* 詳細: 本文とサイドバーを縦積み */
  .news-article {
    grid-template-columns: 1fr;
    row-gap: 40px;
    padding: 32px 24px 72px;
  }
  .news-article__main { order: 1; }
  .news-article__side { order: 2; }
  .news-postnav { order: 3; }
  .news-article__title { font-size: 26px; }
  .rte h2 { margin-top: 48px; font-size: 26px; }
  .rte h3 { font-size: 22px; }
  /* サイドバーを横スクロールの行に */
  .news-cats {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px;
  }
  .news-cats__item { padding: 12px 24px; }
  .news__h2 { font-size: 24px; }
}

/* =========================================================
   モバイル
   ========================================================= */
@media screen and (max-width: 500px) {
  .news { padding: 32px 20px 56px; row-gap: 40px; }
  /* カテゴリ（サイドバー）を記事一覧より上に配置 */
  .news__side { order: 1; }
  .news__main { order: 2; }
  /* カテゴリは縦積みフルワイドのボタン */
  .news-cats { flex-direction: column; gap: 12px; }
  .news-cats__item { flex: none; width: 100%; padding: 16px 24px; font-size: 14px; }
  .news__h2 { font-size: 22px; padding-left: 16px; }
  .news-item__title { font-size: 16px; }
  .news-pager { gap: 10px; flex-wrap: wrap; }
  .news-pager__nav { padding: 12px 20px; font-size: 14px; }
  .news-pager__num { min-width: 44px; padding: 12px 14px; font-size: 14px; }

  /* 詳細（記事） */
  .news-article { padding: 24px 20px 56px; row-gap: 32px; }
  .news-article__title { font-size: 22px; padding-bottom: 16px; margin-bottom: 16px; }
  .news-article__meta { margin-bottom: 28px; }
  .rte { font-size: 15px; }
  .rte p { font-size: 15px; }
  .rte h2 { margin-top: 40px; font-size: 22px; padding-left: 16px; }
  .rte h3 { margin-top: 40px; font-size: 19px; padding: 14px; }
  .rte h4 { font-size: 17px; }
  .rte th, .rte td { display: block; width: auto; }
  .rte th { border-bottom: 0; }
  /* 記事下ナビ：カテゴリの後（最後尾）に。3ボタンを1行・均等・コンパクトに（Figma SP 1940:7079） */
  .news-postnav { order: 3; margin-top: 0; }
  .news-postnav__inner { padding-top: 32px; gap: 8px; }
  .news-postnav__btn {
    flex: 1 1 0;
    min-width: 0;
    padding: 12px 6px;
    gap: 6px;
    font-size: 12px;
    white-space: nowrap;
  }
  .news-postnav__btn--prev,
  .news-postnav__btn--next { min-width: 0; }
  .news-postnav__btn--list { min-width: 0; }
  .news-postnav__arw { width: 5px; height: 9px; }
}
/* =========================================================
   ページ本文リッチテキスト（ドラッグ＆ドロップエリア用）
   下層ページ共通テンプレ（.est-page--lower）のD&Dエリアに置いた
   HubSpotリッチテキストモジュール（.hs_cos_wrapper_type_rich_text）に、
   ブログ本文（_news.css の .rte）と同じ体裁を適用する。
   ※ブログの .rte 定義とスタイルを揃えること（値を変える場合は両方更新）。
   ========================================================= */


.est-page--lower .hs_cos_wrapper_type_rich_text { font-size: 16px; line-height: 2; color: #333; }
.est-page--lower .hs_cos_wrapper_type_rich_text > *:first-child { margin-top: 0; }
.est-page--lower .hs_cos_wrapper_type_rich_text p { margin: 0 0 1.5em; font-size: 16px; line-height: 2; color: #333; }
.est-page--lower .hs_cos_wrapper_type_rich_text a { color: var(--est-green); text-decoration: underline; text-underline-offset: 2px; }
.est-page--lower .hs_cos_wrapper_type_rich_text img { max-width: 100%; height: auto; display: block; margin: 8px 0; border-radius: 4px; }
.est-page--lower .hs_cos_wrapper_type_rich_text figure { margin: 24px 0; }
.est-page--lower .hs_cos_wrapper_type_rich_text figcaption { margin-top: 8px; font-size: 13px; line-height: 1.8; color: #999; }

/* 見出し */
.est-page--lower .hs_cos_wrapper_type_rich_text h2 {
  margin: 72px 0 32px;
  padding: 10px 0 10px 24px;
  border-left: 4px solid #412a00;
  font-size: 30px; font-weight: 700; line-height: 1.3; color: #333;
}
.est-page--lower .hs_cos_wrapper_type_rich_text h3 {
  margin: 60px 0 24px;
  padding: 20px;
  background: #fdf8ec;
  border-bottom: 1px solid #412a00;
  font-size: 26px; font-weight: 500; line-height: 1.3; color: #333;
}
.est-page--lower .hs_cos_wrapper_type_rich_text h4 {
  margin: 40px 0 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid #412a00;
  font-size: 22px; font-weight: 500; line-height: 1.3; color: #333;
}
.est-page--lower .hs_cos_wrapper_type_rich_text h5 {
  margin: 32px 0 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
  font-size: 18px; font-weight: 500; line-height: 1.3; color: #333;
}

/* リスト */
.est-page--lower .hs_cos_wrapper_type_rich_text ul, .est-page--lower .hs_cos_wrapper_type_rich_text ol { margin: 0 0 1.5em; padding-left: 0; }
.est-page--lower .hs_cos_wrapper_type_rich_text ul { list-style: none; }
.est-page--lower .hs_cos_wrapper_type_rich_text ul li { position: relative; padding-left: 30px; margin-bottom: 8px; line-height: 1.7; }
.est-page--lower .hs_cos_wrapper_type_rich_text ul li::before {
  content: ""; position: absolute; left: 4px; top: 0.7em;
  width: 10px; height: 10px; border-radius: 50%; background: var(--est-green);
}
.est-page--lower .hs_cos_wrapper_type_rich_text ol { list-style: none; counter-reset: rte-ol; }
.est-page--lower .hs_cos_wrapper_type_rich_text ol li { position: relative; padding-left: 30px; margin-bottom: 8px; line-height: 1.7; counter-increment: rte-ol; }
.est-page--lower .hs_cos_wrapper_type_rich_text ol li::before { content: counter(rte-ol) "."; position: absolute; left: 0; top: 0; font-weight: 700; color: #412a00; }

/* 引用 */
.est-page--lower .hs_cos_wrapper_type_rich_text blockquote {
  margin: 24px 0; padding: 24px 32px;
  background: #f7f5ef; border-radius: 4px;
  font-size: 14px; line-height: 2; color: #555;
}
.est-page--lower .hs_cos_wrapper_type_rich_text blockquote p:last-child { margin-bottom: 0; }

/* テーブル */
.est-page--lower .hs_cos_wrapper_type_rich_text table { width: 100%; border-collapse: collapse; margin: 24px 0; font-size: 15px; }
.est-page--lower .hs_cos_wrapper_type_rich_text th, .est-page--lower .hs_cos_wrapper_type_rich_text td { border: 1px solid #d4d4d4; padding: 16px 20px; text-align: left; vertical-align: top; line-height: 1.7; }
.est-page--lower .hs_cos_wrapper_type_rich_text th { background: #fdf8ec; font-weight: 700; color: #333; white-space: nowrap; }
.est-page--lower .hs_cos_wrapper_type_rich_text td { color: #555; }

/* 埋め込み（YouTube等）を幅100% */
.est-page--lower .hs_cos_wrapper_type_rich_text iframe { max-width: 100%; }
.est-page--lower .hs_cos_wrapper_type_rich_text .hs-embed-wrapper,
.est-page--lower .hs_cos_wrapper_type_rich_text div[class*="hs-responsive-embed"] { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 24px auto !important; }
.est-page--lower .hs_cos_wrapper_type_rich_text iframe[src*="youtube"]:not([style*="absolute"]),
.est-page--lower .hs_cos_wrapper_type_rich_text iframe[src*="youtu.be"]:not([style*="absolute"]),
.est-page--lower .hs_cos_wrapper_type_rich_text iframe[src*="vimeo"]:not([style*="absolute"]) {
  width: 100% !important; height: auto !important; aspect-ratio: 16 / 9; display: block; margin: 24px 0;
}

/* タブレット */
@media screen and (max-width: 999px) {
  .est-page--lower .hs_cos_wrapper_type_rich_text h2 { margin-top: 48px; font-size: 26px; }
  .est-page--lower .hs_cos_wrapper_type_rich_text h3 { font-size: 22px; }
}
/* モバイル */
@media screen and (max-width: 500px) {
  .est-page--lower .hs_cos_wrapper_type_rich_text { font-size: 15px; }
  .est-page--lower .hs_cos_wrapper_type_rich_text p { font-size: 15px; }
  .est-page--lower .hs_cos_wrapper_type_rich_text h2 { margin-top: 40px; font-size: 22px; padding-left: 16px; }
  .est-page--lower .hs_cos_wrapper_type_rich_text h3 { margin-top: 40px; font-size: 19px; padding: 14px; }
  .est-page--lower .hs_cos_wrapper_type_rich_text h4 { font-size: 17px; }
  .est-page--lower .hs_cos_wrapper_type_rich_text th, .est-page--lower .hs_cos_wrapper_type_rich_text td { display: block; width: auto; }
  .est-page--lower .hs_cos_wrapper_type_rich_text th { border-bottom: 0; }
}
/* =========================================================
   トップページ モジュール
   ========================================================= */

/* ---- FV（動画スライダー） Figma: 2268:6856 / SP 2268:7360 ---- */
.fv {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 600px;
  overflow: hidden;
  background: #e9ece9;
}
.fv__viewport { position: absolute; inset: 0; z-index: 1; }
.fv__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.8s ease;
}
.fv__slide.is-active { opacity: 1; }
.fv__media { position: absolute; inset: 0; }
.fv__video,
.fv__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.fv__img--empty { background: #dfe3df; }
.fv__logo {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
}
.fv__logo img { width: 360px; height: auto; }

/* 下部グラデーション（Figma: 高さ133px） */
.fv__overlay {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 133px;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0));
  pointer-events: none;
  z-index: 2;
}

/* コピー（左68px・縦中央+51px） */
.fv__copy {
  position: absolute;
  left: 68px;
  top: calc(50% + 51px);
  transform: translateY(-50%);
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-width: calc(100% - 136px); /* 100% − 左右の隙間（左68px＋右68px） */
}
.fv__copy-top {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.fv__label {
  font-family: "Oswald", sans-serif;
  font-weight: 400;
  font-size: 24px;
  letter-spacing: 0.01em;
  color: #fff;
}
/* 事業タグ（Figma Rectangle431準拠）。左端の斜めキャップ（角丸込み）はSVG、本文は色付き角丸長方形 */
.fv__tag {
  display: inline-flex;
  align-items: stretch;
  font-family: var(--est-font);
  font-weight: 600;
  font-size: 18px;
  line-height: 1.5;
  color: #412a00;
  white-space: nowrap;
}
.fv__tag-cap {
  width: 24px;
  align-self: stretch;      /* 本文の高さに合わせて伸縮（斜め＋角丸のSVG） */
  margin-right: -1px;       /* 本文との継ぎ目を消す */
  display: block;
  flex-shrink: 0;
}
.fv__tag-body {
  display: inline-flex;
  align-items: center;
  padding: 6px 16px 6px 4px;
  border-radius: 0 5px 5px 0; /* 右角のみ丸み（左はキャップが担当） */
}
.fv__heading {
  margin: 0;
  font-family: "Noto Serif JP", serif;
  font-weight: 700;
  font-size: 76px;
  line-height: 1.3;
  color: #fff;
  text-shadow: 0 0 40px rgba(0, 0, 0, 0.16);
}
/* 見出し内の改行(<br>)はモバイル/タブレットのみ有効。
   デスクトップ(>=tablet)は1行表示にするため br を無効化。 */
@media screen and (min-width: 999px) {
  .fv__heading br { display: none; }
}

/* 進捗ライン（左68px・幅170px） */
.fv__progress {
  position: absolute;
  left: 68px;
  bottom: 75px;
  width: 170px;
  height: 1px;
  background: rgba(255, 255, 255, 0.5);
  z-index: 3;
}
.fv__progress-bar { display: block; height: 100%; width: 0; background: #fff; }

/* ページャ（左88px・下24px） */
.fv__pager {
  position: absolute;
  left: 68px;             /* 進捗ラインと同じ左位置 */
  width: 170px;           /* 進捗ラインと同じ幅 */
  bottom: 24px;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center; /* ライン内で中央寄せ */
  gap: 14px;
  color: #fff;
  font-family: "Oswald", sans-serif;
}
.fv__num {
  font-size: 18px;
  letter-spacing: 0.01em;
  width: 26px;
  text-align: center;
}
.fv__slash { position: relative; width: 12px; height: 16px; }
.fv__slash::before {
  content: "";
  position: absolute;
  left: 50%; top: 0;
  width: 1px; height: 16px;
  background: #fff;
  transform: translateX(-50%) rotate(37deg);
}
.fv__arrow {
  position: relative;
  width: 12px; height: 16px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
.fv__arrow::before {
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  width: 7px; height: 7px;
  border-top: 1.5px solid #fff;
  border-right: 1.5px solid #fff;
}
.fv__arrow--prev::before { transform: translate(-30%, -50%) rotate(-135deg); }
.fv__arrow--next::before { transform: translate(-70%, -50%) rotate(45deg); }
.fv__arrow:hover { opacity: 0.7; }

/* ---- タブレット ---- */
@media screen and (max-width: 999px) {
  .fv__copy { left: 40px; max-width: calc(100% - 80px); } /* 左右40px */
  .fv__label { font-size: 20px; }
  .fv__heading { font-size: 56px; }
  .fv__progress { left: 40px; }
  .fv__pager { left: 40px; width: 170px; } /* 進捗ラインと揃える */
  .fv__logo img { width: 280px; }
}

/* ---- モバイル ---- */
@media screen and (max-width: 500px) {
  .fv { height: 600px; min-height: 0; } /* SP設計準拠：FVは約600px（画面全体を占めないように） */
  .fv__overlay { height: 80px; }
  .fv__copy { left: 20px; right: 20px; max-width: none; top: 50%; }
  .fv__label { font-size: 18px; }
  .fv__heading { font-size: 40px; }
  .fv__progress { left: 20px; bottom: 48px; width: 120px; }
  .fv__pager { left: 20px; width: 120px; bottom: 16px; gap: 10px; } /* 進捗ライン(左20/幅120)と揃える */
  .fv__num { font-size: 14px; }
  .fv__logo img { width: 200px; }
}

/* =========================================================
   ② About Us（Figma 2268:1071 / SP 2268:8523）
   背景=写真+事業図+ESTATE+創業バッジ+波+線を合成した1枚画像（テキストなし）を
   幅100%で敷き、その上に 見出し・本文・ボタンを重ねる。
   画像(1568×1220)とテキストの位置関係を全幅で固定するため、
   位置は%・文字/余白は cqw（コンテナ幅比）で指定し画像と等比スケールさせる。
   ========================================================= */
.about {
  position: relative;
  background: linear-gradient(177.93deg, rgba(245, 228, 187, 0.7) 2.27%, rgba(254, 246, 227, 0.49) 73.36%);
  overflow: hidden;
}
.about__inner {
  position: relative;
  width: 100%;
  container-type: inline-size; /* cqw の基準（画面幅に等比） */
}
/* 合成済み背景画像（テキストなし・高さの基準） */
.about__bg {
  display: block;
  width: 100%;
  height: auto;
}
/* タブレット/モバイル専用要素はデスクトップでは非表示 */
.about__bg-tab,
.about__bg-sp,
.about__wave,
.about__badge,
.about__head--m { display: none; }
/* テキスト（画像に重ねる） */
.about__overlay {
  position: absolute;
  top: 16.1%;    /* 192 / 1190（合成画像の緑帯30pxを削除しクロップ済み） */
  left: 8.16%;   /* 128 / 1568 */
  width: 46%;
  z-index: 2;
}
.about__en {
  margin: 0;
  font-family: "Cormorant Garamond", serif;
  font-weight: 500;
  font-size: 5.1cqw;   /* 80px @1568 */
  line-height: 1;
  color: #412a00;
  text-transform: capitalize;
}
.about__ja {
  display: inline-flex;
  align-items: center;
  gap: 0.7cqw;
  margin-top: 1.28cqw;   /* 20px */
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 1.15cqw;    /* 18px */
  letter-spacing: 0.045em;
  color: #412a00;
  white-space: nowrap;
}
.about__ja-bar { width: 1.53cqw; height: 1px; background: #412a00; flex-shrink: 0; }

.about__body { margin-top: 3.83cqw; }  /* 60px */
.about__heading { letter-spacing: 0.02em; }
/* richtextの<p>にはテーマの p{ body_font } が直接効くため、
   コンテナからの継承では負ける。フォントは<p>自体に指定して勝たせる */
.about__heading p {
  margin: 0;
  line-height: 1.8;
  font-family: "Noto Serif JP", serif;
  font-weight: 700;
  font-size: 3.06cqw;    /* 48px */
  color: #412a00;
  letter-spacing: 0.02em;
}
.about__subtext { margin-top: 2.04cqw; }  /* 32px */
.about__subtext p {
  margin: 0;
  line-height: 2;
  font-family: var(--est-font);
  font-weight: 400;
  font-size: 1.15cqw;    /* 18px */
  color: #333;
}
.about__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.02cqw;
  width: 22.45cqw;       /* 352px */
  max-width: 100%;
  margin-top: 2.55cqw;   /* 40px */
  padding: 1.53cqw;      /* 24px */
  background: #488462;
  border: 1px solid #fdf8ec;
  border-radius: 2.55cqw;
  color: #fff;
  font-family: var(--est-font);
  font-weight: 700;
  font-size: 1.15cqw;    /* 18px */
  text-decoration: none;
  box-sizing: border-box;
  box-shadow: 0 10px 5px rgba(175, 114, 0, 0.1);
  transition: background-color 0.2s ease;
}
.about__btn:hover { background: #2a6141; }
.about__btn-arrow {
  width: 0.32cqw; min-width: 4px; height: 0.64cqw; min-height: 8px; flex-shrink: 0;
  background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0.6 0.6L4.4 5L0.6 9.4' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0.6 0.6L4.4 5L0.6 9.4' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
}
/* .body-container-wrapper a のanchor指定に font-weight を奪われるため、
   高い詳細度でボタンを bold（Noto Sans JP Bold相当）に固定 */
.body-container-wrapper .about__btn,
.body-container-wrapper .about__btn:hover,
.body-container-wrapper .about__btn:visited {
  color: #fff;
  text-decoration: none;
  font-weight: 700;
}

/* --- About タブレット/モバイル：重ね配置→縦積み --- */
/* デスクトップは合成画像＋absoluteテキストのオーバーレイだが、
   非デスクトップでは画像を全幅で上、テキストを静的配置で下に積む。
   フォントも cqw から固定px へ切り替える。 */
/* タブレット（Figma TAB 2273:31199 準拠）：上=中央事業図ビジュアル / 下=テキスト / 最下=波 */
@media screen and (max-width: 999px) {
  /* ビジュアル画像下端のクリーム(≈rgb(251,245,229))と背景を一致させ、
     見出し付近の継ぎ目（背景画像の途切れ）を消す */
  .about { overflow: hidden; background: rgb(251, 245, 229); }
  .about__inner {
    display: flex;
    flex-direction: column;
    container-type: normal; /* cqw を無効化 */
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
  }
  /* flex内の画像が min-width:auto でコンテナを押し広げるのを防ぐ */
  .about__bg-tab,
  .about__wave,
  .about__overlay,
  .about__head--m { min-width: 0; max-width: 100%; }
  .about__bg { display: none; }                                  /* デスクトップ合成画像は隠す */
  .about__bg-tab {                                               /* タブレット用ビジュアル（創業バッジ焼き込み済み） */
    display: block; width: 100%; height: auto;
    /* 下端の写真をクリーム背景へフェード（硬い切れ目を防ぐ・アイコンは残す） */
    -webkit-mask: linear-gradient(to bottom, #000 86%, transparent 100%);
            mask: linear-gradient(to bottom, #000 86%, transparent 100%);
  }
  /* タブレットは創業バッジをビジュアル画像に焼き込み済みのため、別バッジは非表示（base の display:none を維持） */
  .about__overlay {
    position: relative;
    top: auto;                 /* デスクトップの top:16.1% をリセット */
    left: 0;                   /* デスクトップの left:8.16% をリセット（右ズレ防止） */
    z-index: 2;                /* ビジュアル下部のクリーム領域にテキストを重ねる */
    width: 100%;
    box-sizing: border-box;
    padding: 0 42px 56px;      /* デザイン: 左右42px */
    margin-top: -7%;           /* フェードした写真下部にAbout Usを少し重ねる（デザイン準拠） */
  }
  .about__en { font-size: 40px; }
  .about__ja { font-size: 14px; gap: 6px; margin-top: 10px; letter-spacing: 0.56px; }
  .about__ja-bar { width: 16px; }
  .about__body { margin-top: 24px; }
  .about__heading p { font-size: 32px; line-height: 1.5; }
  .about__subtext { margin-top: 24px; }
  .about__subtext p { font-size: 18px; line-height: 2; }
  .about__btn {
    width: 293px;
    max-width: 100%;
    margin-top: 24px;
    padding: 24px;
    font-size: 16px;
    border-radius: 40px;
    gap: 16px;
  }
  .about__btn-arrow { width: 5px; min-width: 5px; height: 10px; min-height: 10px; }
  .about__wave { display: block; width: 100%; height: auto; margin-top: -1px; }
}
/* モバイル（Figma SP 2268:8523 準拠）：About Us＋バッジを図の上、本文は図の下 */
@media screen and (max-width: 500px) {
  .about__bg-tab { display: none; }                  /* タブレット用ビジュアル（バッジ焼込）は隠す */
  .about__bg-sp {                                    /* モバイル用ビジュアル（バッジなし） */
    display: block; width: 100%; height: auto;
    aspect-ratio: 375 / 710;   /* 要素高さを固定（画像キャッシュ差に依存しない＝見出しとの位置関係が崩れない） */
    object-fit: cover;
    min-width: 0; max-width: 100%;
    /* 上端（建物）と下端をクリーム背景へフェード（硬い切れ目を防ぐ）。
       写真は見出し「暮らしを支え〜」の背後まで伸ばす（下部はソフトフォーカス） */
    -webkit-mask: linear-gradient(to bottom, transparent 0%, #000 8%, #000 90%, transparent 100%);
            mask: linear-gradient(to bottom, transparent 0%, #000 8%, #000 90%, transparent 100%);
  }
  /* About Us：図の上・左寄せ。デザインは上端から約145px下（バッジ下部と同段） */
  .about__head--m { display: block; padding: 145px 20px 0; box-sizing: border-box; }
  .about__head--d { display: none; }                 /* overlay内ラベルは非表示 */
  /* 創業バッジ：右上に密着（上の隙間をなくす）。モバイルのみ別画像で表示 */
  .about__badge {
    display: block;
    position: absolute;
    top: 0;
    right: 16px;
    width: 108px;
    height: auto;
    z-index: 3;
  }
  /* 見出し以降を写真の下部へ重ねる（写真が「暮らしを支え〜」の背後まで伸びる）。
     %は about__inner 幅基準で写真高さと同じくスケール。見出しは写真上、説明・ボタンは写真下のクリームへ。 */
  .about__overlay { margin-top: -47%; padding: 0 20px 44px; position: relative; z-index: 2; }
  .about__en { font-size: 38px; }
  .about__ja { font-size: 13px; }
  .about__body { margin-top: 0; }
  .about__heading p { font-size: 30px; line-height: 1.6; }
  .about__subtext { margin-top: 20px; }
  .about__subtext p { font-size: 16px; line-height: 1.9; }
  .about__subtext p br { display: none; }             /* モバイルは自然折り返し */
  .about__btn { width: 100%; max-width: none; margin-inline: 0; padding: 20px 24px; }
}

/* =========================================================
   ③ News（お知らせ）Figma 2268:6698 / 6788 / 6655 / 6784
   左=英日ラベル＋縦カテゴリタブ、右=最新記事リスト＋一覧ボタン。
   コンテンツ幅1312（左右128／セクション内）。
   ========================================================= */
.topnews { background: #fff; }
.topnews__inner {
  max-width: 1312px;
  margin-inline: auto;
  padding-inline: 24px;
  display: flex;
  gap: 110px;
  box-sizing: border-box;
}

/* 左：ラベル＋フィルタ＋イラスト（flex-column で最下部にイラストを配置） */
.topnews__aside { flex-shrink: 0; width: 242px; display: flex; flex-direction: column; }
.topnews__en {
  margin: 0;
  font-family: "Cormorant Garamond", serif;
  font-weight: 500;
  font-size: 80px;
  line-height: 1;
  color: #412a00;
  text-transform: capitalize;
}
.topnews__ja {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 20px;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 1.3;
  letter-spacing: 0.72px;
  color: #412a00;
}
.topnews__ja-bar { width: 24px; height: 1px; background: #412a00; flex-shrink: 0; }

.topnews__filter {
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.topnews__tab {
  width: 100%;
  padding: 20px 24px;
  border: 1px solid #fdf8ec;
  border-radius: 40px;
  background: #fff;
  color: #412a00;
  font-family: var(--est-font);
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 0.28px;
  text-align: center;
  cursor: pointer;
  box-shadow: 0 10px 5px rgba(175, 114, 0, 0.1);
  transition: background-color 0.25s ease, color 0.25s ease,
              box-shadow 0.25s ease, transform 0.25s ease;
}
.topnews__tab.is-active {
  background: #412a00;
  color: #fff;
  font-weight: 700;
  letter-spacing: normal;
  box-shadow: 0 2px 5px rgba(175, 114, 0, 0.1);
}
/* hover：わずかに浮き上がり＋影を強調（非アクティブ） */
.topnews__tab:hover {
  background: #f6f1e6;
  transform: translateY(-2px);
  box-shadow: 0 14px 12px rgba(175, 114, 0, 0.18);
}
.topnews__tab:active { transform: translateY(0); box-shadow: 0 6px 5px rgba(175, 114, 0, 0.12); }
.topnews__tab.is-active:hover { background: #412a00; transform: translateY(-2px); box-shadow: 0 8px 10px rgba(65, 42, 0, 0.22); }
@media (prefers-reduced-motion: reduce) {
  .topnews__tab { transition: background-color 0.25s ease, color 0.25s ease; }
  .topnews__tab:hover, .topnews__tab.is-active:hover, .topnews__tab:active { transform: none; }
}

/* 装飾イラスト（椅子＋観葉植物）Figma 2268:6711。
   margin-top:auto で aside の最下部へ（記事リストが高い時はリスト下端に揃う）。 */
.topnews__illust {
  margin-top: auto;      /* 下寄せ */
  align-self: flex-start;
  width: 207px;
  height: auto;
  padding-top: 48px;     /* タブとの最低間隔 */
}

/* 右：記事リスト */
.topnews__main { flex: 1; min-width: 0; margin-top: 70px; }
/* カテゴリ切替時のフェード（JSで is-fading をトグル） */
.topnews__list { list-style: none; margin: 0; padding: 0; transition: opacity 0.26s ease; }
.topnews__list.is-fading { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  .topnews__list { transition: none; }
}
.topnews__item {
  padding: 24px 0;
  border-bottom: 1px solid #e0e0e0;
}
.topnews__item:first-child { padding-top: 8px; }
.topnews__item--empty { color: #999; font-family: var(--est-font); font-size: 16px; }
.topnews__meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.topnews__date {
  flex-shrink: 0;
  width: 106px;
  font-family: var(--est-font);
  font-weight: 500;
  font-size: 14px;
  color: #999;
}
.topnews__badge {
  display: inline-flex;
  align-items: center;
  padding: 6px 16px;
  border: 1px solid #d4d4d4;
  border-radius: 6px;
  font-family: var(--est-font);
  font-weight: 400;
  font-size: 14px;
  color: #333;
  white-space: nowrap;
}
.topnews__title {
  display: block;
  font-family: var(--est-font);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  color: #333;
  text-decoration: none;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: color 0.2s ease;
}
.body-container-wrapper .topnews__title,
.body-container-wrapper .topnews__title:visited { color: #333; text-decoration: none; }
.body-container-wrapper .topnews__title:hover,
.topnews__title:hover { color: #488462; }

.topnews__empty-msg { margin: 24px 0 0; color: #999; font-family: var(--est-font); font-size: 16px; }

.topnews__more { margin-top: 48px; display: flex; justify-content: flex-start; }
.topnews__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  width: 352px;
  max-width: 100%;
  padding: 24px;
  background: #488462;
  border: 1px solid #fdf8ec;
  border-radius: 40px;
  color: #fff;
  font-family: var(--est-font);
  font-weight: 700;
  font-size: 18px;
  text-decoration: none;
  box-sizing: border-box;
  box-shadow: 0 10px 5px rgba(175, 114, 0, 0.1);
  transition: background-color 0.2s ease;
}
.topnews__btn:hover { background: #2a6141; }
.topnews__btn-arrow {
  width: 5px; height: 10px; flex-shrink: 0;
  background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0.6 0.6L4.4 5L0.6 9.4' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0.6 0.6L4.4 5L0.6 9.4' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
}
.body-container-wrapper .topnews__btn,
.body-container-wrapper .topnews__btn:hover,
.body-container-wrapper .topnews__btn:visited { color: #fff; text-decoration: none; font-weight: 700; }

/* ---- News タブレット/モバイル（縦積み）: 順序を 見出し→タブ→リスト→ボタン→イラスト に。
   イラストは aside 内にあるため、aside を display:contents で解体して inner の直接フレックス子にし、
   order でイラストを最下部（ボタンの下）へ移動する（Figma SP 2268:7016 準拠）。 ---- */
@media screen and (max-width: 999px) {
  .topnews__inner { flex-direction: column; gap: 40px; }
  .topnews__aside { display: contents; }
  .topnews__head { order: 1; }
  .topnews__filter { order: 2; margin-top: 0; flex-direction: row; flex-wrap: wrap; }
  .topnews__main { order: 3; margin-top: 0; }
  .topnews__illust {                 /* 最下部（ボタンの下） */
    order: 4;
    margin-top: 0;
    align-self: flex-start;
    width: 180px;
    padding-top: 0;
  }
  .topnews__tab { width: auto; flex: 0 0 auto; padding: 12px 24px; }
  .topnews__en { font-size: 56px; }
}
/* ---- News モバイル（Figma SP 2270:22360 タブ2×2 / ボタン中央 / イラスト最下部 2270:22283） ---- */
@media screen and (max-width: 500px) {
  .topnews__en { font-size: 40px; }
  /* タブは2列グリッド（SP準拠） */
  .topnews__filter { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .topnews__tab { width: auto; padding: 14px 12px; font-size: 13px; text-align: center; }
  .topnews__date { width: 100%; }
  .topnews__meta { margin-bottom: 12px; }
  .topnews__more { justify-content: center; }   /* ボタン中央（SP準拠） */
  .topnews__btn { width: 293px; max-width: 100%; }
  .topnews__illust { width: 124px; align-self: flex-start; }  /* SP 2270:22283: 124px・左寄せ・最下部 */
}

/* =========================================================
   ④ Properties（物件情報）Figma 2268:6620 / 6525 / 6616
   見出し（左）＋物件カード横スライダー（左右矢印）＋全件ボタン。
   ========================================================= */
/* モジュール途中〜下＝クリーム背景（下の売却相談CTAへ連続）。上方向はフェードイン。
   装飾イラスト（街並み/葉/家具）を敷き、カルーセルのカードはその上に乗る。 */
.props {
  background: transparent;
  position: relative;
  z-index: 1;
  overflow: hidden;
  padding-top: 200px;     /* お知らせ(News)との間隔（デザイン準拠・上に街並みイラスト） */
  padding-bottom: 100px;  /* ボタンの影の余白＋CTAへの間隔（overflow:hiddenで切れないように） */
}
.props::before {
  content: "";
  position: absolute;
  left: 0; right: 0;
  bottom: 0;
  height: 54%;         /* 下端基準：カルーセル下半分〜下を cream に（上端はフェードイン。padding変化に強い） */
  background: linear-gradient(to bottom, rgba(253, 248, 236, 0) 0, #fdf8ec 180px);
  z-index: -1;
  pointer-events: none;
}
/* 装飾イラスト層（クリームの上・カードの下） */
.props__decor { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.props__il { position: absolute; display: block; height: auto; }
.props__il--town { top: 0; right: 0; width: 69.5%; max-width: 1090px; }      /* 右上=街並み＋葉 */
.props__il--leaf { bottom: 0; left: 0; width: 29.6%; max-width: 464px; }      /* 左下=葉（ブラウザ左端に密着） */
.props__il--furniture { bottom: 56px; right: 8%; width: 15%; max-width: 236px; } /* 右下=家具（ボタン中心よりやや下・デザイン準拠） */

.props__inner {
  max-width: 1312px;
  margin-inline: auto;
  padding-inline: 24px;
  box-sizing: border-box;
}
.props__head { display: flex; flex-direction: column; gap: 20px; }
.props__en {
  margin: 0;
  font-family: "Cormorant Garamond", serif;
  font-weight: 500;
  font-size: 80px;
  line-height: 1;
  color: #412a00;
  text-transform: capitalize;
}
.props__ja {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 1.3;
  letter-spacing: 0.72px;
  color: #412a00;
}
.props__ja-bar { width: 24px; height: 1px; background: #412a00; flex-shrink: 0; }

/* スライダー（センターモード：中央カード拡大・左右対称ピーク） */
.props__slider {
  position: relative;
  margin-top: 40px;
  --card-w: 352px;
  --active-w: 422px;
  --gap: 32px;
}
.props__viewport { overflow: hidden; width: 100%; }
.props__track {
  display: flex;
  align-items: center;    /* 中央カードが上下に伸び、両隣は縦中央 */
  gap: var(--gap);
  padding-block: 40px;    /* カード影の余白（viewportのoverflow:hiddenで縦も切れるため影分を確保） */
  transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: transform;
}
/* ループの継ぎ目補正（クローン→実カードへの即ジャンプ）中はアニメーションを止める */
.props--no-anim .props__track,
.props--no-anim .props__card { transition: none !important; }

.props__card {
  flex: 0 0 var(--card-w);
  width: var(--card-w);
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(25, 59, 16, 0.2);
  overflow: hidden;
  text-decoration: none;
  cursor: pointer;
  transition: width 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.3s ease;
}
.props__card:hover { box-shadow: 0 6px 16px rgba(25, 59, 16, 0.28); }
.props__card.is-active {
  flex-basis: var(--active-w);
  width: var(--active-w);
  z-index: 2;
  box-shadow: 0 8px 26px rgba(25, 59, 16, 0.3);
}
/* 中央（ピックアップ）カードは物件名・価格を大きく（Figma中央カード: 名前20px / 価格50px。万円・住所・種別は共通） */
.props__card.is-active .props__card-name { font-size: 20px; }
.props__card.is-active .props__card-price-num { font-size: 50px; }
.props__card-media {
  position: relative;
  width: 100%;
  aspect-ratio: 352 / 235;
  background: #e9ece9;
  overflow: hidden;
}
.props__card-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.props__card-noimg { display: block; width: 100%; height: 100%; background: #dfe3df; }
.props__card-body { padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.props__card-head { display: flex; flex-direction: column; gap: 5px; }
.props__card-name {
  margin: 0;
  font-family: var(--est-font);
  font-weight: 500;
  font-size: 18px;
  line-height: 1.3;
  letter-spacing: -0.025em;
  color: #0a0a0a;
}
/* 価格：未入力カードでも高さが揃うよう最小高さを確保（縦揺れ防止） */
.props__card-price { margin: 0; min-height: 48px; display: flex; align-items: baseline; color: #0a0a0a; font-family: var(--est-font); font-weight: 500; line-height: 1.2; }
.props__card.is-active .props__card-price { min-height: 60px; }
.props__card-price-num { font-size: 40px; }
.props__card-price-unit { font-size: 20px; }
/* 価格未定フォールバック（大きな空白を出さない控えめ表示） */
.props__card-price-tbd { font-size: 20px; font-weight: 500; color: #6b7280; }
.props__card-addr {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--est-font);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: #4a5565;
}
.props__card-addr-icon { width: 16px; height: 16px; flex-shrink: 0; }
.props__card-type {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  align-self: flex-start;
  padding: 4px 12px;
  background: rgba(72, 132, 99, 0.1);
  border-radius: 999px;
  font-family: var(--est-font);
  font-weight: 400;
  font-size: 14px;
  color: #488463;
}
.props__card-type-icon { width: 12px; height: 12px; flex-shrink: 0; }

/* 左右ナビ矢印（丸ボタン） */
.props__nav {
  position: absolute;
  top: calc(var(--active-w) * 235 / 352 / 2 + 40px); /* 中央カード画像の中央（上パディング40px考慮） */
  transform: translateY(-50%);
  z-index: 3;
  width: 48px; height: 48px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 10px rgba(25, 59, 16, 0.2);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s ease;
}
.props__nav:hover { background: #f2f5f0; }
.props__nav--prev { left: max(24px, calc((100% - 1360px) / 2)); }
.props__nav--next { right: max(24px, calc((100% - 1360px) / 2)); }
.props__nav[disabled] { opacity: 0.35; cursor: default; pointer-events: none; }
.props__nav-arrow { width: 9px; height: 9px; border-top: 2px solid #412a00; border-right: 2px solid #412a00; }
.props__nav--prev .props__nav-arrow { transform: translateX(2px) rotate(-135deg); }
.props__nav--next .props__nav-arrow { transform: translateX(-2px) rotate(45deg); }

.props__empty { color: #999; font-family: var(--est-font); font-size: 16px; }

.props__more { margin-top: 48px; display: flex; justify-content: center; }
.props__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  width: 352px;
  max-width: calc(100% - 48px);
  padding: 24px;
  background: #488462;
  border: 1px solid #fdf8ec;
  border-radius: 40px;
  color: #fff;
  font-family: var(--est-font);
  font-weight: 700;
  font-size: 18px;
  text-decoration: none;
  box-sizing: border-box;
  box-shadow: 0 10px 5px rgba(175, 114, 0, 0.1);
  transition: background-color 0.2s ease;
}
.props__btn:hover { background: #2a6141; }
.props__btn-arrow {
  width: 5px; height: 10px; flex-shrink: 0;
  background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0.6 0.6L4.4 5L0.6 9.4' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0.6 0.6L4.4 5L0.6 9.4' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
}
/* テーマの .body-container-wrapper a:hover(0,2,1) に勝つよう .props を足して(0,3,1)、
   hover/focus でも下線を出さない */
.body-container-wrapper .props .props__card,
.body-container-wrapper .props .props__card:hover,
.body-container-wrapper .props .props__card:focus,
.body-container-wrapper .props .props__card:visited { text-decoration: none; }
.body-container-wrapper .props__btn,
.body-container-wrapper .props__btn:hover,
.body-container-wrapper .props__btn:visited { color: #fff; text-decoration: none; font-weight: 700; }

/* ドットページネーション（PCは非表示・モバイルで表示） */
.props__dots { display: none; justify-content: center; gap: 10px; margin-top: 24px; }
/* ページングドット（SP設計 2273:29840 準拠）: 非アクティブ=緑の輪郭のみ / アクティブ=緑の塗り */
.props__dot {
  width: 10px; height: 10px; padding: 0;
  border: 1.5px solid #488462;
  border-radius: 50%;
  background: transparent;
  box-sizing: border-box;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.props__dot.is-active { background: #488462; }

/* ---- Properties タブレット ---- */
@media screen and (max-width: 999px) {
  .props { padding-top: 140px; padding-bottom: 80px; } /* News間隔（タブレット） */
  .props__en { font-size: 56px; }
  .props__slider { --card-w: 300px; --active-w: 360px; --gap: 24px; }
  .props__nav--prev { left: 16px; }
  .props__nav--next { right: 16px; }
}
/* ---- Properties モバイル（矢印非表示＋ドット＋スワイプ操作） ---- */
@media screen and (max-width: 500px) {
  .props { padding-top: 96px; padding-bottom: 180px; } /* 上=News間隔 / 下=家具イラスト＋ボタンとの余白 */
  .props::before { height: 84%; }   /* モバイルは見出し付近からクリーム */
  .props__en { font-size: 40px; }
  .props__slider { --card-w: 240px; --active-w: 280px; --gap: 16px; }
  .props__nav { display: none; }    /* モバイルは矢印非表示（ドット＋スワイプ） */
  .props__dots { display: flex; margin-top: 0; }
  .props__more { margin-top: 24px; } /* ドット→ボタンの余白を詰める（SP設計準拠） */
  .props__btn { width: 100%; }
  /* 装飾（モバイル）: 街並みは見出しの下・フル幅の帯で、下端がカード上部に重なる（SP設計 2273:29833 準拠） */
  .props__il--town { width: 100%; left: 0; right: auto; top: 32vw; }
  .props__il--leaf { display: none; }              /* 左下の葉は非表示 */
  .props__il--furniture {                          /* 家具はボタン下・右寄せ（デザイン: 幅236/右端20px） */
    width: 63%; max-width: 236px; left: auto; right: 20px;
    transform: none; bottom: 24px;
  }
}

/* =========================================================
   ⑤ 不動産売却相談CTA（Figma 2268:1139 / 1142）
   背景=カード枠＋相談イラスト＋4バッジ＋葉の合成1枚画像（テキストなし）に、
   左のクリーム領域へ リード・見出し・説明・ボタンを重ねる。
   位置=%・文字/余白=cqw で画像(1313×525)と等比スケール。
   ========================================================= */
/* セクション背景はクリーム（Figma Rectangle375 #fdf8ec）。
   カード画像の枠外もクリームに塗替え済みで馴染む。
   下端はフッターとの間に余白を確保（Figma: CTA下端〜フッターで約100px）。 */
.cta { background: #fdf8ec; padding-top: 40px; padding-bottom: 100px; }
@media screen and (max-width: 999px) { .cta { padding-bottom: 64px; } }
@media screen and (max-width: 500px) { .cta { padding-bottom: 48px; } }
.cta__inner {
  position: relative;
  max-width: 1313px;
  margin-inline: auto;
  container-type: inline-size;
}
.cta__bg { display: block; width: 100%; height: auto; }
/* モバイル専用要素（イラスト・四隅の葉）はデスクトップでは非表示 */
.cta__illust,
.cta__leaf { display: none; }
.cta__lead-row { display: flex; align-items: center; justify-content: center; gap: 1.1cqw; }
/* 「はじめての」左右の葉飾り（Figma 2268:1146 / 1186・各約55px）＝デスクトップも表示 */
.cta__sprig { display: block; width: 4.4cqw; height: auto; flex-shrink: 0; }
.cta__sprig--l { transform: scaleX(-1) rotate(135.34deg); }  /* 右の水平ミラー */
.cta__sprig--r { transform: rotate(135.34deg); }
/* テキスト（カード左のクリーム領域に重ねる・中央寄せ） */
.cta__overlay {
  position: absolute;
  top: 21.7%;    /* 114 / 525 */
  left: 10.4%;   /* 137 / 1313 */
  width: 36.2%;  /* 475 / 1313 */
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.cta__head { display: flex; flex-direction: column; align-items: center; }
.cta__lead {
  margin: 0;
  font-family: "Noto Serif JP", serif;
  font-weight: 700;
  font-size: 3.81cqw;   /* 50px @1313 */
  line-height: 1.3;
  letter-spacing: 0.05em;
  color: #488462;
  white-space: nowrap;
}
.cta__title {
  margin: 0.2cqw 0 0;
  font-family: "Noto Serif JP", serif;
  font-weight: 700;
  font-size: 4.57cqw;   /* 60px */
  line-height: 1.3;
  letter-spacing: 0.05em;
  color: #412a00;
  white-space: nowrap;
}
.cta__desc { margin-top: 1.52cqw; }  /* 20px */
.cta__desc p {
  margin: 0;
  font-family: var(--est-font);
  font-weight: 500;
  font-size: 1.22cqw;   /* 16px */
  line-height: 1.8;
  letter-spacing: 0.06em;
  color: #333;
}
.cta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.22cqw;
  width: 22.1cqw;       /* 290px */
  margin-top: 2.44cqw;  /* 32px */
  padding: 1.83cqw;     /* 24px */
  background: #488462;
  border: 1px solid #fdf8ec;
  border-radius: 3.05cqw;
  color: #fff;
  font-family: var(--est-font);
  font-weight: 700;
  font-size: 1.37cqw;   /* 18px */
  text-decoration: none;
  box-sizing: border-box;
  box-shadow: 0 10px 5px rgba(175, 114, 0, 0.1);
  transition: background-color 0.2s ease;
}
.cta__btn:hover { background: #2a6141; }
.cta__btn-arrow {
  width: 0.38cqw; min-width: 4px; height: 0.76cqw; min-height: 8px; flex-shrink: 0;
  background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0.6 0.6L4.4 5L0.6 9.4' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0.6 0.6L4.4 5L0.6 9.4' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
}
.body-container-wrapper .cta__btn,
.body-container-wrapper .cta__btn:hover,
.body-container-wrapper .cta__btn:visited { color: #fff; text-decoration: none; font-weight: 700; }

/* ==== 不動産売却相談CTA モバイル：縦型カード（Figma SP 2273:29847） ====
   デスクトップの横長合成画像＋左オーバーレイをやめ、
   カード枠＋見出し＋イラスト（4バッジ入り）＋説明＋ボタンを縦積みする。 */
@media screen and (max-width: 500px) {
  /* MONJI#16: 左右余白を20pxに縮め、カードをできるだけ大きく（要素が多く小さく感じる指摘）。
     四隅の葉飾りが画面外へはみ出すため overflow-x: clip で横スクロールを防止 */
  .cta { padding: 40px 20px 48px; overflow-x: clip; }

  /* デスクトップ合成画像は隠し、カードを組み立てる */
  .cta__bg { display: none; }

  .cta__inner {
    max-width: none;             /* MONJI#16: 上限を外し余白20pxの範囲いっぱいに広げる */
    margin-inline: auto;
    container-type: normal;      /* cqw を無効化 */
    /* 枠内は左→右のグラデ（Figma Rectangle431: 白43%→薄クリーム90%） */
    background: linear-gradient(94deg, #ffffff 43%, #fcf9df 90%);
    border: 2px solid #a76c00;
    box-shadow: 0 10px 10px rgba(175, 114, 0, 0.1);
    overflow: visible;           /* 四隅の葉がカード外にはみ出す */
    box-sizing: border-box;
  }
  /* 内側の二重枠（Figma Rectangle431: 2px #af7200） */
  .cta__inner::before {
    content: "";
    position: absolute;
    inset: 6px;
    border: 2px solid #af7200;
    pointer-events: none;
    z-index: 1;
  }

  /* オーバーレイ→カード内フローに */
  .cta__overlay {
    position: static;
    width: auto;
    padding: 40px 20px 40px;
    z-index: 2;                  /* 二重枠より前面 */
  }

  /* 見出し（はじめての＋葉飾り／不動産売却相談） */
  .cta__lead-row { gap: 8px; }
  .cta__sprig { width: 34px; }  /* モバイルはcqw無効のため固定幅（回転は共通ルール） */
  .cta__lead { font-size: 24px; line-height: 1.3; letter-spacing: 0.05em; }
  .cta__title { font-size: clamp(28px, 9.3vw, 36px); margin-top: 4px; line-height: 1.3; letter-spacing: 0.05em; }

  /* 相談イラスト＋4バッジ（MONJI#16: カード拡大に合わせてイラストも大きく） */
  .cta__illust { display: block; width: 100%; max-width: 360px; height: auto; margin: 24px auto 0; }

  /* 説明・ボタン（幅を絞り改行を整える／Figmaは4行） */
  .cta__desc { margin-top: 24px; max-width: 220px; margin-inline: auto; }
  .cta__desc p { font-size: 12px; line-height: 1.8; letter-spacing: 0.06em; }
  .cta__btn {
    width: 182px; margin-top: 20px; padding: 14px; gap: 10px;
    border-radius: 25px; font-size: 12px;
    box-shadow: 0 6px 3px rgba(175, 114, 0, 0.1);
  }
  .cta__btn-arrow { width: 4px; min-width: 4px; height: 8px; min-height: 8px; }

  /* 四隅の葉飾り（カード外にはみ出す） */
  .cta__leaf { display: block; position: absolute; z-index: 3; height: auto; }
  .cta__leaf--tr { top: -24px; right: -14px; width: 58px; }
  .cta__leaf--bl { left: -16px; bottom: -18px; width: 64px; }
}

/* =========================================================
   スクロールリビール（共通ユーティリティ）
   .est-reveal を付けた要素を、ビューポート進入時に下→上へフェードイン。
   JS(estate.js)が html要素 に .est-anim を付与して初めて初期非表示が有効化される
   ＝ JS無効/未対応時やアニメOFF時は常に表示（コンテンツが隠れない）。
   ========================================================= */
.est-anim .est-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 2.0s cubic-bezier(0.2, 0.6, 0.2, 1),
              transform 2.0s cubic-bezier(0.2, 0.6, 0.2, 1);
  will-change: opacity, transform;
}
.est-anim .est-reveal.is-inview {
  opacity: 1;
  transform: none;
}
/* モーション低減設定時はアニメを無効化（常に表示） */
@media (prefers-reduced-motion: reduce) {
  .est-anim .est-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
/* =========================================================
   事業紹介ページ（estateセグメント）
   Figma: PC 1567:3665 / SP 1954:6177
   構成: 標準ヒーロー(page-hero) → 導入(3事業ダイアグラム)
         → 不動産事業 / ゴルフ施設運営 / 環境事業（各: タイトル+写真+ボタン
         +Messageボックス+h3+特徴/サービス+事業所カード）
   ========================================================= */

/* ---- カラー / 共通 ---- */
.est-page--business {
  --biz-brown: #412a00;
  --biz-text: #333;
  --biz-green: #488462;
  --biz-gold: #af7200;
  --biz-cream: #fdf8ec;
  --biz-line: #d4d4d4;
  color: var(--biz-text);
  font-family: "Noto Sans JP", sans-serif;
}
.biz-wrap { max-width: 1120px; margin-inline: auto; padding-inline: 24px; box-sizing: border-box; }

/* ---- 写真プレースホルダー（未支給） ---- */
.biz-photo--ph {
  background: #e9e6df;
  display: flex; align-items: center; justify-content: center;
  color: #9b9689; font-size: 13px; text-align: center;
  border-radius: 4px;
}

/* =========================================================
   導入：3事業ダイアグラム
   ========================================================= */
.biz-intro { padding: 72px 0; }
.biz-intro__grid {
  display: grid; grid-template-columns: 450px 1fr; gap: 70px; align-items: center;
}
.biz-intro__title {
  margin: 0;
  font-family: "Noto Serif JP", serif; font-weight: 500;
  font-size: 31px; line-height: 1.7; letter-spacing: 0.04em; color: var(--biz-brown);
  white-space: nowrap; /* 各行は改行(br)のみで折り返さない（デザイン通り3行） */
}
.biz-intro__lead {
  margin: 40px 0 0;
  font-size: 16px; line-height: 2; color: var(--biz-text);
}

/* ダイアグラム：3つの白い円（重なり＋外側ソフトシャドウ）＋アイコン＋ESTATE SEGMENT
   円＋影は Figma 書き出しのSVG画像（PC=横3連 biz-circles.svg／モバイル=三角 biz-circles-sp.svg）を
   背面 <img> として敷き、アイコン/ラベルを円中心に%絶対配置で重ねる。画像はモジュールから差替可。 */
.biz-diagram { display: flex; flex-direction: column; align-items: center; gap: 30px; }
/* PC：円エリア600×213.75。影は画像側にはみ出す */
.biz-diagram__circles { position: relative; width: 600px; max-width: 100%; aspect-ratio: 600 / 213.75; margin-inline: auto; }
/* 背面の円画像（影ぶん大きく、中央基準ではみ出す） */
.biz-diagram__bg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: auto; z-index: 0; pointer-events: none; }
.biz-diagram__bg--pc { width: 125.16%; }            /* 750.941 / 600 */
.biz-diagram__bg--sp { display: none; }
/* アイコン＋ラベル（円中心に絶対配置） */
.biz-diagram__item {
  position: absolute; top: 50%; transform: translate(-50%, -50%); z-index: 1;
  width: 213.75px; height: 213.75px; background: transparent;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
}
.biz-diagram__item--1 { left: 17.81%; }             /* 106.875 / 600 */
.biz-diagram__item--2 { left: 50%; }
.biz-diagram__item--3 { left: 82.19%; }             /* 493.125 / 600 */
.biz-diagram__icon { color: var(--biz-gold); display: block; }
.biz-diagram__icon img { display: block; width: auto; height: 66px; object-fit: contain; }
.biz-diagram__item--1 .biz-diagram__icon img { height: 71px; }
.biz-diagram__item--3 .biz-diagram__icon img { height: 62px; }
.biz-diagram__label { font-weight: 600; font-size: 18px; line-height: 1.3; color: var(--biz-text); }
.biz-diagram__seg {
  display: flex; align-items: center; justify-content: center; gap: 30px; margin: 0;
  font-family: "Oswald", sans-serif; font-weight: 700; font-size: 40px; letter-spacing: 0.01em;
  color: var(--biz-green);
}
/* 横線はグリーン（MONJI #1/#3：茶→緑 #488462） */
.biz-diagram__segline { width: 60px; height: 1px; background: var(--biz-green); display: block; }

/* =========================================================
   事業セクション 共通
   ========================================================= */
.biz-sec { padding: 80px 0; }
.biz-sec--cream { background: rgba(253, 248, 236, 0.5); }

/* セクション上部：左（見出し＋補足）／右（写真544×362）
   要素は 見出し(.biz-title) → 写真(.biz-sec__photo) → 補足(.biz-sec__headL) の順で並ぶ（DOM順）。
   PCは grid で「左カラム＝見出し(上)＋補足(下)／右カラム＝写真(2行ぶち抜き)」に配置。 */
.biz-sec__head {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 544px);
  grid-template-rows: auto auto;
  column-gap: 40px; row-gap: 0; align-items: start;
}
.biz-title    { grid-column: 1; grid-row: 1; }
.biz-sec__headL { grid-column: 1; grid-row: 2; min-width: 0; }
.biz-sec__photo { grid-column: 2; grid-row: 1 / span 2; align-self: start;
  width: 100%; aspect-ratio: 544 / 362; border-radius: 20px; overflow: hidden; }

/* タイトル：茶円アイコン＋2段見出し */
.biz-title { display: flex; align-items: center; gap: 20px; }
.biz-title__badge {
  width: 100px; height: 100px; border-radius: 50%; background: var(--biz-brown);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
/* アイコンは白（maskで着色＝外部SVGのcurrentColorに依存しない） */
.biz-title__ic {
  display: block; width: 52px; height: 48px; background-color: #fff;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-size: contain; mask-size: contain;
}
.biz-title__text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.biz-title__eyebrow { font-weight: 700; font-size: 20px; line-height: 1.3; color: var(--biz-brown); }
.biz-title__main { font-family: "Noto Serif JP", serif; font-weight: 700; font-size: 40px; line-height: 1.3; color: var(--biz-brown); }

.biz-sec__h4 { margin: 20px 0 0; font-weight: 500; font-size: 26px; line-height: 1.3; color: var(--biz-text); }
.biz-sec__desc { margin: 20px 0 0; font-size: 16px; line-height: 2; color: var(--biz-text); }
/* リッチテキスト内 <p> にテーマ既定の p スタイル（font-size:1rem・margin）が効くのを打ち消す */
.biz-sec__desc p { margin: 0; font-size: 16px; line-height: 2; color: var(--biz-text); }
.biz-sec__desc p + p { margin-top: 1em; }

/* ボタン（セグメントカラー塗り・白ボーダー/白文字/白矢印・角丸40・影）
   ・背景色は module.html のインラインstyleでセグメント色を指定（不動産#97CFCE/ゴルフ#E9B5B5等）。 */
.biz-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; margin-top: 24px; }
.est-page--business .biz-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 16px;
  min-width: 355px; box-sizing: border-box; padding: 24px 40px;
  background: #97cfce; border: 1px solid #fff; color: #fff; border-radius: 40px;
  font-size: 18px; font-weight: 700; line-height: 1.5; text-decoration: none;
  box-shadow: 0 10px 5px rgba(175, 114, 0, 0.1);
  transition: opacity .2s ease;
}
.est-page--business .biz-btn:hover { color: #fff; opacity: 0.88; }
.est-page--business .biz-btn::after {
  content: ""; flex-shrink: 0; width: 5px; height: 10px; background-color: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='11' viewBox='0 0 6 11'%3E%3Cpath d='M0.5 0.5l5 5-5 5' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='11' viewBox='0 0 6 11'%3E%3Cpath d='M0.5 0.5l5 5-5 5' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* =========================================================
   Messageボックス（Message手書きラベル＋小枝＋線／下ボーダーのみ）
   ========================================================= */
.biz-message {
  position: relative; margin-top: 60px;
  background: #fff; border-bottom: 1px solid var(--biz-brown);
  padding: 32px 40px;
}
/* セクション全体が白背景（クリームでない）のときは、Messageボックスに色をつけて
   パネルとして見えるようにする（MONJI #2：全体背景が白い時はこちらにも色を） */
.biz-sec:not(.biz-sec--cream) .biz-message { background: rgba(253, 248, 236, 0.3); }
.biz-message__label {
  position: absolute; top: -18px; left: 20px; width: calc(100% - 20px);
  display: flex; align-items: center; gap: 8px;
}
.biz-message__word { display: block; height: 24px; width: auto; }
.biz-message__sprig { display: block; height: 26px; width: auto; }
.biz-message__label::after { content: ""; flex: 1; height: 1px; background: var(--biz-brown); margin-left: 8px; }
.biz-message__body p { margin: 0; font-size: 16px; line-height: 2; color: var(--biz-text); }

/* =========================================================
   h3（クリーム帯・下線）／サービスタグ
   ========================================================= */
.biz-h3 {
  margin: 60px 0 24px;
  background: var(--biz-cream); border-bottom: 1px solid var(--biz-brown);
  padding: 20px; font-weight: 500; font-size: 26px; line-height: 1.3; color: var(--biz-text);
}
.biz-tags { margin: 0; font-size: 16px; line-height: 2; color: var(--biz-text); }

/* =========================================================
   特徴（ゴルフ：円写真＋テキスト 2×2）
   ========================================================= */
.biz-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; margin-top: 24px; }
.biz-feature { display: flex; gap: 16px; align-items: flex-start; }
.biz-feature__circle { width: 200px; height: 200px; border-radius: 50%; flex-shrink: 0; }
.biz-feature__body { flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 10px 0; }
.biz-feature__title {
  margin: 0; padding: 10px; text-align: center;
  font-weight: 700; font-size: 18px; line-height: 1.3; color: var(--biz-brown);
  border-bottom: 1px dashed var(--biz-brown);
}
.biz-feature__sub { display: block; font-size: 14px; }
.biz-feature__list { margin: 0; padding: 10px 0 10px 24px; }
.biz-feature__list li { font-size: 16px; line-height: 1.8; color: var(--biz-text); list-style: disc; }

/* =========================================================
   事業所・お問い合わせ先カード
   ========================================================= */
/* 事業所カードは角丸10px（overflow:hidden で角タブ/ヘッダーを丸角にクリップ）。
   タブは角丸解除＝直角（MONJI #7 3箇所／#11） */
.biz-office { margin-top: 56px; background: #fff; border: 1px solid var(--biz-brown); border-radius: 10px; overflow: hidden; }
.biz-office__tab {
  display: inline-block; margin: 0;
  background: var(--biz-brown); color: #fff; padding: 10px 30px;
  border-radius: 0; font-weight: 500; font-size: 18px; line-height: 1.3;
}
.biz-office__body {
  display: grid; grid-template-columns: minmax(0, 1fr) 408px; gap: 32px;
  padding: 24px 40px 40px;
}
.biz-office__left { min-width: 0; }
.biz-office__name { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; }
.biz-office__name-txt p { margin: 0; font-weight: 700; font-size: 18px; line-height: 1.5; color: #000; }
.biz-office__corp { font-size: 22px !important; }
.biz-office__sns { flex-shrink: 0; display: flex; align-items: center; gap: 12px; }
.biz-office__sns-ic { display: block; width: 30px; height: 30px; line-height: 0; }
.biz-office__sns-ic img { display: block; width: 30px; height: 30px; }
.biz-office__imgs { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 280px); gap: 20px; margin-top: 20px; }
.biz-office__img { height: 224px; border-radius: 0; overflow: hidden; background-size: cover; background-position: center; }
.biz-office__map iframe { display: block; width: 100%; height: 100%; border: 0; }
.biz-office__table { margin: 0; }
.biz-office__row {
  display: flex; gap: 10px; padding: 10px; border-bottom: 1px solid var(--biz-line);
  font-size: 16px; color: var(--biz-text);
}
.biz-office__row:first-child { border-top: 1px solid var(--biz-line); }
.biz-office__row dt { width: 120px; flex-shrink: 0; line-height: 1.5; font-weight: 400; }
.biz-office__row dd { flex: 1; min-width: 0; margin: 0; line-height: 1.5; }
/* 電話番号のTELリンク：既定の青を打ち消し本文色を継承（スマホはタップで発信） */
.biz-office__tel { color: inherit; text-decoration: none; }
.biz-office__tel:hover { text-decoration: underline; }
/* お問い合わせフォームのリンク：既定の青を打ち消し本文色を継承 */
.biz-office__contact { color: inherit; text-decoration: underline; }
.biz-office__contact:hover { text-decoration: none; }
.biz-office__license { margin: 0; padding: 10px; font-size: 14px; line-height: 1.5; color: var(--biz-text); }

/* =========================================================
   タブレット（≤999px）
   ========================================================= */
@media screen and (max-width: 999px) {
  .biz-intro { padding: 56px 0; }
  .biz-intro__grid { grid-template-columns: 1fr; gap: 40px; }
  .biz-intro__title { font-size: 26px; }
  .biz-diagram__seg { font-size: 32px; }

  .biz-sec { padding: 60px 0; }
  .biz-title__main { font-size: 32px; }
  .biz-title__eyebrow { font-size: 17px; }
  .biz-sec__h4 { font-size: 23px; }
  .biz-h3 { font-size: 23px; }

  /* セクション上部：モバイルと同じく 見出し→画像→補足 の縦積み */
  .biz-sec__head {
    grid-template-columns: 1fr; grid-template-rows: none; row-gap: 24px;
  }
  .biz-title, .biz-sec__headL, .biz-sec__photo { grid-column: auto; grid-row: auto; }
  .biz-sec__headL > :first-child { margin-top: 0; }

  /* ボタン：全幅にせず中央配置 */
  .biz-actions { align-items: center; }
  .est-page--business .biz-btn { width: auto; }

  /* 特徴：モバイルと同じく 1カラム＋右テキスト（円はタブレットのみ大きめ160px） */
  .biz-features { grid-template-columns: 1fr; gap: 20px; }
  .biz-feature { gap: 16px; align-items: center; }
  .biz-feature__circle { width: 160px; height: 160px; }
  .biz-feature__body { padding: 0; }
  .biz-feature__title { text-align: left; padding: 0 0 8px; font-size: 16px; }
  /* リストはタブレットのみ横2列（各50%幅）。flex化で消える●は疑似要素で再現 */
  .biz-feature__list { display: flex; flex-wrap: wrap; padding: 8px 0 0; }
  .biz-feature__list li {
    width: 50%; box-sizing: border-box; padding: 0 12px 0 16px;
    position: relative; list-style: none; font-size: 14px;
  }
  .biz-feature__list li::before {
    content: ""; position: absolute; left: 2px; top: 0.7em;
    width: 5px; height: 5px; border-radius: 50%; background: currentColor;
  }

  .biz-office__body { grid-template-columns: 1fr; gap: 28px; }
}

/* =========================================================
   モバイル（≤500px）
   ========================================================= */
@media screen and (max-width: 500px) {
  .biz-wrap { padding-inline: 20px; }

  /* 導入 */
  .biz-intro { padding: 40px 0; }
  .biz-intro__title { font-size: 22px; }
  .biz-intro__lead { margin-top: 24px; font-size: 15px; }
  .biz-diagram { gap: 20px; }
  /* Figma SP(1978:5572)：円（上）→ ESTATE SEGMENT（下）の縦並び。円は三角配置（上1・下2） */
  .biz-diagram__seg { font-size: 20px; gap: 16px; letter-spacing: 0.04em; }
  .biz-diagram__segline { width: 40px; }
  /* モバイルは三角配置：SP用の円画像（三角）に切替。
     Figma SP(2002:7471)更新版＝3円はほぼ接する程度・各円に個別シャドウ。円エリア252.5×235.5 */
  .biz-diagram__circles { width: 260px; max-width: 100%; aspect-ratio: 252.5 / 235.5; }
  .biz-diagram__bg--pc { display: none; }
  .biz-diagram__bg--sp { display: block; width: 147.52%; }  /* 372.5 / 252.5（影ぶん外側にはみ出す） */
  .biz-diagram__item { width: 128px; height: 128px; }
  .biz-diagram__item--1 { left: 50%;    top: 27.1%; }       /* 不動産：上・中央 */
  .biz-diagram__item--2 { left: 25.25%; top: 72.7%; }       /* ゴルフ：下・左 */
  .biz-diagram__item--3 { left: 74.75%; top: 72.9%; }       /* 環境：下・右 */
  /* アイコン高さは Figma SP 準拠（不動産43.5 / ゴルフ53.5 / 環境45.5） */
  .biz-diagram__icon img { height: 44px; }
  .biz-diagram__item--2 .biz-diagram__icon img { height: 53px; }
  .biz-diagram__item--3 .biz-diagram__icon img { height: 45px; }
  .biz-diagram__label { font-size: 11px; }

  /* セクション：モバイルは 見出し→画像→補足 の順で縦積み（MONJI #8/#9/#10） */
  .biz-sec { padding: 48px 0; }
  .biz-sec__head {
    grid-template-columns: 1fr; grid-template-rows: none; row-gap: 24px;
  }
  .biz-title, .biz-sec__headL, .biz-sec__photo { grid-column: auto; grid-row: auto; }
  /* 補足ブロック先頭要素の上マージンは row-gap に任せる（二重の余白を防ぐ） */
  .biz-sec__headL > :first-child { margin-top: 0; }
  .biz-title { gap: 14px; }
  .biz-title__badge { width: 60px; height: 60px; }
  .biz-title__badge img { height: 30px; }
  .biz-title__eyebrow { font-size: 14px; }
  .biz-title__main { font-size: 24px; }
  .biz-sec__h4 { font-size: 18px; margin-top: 16px; }
  .biz-sec__desc { font-size: 15px; }

  .biz-actions { margin-top: 20px; gap: 12px; align-items: stretch; }
  .est-page--business .biz-btn { min-width: 0; width: 100%; padding: 16px 24px; font-size: 15px; }

  /* Message */
  .biz-message { margin-top: 64px; padding: 24px 20px; }
  .biz-message__body p { font-size: 15px; }

  /* h3 / tags */
  .biz-h3 { margin: 44px 0 20px; font-size: 20px; padding: 16px; }
  .biz-tags { font-size: 15px; }

  /* 特徴：1カラム・円100px＋右テキスト */
  .biz-features { grid-template-columns: 1fr; gap: 20px; }
  .biz-feature { gap: 16px; align-items: center; }
  .biz-feature__circle { width: 100px; height: 100px; }
  .biz-feature__body { padding: 0; }
  .biz-feature__title { text-align: left; padding: 0 0 8px; font-size: 16px; }
  /* リストはモバイルでは1カラム・幅100%の縦積みに戻す（タブレットの横2列指定を打ち消す） */
  .biz-feature__list { display: block; padding: 8px 0 0 16px; }
  .biz-feature__list li {
    width: 100%; padding: 0; position: static; list-style: disc; font-size: 14px;
  }
  .biz-feature__list li::before { content: none; }

  /* 事業所カード：縦積み。
     モバイルはヘッダーを全幅・中央揃えのバーに（MONJI #6：ずれ調整＋全幅中央テキスト・3箇所）。
     PC/タブレットは左寄せの角タブのまま。 */
  .biz-office { margin-top: 40px; }
  .biz-office__tab { display: block; text-align: center; font-size: 15px; padding: 9px 20px; }
  .biz-office__body { grid-template-columns: 1fr; gap: 24px; padding: 20px; }
  .biz-office__name-txt p { font-size: 15px; }
  .biz-office__corp { font-size: 18px !important; }
  .biz-office__imgs { grid-template-columns: 1fr 1fr; gap: 12px; }
  .biz-office__img { height: 110px; }
  .biz-office__row { flex-direction: column; gap: 4px; padding: 12px 0; font-size: 15px; }
  .biz-office__row dt { width: auto; font-size: 13px; color: #6b6b6b; }
  .biz-office__license { padding: 12px 0 0; font-size: 13px; }
}
/* =========================================================
   不動産売却ページ /sell/（初めての不動産売却）
   Figma: PC 1647:2840 / SP 2376:5782
   ※大きな写真は AdobeStock カンプ（未ライセンス）→ プレースホルダー。
     装飾（水彩の葉・小枝・バッジ等）は Figma 書き出しを使用。
   セクション単位で段階構築中。
   ========================================================= */

.est-page--sell {
  --sell-brown: #412a00;
  --sell-text: #333;
  --sell-green: #488462;
  --sell-gold: #af7200;
  --sell-cream: #fdf8ec;
  color: var(--sell-text);
  font-family: "Noto Sans JP", sans-serif;
  /* パンくずからヒーロー下部にかけてのグラデーション背景（Figma Rectangle 2）
     ＝クリーム #fef6e3（上36.7%まで）→ 透明。上部740pxのみに敷く。 */
  background: linear-gradient(to bottom, #fef6e3 36.667%, rgba(253, 254, 245, 0)) no-repeat top / 100% 740px;
}
.sell-wrap { max-width: 1312px; margin-inline: auto; padding-inline: 24px; box-sizing: border-box; }

/* 写真プレースホルダー（未支給・AdobeStockカンプ） */
.est-page--sell .biz-photo--ph {
  background: #e9e6df; display: flex; align-items: center; justify-content: center;
  color: #9b9689; font-size: 13px; text-align: center;
}

/* 共通ボタン（緑塗り＋クリーム枠＋白矢印・角丸40・影） */
.est-page--sell .sell-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 16px;
  min-width: 337px; box-sizing: border-box; padding: 24px 40px;
  background: var(--sell-green); border: 1px solid var(--sell-cream); color: #fff; border-radius: 40px;
  font-size: 18px; font-weight: 700; line-height: 1.5; text-decoration: none;
  box-shadow: 0 10px 5px rgba(175, 114, 0, 0.1);
  transition: opacity .2s ease;
}
.est-page--sell .sell-btn:hover { color: #fff; opacity: 0.88; }
.est-page--sell .sell-btn::after {
  content: ""; flex-shrink: 0; width: 5px; height: 10px; background-color: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0.6 0.6L4.4 5L0.6 9.4' fill='none' stroke='black' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0.6 0.6L4.4 5L0.6 9.4' fill='none' stroke='black' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* =========================================================
   ① ヒーロー
   ========================================================= */
.sell-hero {
  position: relative; overflow: hidden;
  padding: 56px 0 80px;
}
/* 右側のイラスト（街並み＝上／相談シーン＝下・重なり）。背景グラデーションは .est-page--sell 側 */
/* デザイン比率（section幅比）：街並み ≒55% / 相談 ≒43%。相対サイズで印象を揃える。
   街並み＝カード背面(z0) / カード(z1) / 相談＝カード前面(z2) */
.sell-hero__town {
  position: absolute; top: -32px; right: -3%; z-index: 0;
  width: 55%; max-width: 869px; height: auto; pointer-events: none;
}
.sell-hero__consult {
  position: absolute; bottom: 16px; right: 3%; z-index: 2;
  width: 43%; max-width: 671px; height: auto; pointer-events: none;
}
.sell-hero__inner { position: relative; z-index: 1; }

/* 白カード（四隅に水彩の葉・角丸・影） */
.sell-card {
  position: relative; border-radius: 20px;
  padding: 68px 60px 56px;
  /* Figma Rectangle 1854：横グラデ（左右端は半透明白）＋ゴールドの影 */
  background: linear-gradient(89.58deg, rgba(255, 255, 255, 0.4) 1.57%, #fff 21.19%, #fff 80.04%, rgba(255, 255, 255, 0.4) 99.66%);
  box-shadow: 0 10px 10px rgba(175, 114, 0, 0.1);
}
.sell-hero__card { max-width: 908px; }
/* 四隅の葉はカードの外側へ少しはみ出す（カード背景は葉より内側） */
.sell-card__leaf { position: absolute; height: auto; pointer-events: none; z-index: 2; }
.sell-card__leaf--tr { top: -24px; right: -24px; width: 140px; }
.sell-card__leaf--bl { bottom: -24px; left: -24px; width: 180px; }

.sell-hero__eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 18px; margin: 0;
  font-family: "Noto Serif JP", serif; font-weight: 700; font-size: 40px; letter-spacing: 0.05em;
  color: var(--sell-brown); line-height: 1.3;
}
.sell-sprig { display: block; width: 50px; height: 17px; flex-shrink: 0; }
.sell-sprig--l { transform: rotate(44.66deg) scaleY(-1); }
.sell-sprig--r { transform: rotate(135.34deg); }

.sell-hero__title {
  margin: 6px 0 0; text-align: center;
  font-family: "Noto Serif JP", serif; font-weight: 700; font-size: 60px; line-height: 1.3; color: var(--sell-brown);
}
.sell-hero__lead {
  margin: 28px 0 0; text-align: center;
  font-weight: 500; font-size: 18px; line-height: 1.8; letter-spacing: 0.06em; color: var(--sell-brown);
}
.sell-hero__lead-em { color: var(--sell-gold); text-decoration: underline; text-underline-offset: 3px; }

.sell-hero__card .sell-btn { display: inline-flex; margin: 40px auto 0; }
.sell-hero__card { text-align: center; }

/* =========================================================
   タブレット
   ========================================================= */
@media screen and (max-width: 999px) {
  /* スタック時（タブレット以下）＝SPデザイン準拠。※デスクトップ(>tablet)には影響しない */
  /* 背景グラデーション（ベージュ）の起点調整：
     ページ全体（.est-page--sell）の上部起点だと、パンくす〜カード上部までベージュになり不自然。
     SPではカードの下＝街並みイラスト（.sell-hero__town）付近を起点にベージュを出す。
     → ページ側のベージュは消し、ヒーロー下側にアンカーしたグラデを .sell-hero に敷く
       （高さは%指定でヒーロー高に追従。下ほど濃い #fef6e3 → 上（イラスト上端付近）で透明）。 */
  .est-page--sell { background: none; }
  /* カード＝全幅・上部、その下にイラスト帯（縦積み） */
  .sell-hero {
    padding: 40px 0 0; display: flex; flex-direction: column;
    background: linear-gradient(to top, #fef6e3 30%, rgba(253, 254, 245, 0)) no-repeat bottom / 100% 60%;
  }
  .sell-hero__inner { order: 0; z-index: 1; }
  /* カード背景はフラット白（横グラデ解除）・影も無し（浮くカード表現は不要） */
  .sell-card { padding: 48px 40px 44px; background: #fff; box-shadow: none; }
  .sell-hero__eyebrow { font-size: 30px; gap: 12px; }
  .sell-hero__title { font-size: 44px; }
  /* 葉はモバイルデザインでは非表示 */
  .sell-card__leaf { display: none; }
  /* イラスト＝カード下の全幅帯。街並みはデザイン同様“淡いバンド”(opacity40)にして
     人物イラストの隙間から街が強く透けないようにする（＝顔に街が透ける対策） */
  .sell-hero__town {
    order: 1; position: relative; top: auto; right: auto;
    width: 100%; max-width: none; margin: -8px 0 0; z-index: 0;
    opacity: 0.4; mix-blend-mode: multiply;
  }
  .sell-hero__consult {
    position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
    width: 90%; max-width: 560px; right: auto; z-index: 2;
  }
}

/* =========================================================
   モバイル
   ========================================================= */
@media screen and (max-width: 500px) {
  .sell-wrap { padding-inline: 20px; }
  .sell-hero { padding: 28px 0 0; }
  /* モバイルはカードの装飾（影・カード自身のpadding）を持たせず、
     コンテンツを通常のページ余白（左右24px）で配置する。
     ※.sell-wrapのmargin-inline:autoがflex列内でコンテンツ幅に縮めるため、margin0＋width100%で固定 */
  .sell-hero__inner { max-width: none; margin-inline: 0; width: 100%; padding: 0 24px; box-sizing: border-box; }
  .sell-card { padding: 0; border-radius: 0; box-shadow: none; }
  .sell-hero__town { margin-top: 0; }
  .sell-hero__eyebrow { font-size: 16px; gap: 8px; }
  .sell-sprig { width: 24px; height: 8px; }
  .sell-hero__title { font-size: 24px; }
  .sell-hero__lead { font-size: 14px; margin-top: 16px; }
  .est-page--sell .sell-btn { min-width: 0; width: 100%; max-width: 300px; padding: 16px 20px; font-size: 15px; }
  .sell-hero__card .sell-btn { margin-top: 22px; }
  .sell-hero__consult { width: 90%; }
}
/* =========================================================
   お問い合わせフォームページ（/contact-form）
   Figma: PC_お問い合わせ（フォーム） 1001:8483
   ヒーローは下層共通の .prop-hero（_property.css）を流用。
   本ファイルはリード文＋HubSpotフォームの見た目のみ定義する。
   すべて .est-page--contact 配下にスコープする。
   ========================================================= */

/* ===== セクション枠 ===== */
.est-page--contact .contact {
  padding-block: 64px 96px;
}
/* 本文は Figma のフォーム幅 928px を中央寄せで再現（928 + 左右32padding） */
.est-page--contact .contact__inner {
  max-width: calc(928px + 64px);
  margin-inline: auto;
  padding-inline: 32px;
  box-sizing: border-box;
}

/* ===== リード文（Figma 1001:8949：16px / line-height 2 / #333） ===== */
.est-page--contact .contact__lead {
  margin: 0 0 40px;
  color: #333;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
}

/* =========================================================
   HubSpot フォーム（.hs-form）
   マークアップは HubSpot 生成物を想定して上書きする。
   未配線でもレイアウトが崩れないよう、コンテナ側で完結させる。
   ========================================================= */

/* --- フォーム全体 --- */
.est-page--contact .hs-form {
  color: #333;
  font-family: inherit;
}
/* 各フィールドの縦間隔（Figma：フィールド間 24px） */
.est-page--contact .hs-form-field {
  margin-bottom: 24px;
}
.est-page--contact .hs-form fieldset {
  max-width: none;
}

/* --- ラベル（Figma：18px Bold #333、必須バッジと gap 10px） --- */
.est-page--contact .hs-form-field > label,
.est-page--contact .hs-field-desc + .hs-form-field > label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  color: #333;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
}
/* 補足テキスト（Figma：ラベル下の小さな注記 例）長野 相当） */
.est-page--contact .hs-field-desc {
  margin: 0 0 8px;
  color: #999;
  font-size: 13px;
  line-height: 1.6;
}

/* --- 必須マーク（HubSpot の「*」を「必須」バッジに置換：Figma 1001:9004） --- */
.est-page--contact .hs-form-required {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 21px;
  border-radius: 3px;
  background: var(--est-green);
  color: #fff;
  font-size: 0;                 /* 元の「*」を隠す */
  line-height: 1;
}
.est-page--contact .hs-form-required::before {
  content: "必須";
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
}

/* --- テキスト系入力（Figma 1001:9024：border 1px #a5a5a5 / radius 3px /
       padding 16px 20px / height 52px 相当 / placeholder #a8a8a8） --- */
.est-page--contact .hs-input:not([type="checkbox"]):not([type="radio"]),
.est-page--contact textarea.hs-input,
.est-page--contact select.hs-input {
  box-sizing: border-box;
  width: 100%;
  padding: 16px 20px;
  border: 1px solid #a5a5a5;
  border-radius: 3px;
  background: #fff;
  color: #333;
  font-family: inherit;
  font-size: 16px;              /* 実装値：iOS の自動ズーム回避のため16px（Figmaは14px） */
  font-weight: 500;
  line-height: 1.4;
}
.est-page--contact textarea.hs-input {
  min-height: 140px;
  resize: vertical;
}
.est-page--contact .hs-input::placeholder {
  color: #a8a8a8;
  font-weight: 500;
}
.est-page--contact .hs-input:focus {
  outline: none;
  border-color: var(--est-green);
  box-shadow: 0 0 0 2px rgba(72, 132, 98, 0.15);
}
/* エラー時の枠 */
.est-page--contact .hs-input.invalid.error,
.est-page--contact .hs-input.error {
  border-color: #e5484d;
}

/* --- セレクト（Figma 1001:9038：右端に下向きシェブロン Vector 93） --- */
.est-page--contact select.hs-input {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 44px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='4' viewBox='0 0 9 4'%3E%3Cpath d='M0 0l4.5 4L9 0z' fill='%23333'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 20px center;
}

/* --- 2カラム（姓／名：Figma 各448px・gap 32px） --- */
.est-page--contact .hs-form .form-columns-2 {
  display: flex;
  gap: 32px;
}
.est-page--contact .hs-form .form-columns-2 .hs-form-field {
  flex: 1 1 0;
  width: auto !important;
  float: none;
  padding: 0 !important;
}
/* HubSpot が field 内に付ける余白リセット */
.est-page--contact .hs-form .input { margin-right: 0 !important; }

/* --- ラジオボタン（Figma 1001:8968：19px 円・選択時 緑ドット・ラベル15px） --- */
.est-page--contact .inputs-list {
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
}
.est-page--contact .hs-form-radio,
.est-page--contact .hs-form-checkbox,
.est-page--contact .hs-form-booleancheckbox {
  margin-bottom: 10px;
}
.est-page--contact .hs-form-radio label,
.est-page--contact .hs-form-checkbox label,
.est-page--contact .hs-form-booleancheckbox label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: #333;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.4;
  cursor: pointer;
}
/* 選択コントロール共通（appearance を無効化して自前描画） */
.est-page--contact input[type="radio"].hs-input,
.est-page--contact input[type="checkbox"].hs-input {
  appearance: none;
  -webkit-appearance: none;
  flex-shrink: 0;
  margin: 0;
  background: #fff;
  border: 1px solid #a5a5a5;
  cursor: pointer;
  position: relative;
}
/* ラジオ：19px 円 */
.est-page--contact input[type="radio"].hs-input {
  width: 19px;
  height: 19px;
  border-radius: 50%;
}
.est-page--contact input[type="radio"].hs-input:checked {
  border-color: var(--est-green);
}
.est-page--contact input[type="radio"].hs-input:checked::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: var(--est-green);
}
/* チェックボックス：20px 角 */
.est-page--contact input[type="checkbox"].hs-input {
  width: 20px;
  height: 20px;
  border-radius: 3px;
}
.est-page--contact input[type="checkbox"].hs-input:checked {
  background: var(--est-green);
  border-color: var(--est-green);
}
.est-page--contact input[type="checkbox"].hs-input:checked::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 2px;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* --- プライバシーポリシー同意（Figma 1001:8999 の一文＋チェック） --- */
.est-page--contact .hs-form .legal-consent-container,
.est-page--contact .hs-form .hs-form-booleancheckbox-display {
  font-size: 15px;
  line-height: 1.6;
}
.est-page--contact .hs-form a {
  color: var(--est-green);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* --- エラーメッセージ（Figma：赤字） --- */
.est-page--contact .hs-error-msg,
.est-page--contact .hs-error-msgs label {
  display: block;
  margin-top: 6px;
  color: #e5484d;
  font-size: 13px;
  line-height: 1.5;
}
.est-page--contact .hs-error-msgs { margin: 0; padding: 0; list-style: none; }

/* --- 送信ボタン（Figma 1001:9390：緑ピル / border #fdf8ec /
       radius 40px / padding 24px / 影 / 18px Bold 白 / 右矢印） --- */
.est-page--contact .hs-submit {
  margin-top: 40px;
  text-align: center;
}
.est-page--contact .hs-button,
.est-page--contact .hs-submit input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  width: 100%;
  max-width: 352px;
  padding: 22px 32px;
  border: 1px solid #fdf8ec;
  border-radius: 40px;
  background: var(--est-green);
  color: #fff;
  font-family: inherit;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  cursor: pointer;
  box-shadow: 0 10px 5px rgba(175, 114, 0, 0.1);
  transition: opacity 0.2s ease;
  -webkit-appearance: none;
  appearance: none;
}
.est-page--contact .hs-button:hover,
.est-page--contact .hs-submit input[type="submit"]:hover {
  opacity: 0.9;
}
/* 送信ボタン右の矢印（Figma Vector 31：5x10 右シェブロン）
   input[type=submit] は擬似要素が使えないため、button 要素の場合のみ付与 */
.est-page--contact button.hs-button::after {
  content: "";
  width: 5px;
  height: 10px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0 0l5 5-5 5' fill='none' stroke='%23fff' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* =========================================================
   レスポンシブ
   ========================================================= */
/* タブレット（<=999px） */
@media screen and (max-width: 999px) {
  .est-page--contact .contact { padding-block: 48px 72px; }
  .est-page--contact .contact__inner { padding-inline: 24px; }
  .est-page--contact .hs-form-field > label { font-size: 17px; }
}

/* モバイル（<=500px） */
@media screen and (max-width: 500px) {
  .est-page--contact .contact { padding-block: 32px 56px; }
  .est-page--contact .contact__inner { padding-inline: 20px; }
  .est-page--contact .contact__lead { font-size: 15px; margin-bottom: 28px; }
  .est-page--contact .hs-form-field > label { font-size: 16px; }
  /* 2カラム（姓／名）を縦積みに */
  .est-page--contact .hs-form .form-columns-2 {
    flex-direction: column;
    gap: 24px;
  }
}

/* フォーム未配線時の設置枠プレースホルダー（フォーム作成後は削除/非表示に） */
.est-page--contact .contact-form__placeholder {
  border: 1px dashed #c9bfa6;
  border-radius: 8px;
  background: #fdf8ec;
  padding: 40px 32px;
  text-align: center;
}
.est-page--contact .contact-form__placeholder-title {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 700;
  color: #412a00;
}
.est-page--contact .contact-form__placeholder-text {
  margin: 0;
  font-size: 14px;
  line-height: 1.9;
  color: #4a5565;
}
/* =========================================================
   HubSpot 新フォーム（hsfc-* / forms/embed）estateブランド共通スタイル
   ・全ページ・全フォーム共通（フォーム固有クラスなので .hsfc-FormWrapper スコープで適用）。
   ・元は不動産問い合わせフォーム（_property.css .prop-inquiry__form）に実装していた一式を
     グローバル化して集約。以後フォーム体裁はこの1ファイルで管理する。
   ・HubSpot既定CSS（[data-hsfc-id="Renderer"] …・--hsf-*変数）に勝つため要所は !important。
   ・.hsfc-NumberInput / .hsfc-DropdownInput は"ラッパーDIV"。枠は内側 .hsfc-TextInput のみ、
     ラッパー側の枠/余白/背景は解除して二重枠を防ぐ。
   ========================================================= */

/* フォーム全体の最大幅・中央寄せ */
.hsfc-FormWrapper { max-width: 928px; margin-inline: auto; color: var(--est-text); }

/* ---- 新型HubSpotフォーム（hsfc-*）ブランド適用 ---- */
/* HubSpot既定CSSに勝つため要所は !important */
/* 空のフォームタイトル（テーマの濃緑背景が付く）は非表示。独自見出しを使用 */
.hsfc-FormWrapper .form-title { display: none !important; }
/* 空のフォームタイトル（テーマ設定の緑背景 form_title_bg_color が付く）はラッパー外でも非表示。
   ※中身のあるタイトルは表示を維持するため :empty で限定 */
.form-title:empty { display: none !important; }
.hsfc-FormWrapper .hsfc-Form { font-family: var(--est-font); }
/* HubSpotが注入する [data-hsfc-id="Renderer"] .hsfc-Step .hsfc-Step__Content の
   左右paddingを全ブレイクポイントで0に（!importantで注入CSSに勝つ）
   項目間の余白は gap で管理（デスクトップ24px／モバイル16px。MONJI#1・#3） */
.hsfc-FormWrapper .hsfc-Step__Content { display: flex; flex-direction: column; gap: 24px; padding-inline: 0 !important; }
@media screen and (max-width: 500px) {
  .hsfc-FormWrapper .hsfc-Step__Content { padding: 0 !important; gap: 16px; }
}
/* HubSpotが注入する .hsfc-Row の margin-bottom:20px を打ち消し、項目間余白を gap 一本化する。
   （gap22px + 注入margin20px = 42px 空いていた。MONJI#1「42px→24pxに」）
   ※直下rowのみ対象。同意欄(.hsfc-DataPrivacyField)内部のネストrowは20px間隔を維持する。 */
.hsfc-FormWrapper .hsfc-Step__Content > .hsfc-Row { margin: 0 !important; }

/* ラベル */
.hsfc-FormWrapper .hsfc-FieldLabel {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--est-text) !important;
  margin-bottom: 8px !important;
}
/* 必須マーカー：赤アスタリスク→緑「必須」バッジ（Figma 1046:2651） */
.hsfc-FormWrapper .hsfc-FieldLabel__RequiredIndicator {
  font-size: 0 !important;
  margin-left: 8px !important;
  vertical-align: middle !important;
}
.hsfc-FormWrapper .hsfc-FieldLabel__RequiredIndicator::after {
  content: "必須";
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  background: #488462;
  padding: 2px 9px;
  border-radius: 2px;
}
.hsfc-FormWrapper .hsfc-FieldDescription { color: var(--est-text-sub) !important; font-size: 12px !important; }
/* 注意文（説明文）が空のときは余白を取らない。文が入ったときだけ表示する（MONJI#3） */
.hsfc-FormWrapper .hsfc-FieldDescription:empty { display: none !important; }

/* 独立配置のリッチテキスト（イントロ文など）は、通常のリッチテキスト本文(p)と
   同じ体裁にする（既定24px／過度な縮小を避ける）。基準は css/components/_rte.css の p。 */
.hsfc-FormWrapper .hsfc-RichText,
.hsfc-FormWrapper .hsfc-RichText p {
  font-size: 16px !important;
  line-height: 2 !important;
  color: var(--est-text) !important;
}
/* 同意・個人情報のお取り扱い等の法務テキスト（DataPrivacyField内）だけ小さく表示する */
.hsfc-FormWrapper .hsfc-DataPrivacyField .hsfc-RichText,
.hsfc-FormWrapper .hsfc-DataPrivacyField .hsfc-RichText * {
  font-size: 14px !important;
  line-height: 1.7 !important;
}
/* リッチテキスト段落の過大な余白を詰める（見出し下の空きすぎ対策） */
.hsfc-FormWrapper .hsfc-RichText p { margin: 0 !important; }
.hsfc-FormWrapper .hsfc-RichText p + p { margin-top: 0.8em !important; }

/* 入力欄 */
.hsfc-FormWrapper .hsfc-TextInput,
.hsfc-FormWrapper .hsfc-NumberInput,
.hsfc-FormWrapper .hsfc-TextareaInput,
.hsfc-FormWrapper .hsfc-DropdownInput {
  width: 100% !important;
  border: 1px solid #d1d6dc !important;
  border-radius: var(--est-radius) !important;
  background: #fff !important;
  font-size: 15px !important;
  color: var(--est-text) !important;
  box-sizing: border-box !important;
}
.hsfc-FormWrapper .hsfc-TextInput,
.hsfc-FormWrapper .hsfc-NumberInput,
.hsfc-FormWrapper .hsfc-DropdownInput { padding: 12px 14px !important; }
.hsfc-FormWrapper .hsfc-TextareaInput { padding: 12px 14px !important; min-height: 140px !important; }
.hsfc-FormWrapper .hsfc-TextInput:focus,
.hsfc-FormWrapper .hsfc-NumberInput:focus,
.hsfc-FormWrapper .hsfc-TextareaInput:focus,
.hsfc-FormWrapper .hsfc-DropdownInput:focus-within {
  border-color: var(--est-green) !important;
  box-shadow: 0 0 0 3px rgba(72, 132, 99, 0.15) !important;
  outline: none !important;
}
/* プルダウン二重枠の解消：外側(.hsfc-DropdownInput)を枠にし、内側ボタンの枠/背景/余白を消す */
.hsfc-FormWrapper .hsfc-TextInput--button {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  width: 100% !important;
}

/* 電話番号(NumberField)の二重枠解消：
   .hsfc-NumberInput はラッパー（内部に input.hsfc-TextInput）。
   入力欄ルールで両方に枠が付いていたため、ラッパー側の枠/余白/背景を消し、
   枠は内側 input(.hsfc-TextInput) のみに残す。 */
.hsfc-FormWrapper .hsfc-NumberInput {
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
/* 同様のラッパー型があれば併せて解除（電話専用フィールド等） */
.hsfc-FormWrapper .hsfc-PhoneInput,
.hsfc-FormWrapper .hsfc-PhoneNumberInput {
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.hsfc-FormWrapper .hsfc-PhoneInput .hsfc-TextInput,
.hsfc-FormWrapper .hsfc-PhoneNumberInput .hsfc-TextInput {
  width: 100% !important;
}

/* チェックボックス・ラジオ（緑ブランドでカスタム再現） */
/* ラベル折返し時にチェックボックスを上端揃えに */
.hsfc-FormWrapper [data-hsfc-id="Renderer"] .hsfc-CheckboxField label,
[data-hsfc-id="Renderer"] .hsfc-CheckboxField label { align-items: flex-start !important; }

.hsfc-FormWrapper input[type="checkbox"],
.hsfc-FormWrapper input[type="radio"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  border: 1px solid #c5c5c5 !important;
  background: #fff !important;
  flex-shrink: 0;
  cursor: pointer;
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
.hsfc-FormWrapper input[type="checkbox"] { border-radius: 3px !important; }
.hsfc-FormWrapper input[type="radio"] { border-radius: 50% !important; }
/* チェック時：白チェックマークは背景SVGで描画（inputの::afterは不安定なため） */
.hsfc-FormWrapper input[type="checkbox"]:checked {
  background-color: #488462 !important;
  border-color: #488462 !important;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='12'%20height='10'%20viewBox='0%200%2012%2010'%3E%3Cpath%20d='M2%205.2%204.6%207.8%2010%202.2'%20fill='none'%20stroke='%23ffffff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 12px 10px !important;
}
.hsfc-FormWrapper input[type="radio"]:checked {
  border-color: #488462 !important;
  background-color: #fff !important;
  background-image: radial-gradient(circle, #488462 0 5px, transparent 6px) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}
.hsfc-FormWrapper input[type="checkbox"]:focus,
.hsfc-FormWrapper input[type="radio"]:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(72, 132, 99, 0.2) !important;
}

/* フォーム内テキストリンク（プライバシーポリシー等）は緑 */
.hsfc-FormWrapper a,
.hsfc-FormWrapper .hsfc-RichText a {
  color: var(--est-green) !important;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hsfc-FormWrapper a:hover,
.hsfc-FormWrapper .hsfc-RichText a:hover { opacity: 0.8; }

/* エラーテキスト（既定24pxを縮小） */
.hsfc-FormWrapper .hsfc-ErrorAlert,
.hsfc-FormWrapper .hsfc-NavigationRow__Alerts,
.hsfc-FormWrapper [class*="ErrorAlert"],
.hsfc-FormWrapper [class*="__Alerts"] {
  font-size: 13px !important;
  line-height: 1.6 !important;
}

/* 送信ボタン（サイト共通CTAに統一：bg #488462 / 角丸40px / 影 / 18px / 矢印gap16px / 幅352。MONJI#2・#4） */
.hsfc-FormWrapper .hsfc-NavigationRow,
.hsfc-FormWrapper .hsfc-NavigationRow__Buttons { justify-content: center !important; display: flex !important; }
/* HubSpotが注入する NavigationRow の margin-top:40px（=62px空く）は詰めるが、
   送信ボタン上だけは項目間より少しゆとりを持たせる（PC: gap24+16=40px。MONJI#4＋追加調整） */
.hsfc-FormWrapper .hsfc-NavigationRow { margin: 16px 0 0 !important; }
.hsfc-FormWrapper .hsfc-Button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 16px !important;
  min-width: 352px !important;
  padding: 24px 40px !important;
  border: 0 !important;
  border-radius: 40px !important;
  background: var(--est-green) !important;
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  font-family: inherit !important;
  line-height: 1.5 !important;
  cursor: pointer !important;
  box-shadow: 0 10px 5px rgba(175, 114, 0, 0.1) !important;
  transition: background-color 0.2s ease, box-shadow 0.2s ease !important;
}
/* 送信テキスト横のシェブロン矢印（Vector 31 / 5×10 白） */
.hsfc-FormWrapper .hsfc-Button::after {
  content: "";
  flex-shrink: 0;
  width: 5px;
  height: 10px;
  background-color: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='5'%20height='10'%20viewBox='0%200%205%2010'%3E%3Cpath%20d='M0.6%200.6L4.4%205L0.6%209.4'%20fill='none'%20stroke='%23000'%20stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='5'%20height='10'%20viewBox='0%200%205%2010'%3E%3Cpath%20d='M0.6%200.6L4.4%205L0.6%209.4'%20fill='none'%20stroke='%23000'%20stroke-width='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
}
.hsfc-FormWrapper .hsfc-Button:hover { background: #2a6141 !important; }

@media screen and (max-width: 500px) {
  /* モバイルはボタン全幅表示 */
  .hsfc-FormWrapper .hsfc-NavigationRow__Buttons { width: 100% !important; }
  .hsfc-FormWrapper .hsfc-Button { width: 100% !important; min-width: 0 !important; padding: 16px 40px !important; }
  /* 送信ボタン上のゆとり（SP: gap16+12=28px） */
  .hsfc-FormWrapper .hsfc-NavigationRow { margin-top: 12px !important; }
}
/* Menu and simple menu */

.hs-menu-wrapper ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding-left: 0;
}

/* Horizontal menu */

.hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-children-wrapper {
  flex-direction: column;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.hs-menu-flow-horizontal ul {
    flex-direction: column;
  }
}

/* Vertical menu */

.hs-menu-wrapper.hs-menu-flow-vertical ul {
  flex-direction: column;
}

/* Flyouts */

.hs-menu-wrapper.hs-menu-flow-vertical.flyouts ul {
  display: inline-flex;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.hs-menu-flow-vertical ul {
    display: flex;
  }
}

.hs-menu-wrapper.flyouts .hs-item-has-children {
  position: relative;
}

.hs-menu-wrapper.flyouts .hs-menu-children-wrapper {
  left: -9999px;
  opacity: 0;
  position: absolute;
}

.hs-menu-wrapper.flyouts .hs-menu-children-wrapper a {
  display: block;
  white-space: nowrap;
}

.hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
  left: 0;
  opacity: 1;
  top: 100%;
}

.hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
  left: 100%;
  opacity: 1;
  top: 0;
}

@media (max-width: 767px) {
  .hs-menu-wrapper.flyouts .hs-menu-children-wrapper,
  .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper,
  .hs-menu-wrapper.hs-menu-flow-vertical.flyouts .hs-item-has-children:hover > .hs-menu-children-wrapper {
    left: 0;
    opacity: 1;
    position: relative;
    top: auto;
  }
}

/* CTA, logo, and rich text images */

.hs_cos_wrapper_type_cta img,
.hs_cos_wrapper_type_logo img,
.hs_cos_wrapper_type_rich_text img {
  height: auto;
  max-width: 100%;
}

/* Utilities
Helper classes with ability to override anything that comes before it
*/

/* For content that needs to be visually hidden but stay visible for screenreaders */

.show-for-sr {
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  height: 1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}

@media (max-width: 767px) {
  .show-for-sr--mobile {
    border: 0 !important;
    clip: rect(0, 0, 0, 0) !important;
    height: 1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    white-space: nowrap !important;
    width: 1px !important;
  }
}

/* Estate
高見澤 エステートセグメント ブランド基盤（カラー・タイポグラフィ・共通パーツ）
*/

/* =========================================================
   高見澤 エステートセグメント ブランド基盤スタイル
   Figma デザインから抽出したカラー・タイポグラフィのトークン
   ========================================================= */

:root {
  /* ブランドカラー */
  --est-green: #488463;          /* プライマリグリーン */
  --est-green-dark: #193b10;     /* 濃緑（フッター・影） */
  --est-green-deep: #2f5d43;     /* 見出し用の深緑 */
  --est-yellow: #ffd900;         /* 高見澤イエロー（アクセント） */

  /* テキストカラー */
  --est-text: #333333;           /* 基本文字色 */
  --est-text-strong: #0a0a0a;    /* 準黒（カード見出し等） */
  --est-text-sub: #4a5565;       /* 補助テキスト（住所等） */
  --est-white: #ffffff;

  /* 背景 */
  --est-bg-cream: #f7f5ef;       /* クリーム系背景 */
  --est-tag-green-bg: rgba(72, 132, 99, 0.1); /* タグ背景 */

  /* 影 */
  --est-card-shadow: 0 0 10px rgba(25, 59, 16, 0.2);

  /* レイアウト */
  --est-content-width: 1200px;
  --est-radius: 5px;

  /* フォント */
  --est-font: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
}

/* ---- ベースタイポグラフィ ---- */
body {
  font-family: var(--est-font);
  color: var(--est-text);
  font-feature-settings: "palt";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ---- 共通レイアウトコンテナ ---- */
.est-container {
  width: 100%;
  max-width: calc(var(--est-content-width) + 64px);
  margin-inline: auto;
  padding-inline: 32px;
  box-sizing: border-box;
}

@media screen and (max-width: 999px) {
  .est-container {
    padding-inline: 24px;
  }
}

@media screen and (max-width: 500px) {
  .est-container {
    padding-inline: 20px;
  }
}

/* ---- セクション見出し（英字ラベル + 日本語） ---- */
.est-section-head__en {
  font-size: 56px;
  font-weight: 700;
  line-height: 1;
  color: var(--est-green);
  letter-spacing: 0.02em;
}

.est-section-head__ja {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
  font-size: 16px;
  font-weight: 500;
  color: var(--est-text);
}

.est-section-head__ja::before {
  content: "";
  width: 24px;
  height: 1px;
  background: var(--est-green);
}

@media screen and (max-width: 999px) {
  .est-section-head__en { font-size: 40px; }
}

@media screen and (max-width: 500px) {
  .est-section-head__en { font-size: 32px; }
}

/* ---- 共通ボタン（緑ピル + 矢印） ---- */
.est-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  min-width: 290px;
  padding: 24px 32px;
  border-radius: 999px;
  background: var(--est-green);
  color: var(--est-white);
  font-size: 18px;
  font-weight: 500;
  text-decoration: none;
  transition: opacity 0.25s ease, background-color 0.25s ease;
}

.est-btn::after {
  content: "";
  width: 5px;
  height: 10px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0 0l5 5-5 5' fill='none' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='10' viewBox='0 0 5 10'%3E%3Cpath d='M0 0l5 5-5 5' fill='none' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat center / contain;
}

.est-btn:hover {
  opacity: 0.85;
}

@media screen and (max-width: 500px) {
  .est-btn {
    min-width: 0;
    width: 100%;
    padding: 18px 24px;
    font-size: 16px;
  }
}