@charset "utf-8";
/* =========================================================
   メインビジュアル（KV）スライダー調整
========================================================= */
/* スライダー全体のサイズを固定 */
.kvSlider .splide__track,
.kvSlider .splide__list,
.kvSlider .splide__slide {
    width: 100% !important;
    height: 100% !important;
}

/* スライド内の画像が綺麗に収まるように設定 */
.kvSlider .splide__slide figure.kv {
    width: 100%;
    height: 100%;
}

.kvSlider .splide__slide figure.kv img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover; /* 画像の比率を保ったままエリア全体を覆う */
}

@media only screen and (max-width: 767px) {
  section.sec-strengths .strengthsWrap .strengthsList > li dl dt {
    width: 50px;
    font-size: 16px;
  }
}
/* 店舗情報のGoogle Mapsボタンを右側配置（スペースがない時は下へ） */
#sec-storeInfo .storeAddress {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 16px; /* 住所とボタンの間の余白 */
}
#sec-storeInfo .storeAddress p {
    width: auto !important;
    /* ボタンの幅（約140px）＋余白を引いた分を住所エリアとする */
    flex: 1 1 calc(100% - 160px) !important;
    /* 住所エリアの最小幅。これより狭くなるとボタンが下に折り返されます */
    min-width: 220px !important; 
}
#sec-storeInfo .storeAddress .linkBtn {
    margin-top: 0 !important;
    flex-shrink: 0;
}
/* 物件検索の「条件絞り込み」右側の「閉じる」ボタンとアイコンを非表示にする */
#sec-Search .accordionTitle .accordionTitleRight {
    display: none !important;
}

/* 親要素（タイトルバー全体）のクリックイベントを無効化し、カーソルを通常に戻す */
#sec-Search .accordionTitle {
    pointer-events: none !important;
    cursor: default !important;
}


.navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.black {
  background: #36663A; /* 紺色から緑色に変更 */
  color: #fff;
}
.navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.black .icn {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 4px;
}
.navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.black .icn svg {
  fill: #fff;
  transition: all ease-out 0.3s;
}

/* ホバー時の設定を書き換えます */
@media (hover: hover) and (pointer: fine) {
  .navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.black:hover {
    background: #fff;
    color: #007440;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15); /* animationBtn white のような立体感を追加 */
  }
  .navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.black:hover .icn svg {
    fill: #007440;
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.black:hover {
    background: #fff;
    color: #007440;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15);
  }
  .navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.black:hover .icn svg {
    fill: #007440;
  }
}
/* =========================================================
   「ナイストリプル査定」と「ナイスの直接買取」のカラー変更（詳細版）
========================================================= */

/* 1. 全体の背景色の入れ替え */
.bgRightGreen {
    background: #007440 !important; /* 下部（直接買取）を濃い緑に */
}
.bgRightGreen .bgGreen {
    background: #e1efd9 !important; /* 上部（トリプル査定）をご指定の薄緑に */
}

/* 2. ナイストリプル査定（上部）のテキスト色詳細設定 */
/* タイトルとサブタイトルは緑 */
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt h3 .jp,
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt h3 .en,
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt h4 {
    color: #007440 !important;
}

/* 「無料」の丸囲みは背景白、文字と枠を緑に */
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt h3 .freeIcn {
    color: #007440 !important;
    border-color: #007440 !important;
    background-color: #ffffff !important;
}

/* 「ナイスなら3つの…」と注釈テキストは黒（サイト基本色の濃紺に合わせる） */
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt .readTxt,
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt .caption {
    color: #1E2549 !important; /* 完全な黒(#000)にしたい場合は #000000 に変更してください */
}

/* 3. 「いますぐ査定する」ボタン（上部）のスタイルとホバー設定 */
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt .linkBtn.black {
    background: #007440 !important;
    color: #fff !important;
}
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt .linkBtn.black::before {
    background: #fff !important;
}

@media (hover: hover) and (pointer: fine) {
    section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt .linkBtn.black:hover {
        background: #fff !important;
        color: #007440 !important;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15) !important;
    }
}

/* 4. ナイストリプル査定の右側ステップ（01,02,03）のカード背景とテキスト */
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalDetail ol > li {
    background: #007440 !important;
    border-left: 1px dashed rgba(255, 255, 255, 0.5) !important;
}
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalDetail ol > li:first-child {
    border-left: none !important;
}
@media only screen and (max-width: 767px) {
    section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalDetail ol > li {
        border-left: none !important;
        border-top: 1px dashed rgba(255, 255, 255, 0.5) !important;
    }
    section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalDetail ol > li:first-child {
        border-top: none !important;
    }
}

/* 売却査定・買取査定・賃料査定の文字を山吹色に */
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalDetail ol > li dl dd {
    color: #ffcc00 !important; /* 山吹色。黄色味を強めたい場合は #f6dd00 などに調整してください */
}
/* 数字と説明文は白を維持 */
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalDetail ol > li dl dt,
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalDetail ol > li p {
    color: #ffffff !important;
}

/* 5. ナイスの直接買取（下部）のテキスト色 */
section.sec-directPurchase .directPurchaseAbout .directPurchaseAboutTxt h3 .en {
    color: #fff !important;
}

/* 6. 「いますぐ相談する」ボタン（下部）のスタイルとホバー設定 */
section.sec-directPurchase .directPurchaseAbout .directPurchaseAboutTxt .linkBtn.black {
    background: #e1efd9 !important; /* 薄緑背景 */
    color: #007440 !important;
}
section.sec-directPurchase .directPurchaseAbout .directPurchaseAboutTxt .linkBtn.black::before {
    background: #fff !important;
}

@media (hover: hover) and (pointer: fine) {
    section.sec-directPurchase .directPurchaseAbout .directPurchaseAboutTxt .linkBtn.black:hover {
        background: #fff !important;
        color: #007440 !important;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15) !important;
    }
}

/* 7. ナイスの直接買取の右側アイコン群を白背景カード化 */
section.sec-directPurchase .directPurchaseAbout .directPurchaseDetail ul {
    background: #fff !important;
    border-radius: 16px !important;
    overflow: hidden;
}
section.sec-directPurchase .directPurchaseAbout .directPurchaseDetail ul > li {
    background: transparent !important;
    border-left: 1px solid #007440 !important;
}
section.sec-directPurchase .directPurchaseAbout .directPurchaseDetail ul > li:first-child {
    border-left: none !important;
}
section.sec-directPurchase .directPurchaseAbout .directPurchaseDetail ul > li p {
    color: #007440 !important;
}
@media only screen and (max-width: 767px) {
    section.sec-directPurchase .directPurchaseAbout .directPurchaseDetail ul > li {
        border-left: none !important;
        border-top: 1px solid #007440 !important;
    }
    section.sec-directPurchase .directPurchaseAbout .directPurchaseDetail ul > li:first-child {
        border-top: none !important;
    }
}
section.sec-newPropertyInfo .newPropertyListWrap .newPropertyInfoSlider a.is-new .imgWrap::after {
    background: red;
    color: #fff;
}
section.sec-ourStaff .staffList > li .recommend figure figcaption {
    background: #36663A;
    color: #fff;
}
section.sec-pagejump details .pagejumpContents .btnList li a.black {
  background: #36663A;
  color: #fff;
}

/* =========================================================
   「条件絞り込み」タイトルのカラー変更
========================================================= */

/* 1. 背景色を薄いグレーに変更 */
#sec-Search .accordionTitle {
    background: #F6F6F6 !important; /* サイト内で使われている薄いグレーに統一しています */
}

/* 2. 「条件絞り込み」の文字色を黒（濃紺）に変更 */
#sec-Search .accordionTitle .accordionTitleLeft p {
    color: #1E2549 !important; /* サイトの基本テキスト色（黒に近い濃紺）に合わせています */
}

/* 3. 三本線アイコン（画像）を黒に変更 */
#sec-Search .accordionTitle .accordionTitleLeft .icn img {
    filter: brightness(0) !important; /* 画像の色を黒に変換 */
}
/* =========================================================
   「検索する」ボタンのカラー変更
========================================================= */

/* 1. 通常時のスタイル（背景：白、枠：薄いグレー、文字・アイコン：緑） */
section.sec-Search .tabSearchWrap .tabSearchContents#searchCondition .tabSearch .tabContents .tabContentsWrap .submitWrap .submitBtn {
    background-color: #ffffff !important;
    border: 3px solid #E4E4E4 !important; /* サイト内の基本の薄いグレーを使用 */
    color: #007440 !important;
}

section.sec-Search .tabSearchWrap .tabSearchContents#searchCondition .tabSearch .tabContents .tabContentsWrap .submitWrap .submitBtn svg {
    fill: #007440 !important;
}

/* 2. ホバー時のスタイル（背景：薄緑、枠：白、文字・アイコン：緑のまま） */
@media (hover: hover) and (pointer: fine) {
    section.sec-Search .tabSearchWrap .tabSearchContents#searchCondition .tabSearch .tabContents .tabContentsWrap .submitWrap .submitBtn:hover {
        background-color: #e1efd9 !important; /* 先ほど指定いただいた薄緑を使用 */
        border: 3px solid #ffffff !important;
        color: #007440 !important;
        box-shadow: none !important; /* 不要な影が出ないようにリセット */
    }
    section.sec-Search .tabSearchWrap .tabSearchContents#searchCondition .tabSearch .tabContents .tabContentsWrap .submitWrap .submitBtn:hover svg {
        fill: #007440 !important;
    }
}

/* IE用ホバー設定 */
@media (-ms-high-contrast: none), (-ms-high-contrast: active) {
    section.sec-Search .tabSearchWrap .tabSearchContents#searchCondition .tabSearch .tabContents .tabContentsWrap .submitWrap .submitBtn:hover {
        background-color: #e1efd9 !important;
        border: 3px solid #ffffff !important;
        color: #007440 !important;
        box-shadow: none !important;
    }
    section.sec-Search .tabSearchWrap .tabSearchContents#searchCondition .tabSearch .tabContents .tabContentsWrap .submitWrap .submitBtn:hover svg {
        fill: #007440 !important;
    }
}
section.sec-storeInfo .storeInfoWrap .storeInfoDetail .tagList > li {
    border-radius: 4px;
}

@media only screen and (max-width: 767px) {
section.sec-strengths .strengthsWrap .strengthsList > li {
width: 100%;
padding: 24px;
min-height: 100px;
display: grid;
}
}

/* =========================================================
   ページ内リンクナビ（ヘッダー）の固定とロゴ調整
========================================================= */
main, .sec-relatedGroups, .sec-snsLogo {  padding-top: 0px;}
@media screen and (min-width: 1025px) {
    section.sec-pagejump {
        position: sticky;
        top: 0; /* 画面の一番上で固定 */
        z-index: 100; /* 他の要素より手前に表示 */
        background: rgba(246, 246, 246, 0.95); /* 背景を少し透過させて設定 */
        backdrop-filter: blur(5px); /* 背景をぼかすエフェクト */
        width: 100%;
        box-sizing: border-box;
    }
}
section.sec-pagejump details summary {
    display: flex !important;
    align-items: center;
    gap: 16px; /* ロゴと店舗名の間隔（お好みで調整してください） */
}
#pxBase .pagejump-logo {
    height: 24px !important; /* ロゴの高さ（お好みで調整してください） */
    width: auto;
}
/* =========================================================
   お知らせのカテゴリ・日付位置変更に伴うスタイル調整
========================================================= */
/* 配置の調整と上の線を消す処理 */
section.sec-news .newsListWrap .newsListSlider a .newsDetail {
    display: flex !important;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
    border-top: none !important; /* 元の緑色の直線を消す */
    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 5px; /* 画像との間隔 */
    padding-left: 24px; /* 左右の余白をタイトルの位置と揃える */
    padding-right: 24px;
}
@media only screen and (max-width: 1024px) {
    section.sec-news .newsListWrap .newsListSlider a .newsDetail {
        margin-bottom: 8px;
        padding-left: 16px;
        padding-right: 16px;
    }
}
/* HTMLの移動により外れてしまうカテゴリ枠のスタイルを再設定 */
section.sec-news .newsListWrap .newsListSlider a .newsDetail .newsCategory {
    display: flex;
    padding: 3px 8px;
    flex-direction: column;
    align-items: flex-end;
    border-radius: 4px;
    border: 1px solid var(--NICE_green, #007440);
    color: var(--NICE_green, #007440);
    text-align: center;
    font-size: min(0.9090909091vw, 14px);
    font-weight: 500;
    line-height: 140%;
}
section.sec-news .newsListWrap .newsListSlider a .newsDetail .newsCategory.soldout {
    border: 1px solid #CC1D20;
    color: #CC1D20;
}
@media only screen and (max-width: 1024px) {
    section.sec-news .newsListWrap .newsListSlider a .newsDetail .newsCategory {
        font-size: 13px;
    }
}
/* HTMLの移動により外れてしまう日付のスタイルを再設定 */
section.sec-news .newsListWrap .newsListSlider a .newsDetail .newsDate {
    color: var(--Soutetsu-Navy, #1E2549);
    text-align: right;
    font-size: min(1.038961039vw, 16px);
    font-weight: 500;
    line-height: 120%;
}
@media only screen and (max-width: 1024px) {
    section.sec-news .newsListWrap .newsListSlider a .newsDetail .newsDate {
        font-size: 13px;
    }
}
/*0617　追加*/
@media only screen and (max-width: 1024px) {
	section.sec-pagejump { top: 0;}
}
section.sec-strengths h3 .en { color: #fff;}
@media only screen and (max-width: 767px) {
  section.sec-directPurchase .directPurchaseAbout .directPurchaseDetail ul > li:nth-child(1) {
    border-right: 1px solid #007440 !important;
  }
  section.sec-directPurchase .directPurchaseAbout .directPurchaseDetail ul > li:nth-child(2) {
    border-top: none !important;
  }
  section.sec-directPurchase .directPurchaseAbout .directPurchaseDetail ul > li:nth-child(3) {
    border-right: 1px solid #007440 !important;
    border-top: 1px solid #007440 !important;
  }
  section.sec-directPurchase .directPurchaseAbout .directPurchaseDetail ul > li:nth-child(4) {
    border-right: none !important;
    border-top: 1px solid #007440 !important;
  }
}
section.sec-newPropertyInfo .newPropertyListWrap .newPropertyInfoSlider a .newPropertiesListDetail .detailWrap > p.name {
  font-size: min(18px);
}
@media only screen and (max-width: 1024px) {
  section.sec-storeInfo .storeInfoWrap .storeInfoSliderWrap {
    order: 1 !important;
    margin-top: 0 !important;
    margin-bottom: 32px !important;
  }
  section.sec-storeInfo .storeInfoWrap .storeInfoDetail {
    order: 2 !important;
  }
}