@charset "utf-8";
/* CSS Document */
/*　綱島から文字色調整　*/
main { background-color: #102713; }
section.sec-contents-nav .contentsNavWrap h3 span.color {
  color: #f6dd00;
}
h3 span.jp,
section.sec-newPropertyInfo .newPropertyListWrap .newPropertyInfoSlider a .newPropertiesListDetail .priceText,
section.sec-newPropertyInfo .newPropertyListWrap .newPropertyInfoSlider a .newPropertiesListDetail .detailWrap > p,
section.sec-newPropertyInfo .newPropertyListWrap .newPropertyInfoSlider a .newPropertiesListDetail .detailTxt,
section.sec-newPropertyInfo .newPropertyListWrap .newPropertyInfoSlider a .newPropertiesListDetail .viewmoreWrap .more,
section.sec-news .newsLinkWrap ul > li > a .newsLink h4 .jp,
section.sec-news .newsLinkWrap ul > li > a .newsLink .viewmoreWrap .more,
section.sec-news .newsLinkWrap ul > li > a .newsLink .viewmoreWrap .more::after,
section.sec-achievements .achievementsWrap .achievementsTxt .achievementsRead,
section.sec-strengths h3 .jp,
section.sec-strengths .strengthsWrap h4,
section.sec-contact .contactWrap .contactTxt .contactRead,
section.sec-contact .contactWrap .contactTxt .contactTel p,
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt h3 .jp,
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt h4,
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt .readTxt,
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt .caption,
section.sec-directPurchase .directPurchaseAbout .directPurchaseAboutTxt h3 .jp,
section.sec-directPurchase .directPurchaseAbout .directPurchaseAboutTxt h4,
section.sec-directPurchase .directPurchaseAbout .directPurchaseAboutTxt .caption {
  color: #fff;
}
section.sec-tripleAppraisal .tripleAppraisalAbout .tripleAppraisalAboutTxt h3 .en,
section.sec-directPurchase .directPurchaseAbout .directPurchaseAboutTxt h3 .en,
h3 span.en { color: #DADADA;}
.splide__arrow svg {
  fill: #fff !important;
}
section.sec-strengths h3 .en {
  color: #E1E1E1;
}
section.sec-newPropertyInfo .newPropertyListWrap .splide__arrows .splide__arrow,
section.sec-news .newsListWrap .splide__arrows .splide__arrow {
  border: 1px solid #fff;
}
section.sec-newPropertyInfo .newPropertyListWrap .newPropertyInfoSlider a .newPropertiesListDetail .priceText .num,
section.sec-ourStaff .ourStaffSubBox ul li a {
  color: #f6dd70;
}
section.sec-newPropertyInfo .newPropertyListWrap .newPropertyInfoSlider a .newPropertiesListDetail .viewmoreWrap .more::after,
section.sec-news .newsLinkWrap ul > li > a .newsLink .viewmoreWrap .line,
section.sec-news .newsLinkWrap ul > li > a .newsLink .viewmoreWrap .more::after,
section.sec-directPurchase .directPurchaseAbout .directPurchaseDetail ul > li,
section.sec-ourStaff .staffList > li,
section.sec-ourStaff .niceValuePlusWrap a .niceValuePlusLink .viewmoreWrap .line,
section.sec-ourStaff .niceValuePlusWrap a .niceValuePlusLink .viewmoreWrap .more::after {
	background: #fff;
}
.bgWhite {
  background: rgba(168, 229, 181, 0.5);
}
.bgYellow {
  background: rgba(83, 140, 71, 0.5);
}
section.sec-strengths h3,
section.sec-ourStaff {
  border-top: none;
}
section.sec-strengths .strengthsWrap .strengthsList > li dl dt {
  color: #131313;
}
section.sec-contact .contactWrap .contactTxt .contactTel a {
  color: #f6dd00;
}
section.sec-Search .tabSearchWrap .tabSearchContents .conditionalSelectionWrap .titleWrap h4,
section.sec-news .newsListWrap .newsListSlider a .newsContents .newsTitle,
section.sec-news .newsListWrap .newsListSlider a .newsDetail .newsDate,
section.sec-storeInfo .storeInfoWrap .storeInfoDetail h4,
section.sec-storeInfo .storeInfoWrap .storeInfoDetail .contactmovieWrap p,
section.sec-storeInfo .storeInfoWrap .storeInfoDetail .contactWrap .businessHours,
section.sec-ourStaff .ourStaffRead,
section.sec-ourStaff .niceValuePlusWrap a .niceValuePlusLink .niceValuePlusTxt h4 .jp,
section.sec-ourStaff .niceValuePlusWrap a .niceValuePlusLink .niceValuePlusTxt p,
section.sec-ourStaff .niceValuePlusWrap a .niceValuePlusLink .viewmoreWrap .more,
section.sec-ourStaff .ourStaffSubBox .ourStaffSubTitle,
section.sec-ourStaff .ourStaffSubBox ul li {
  color: #FFF;
}
section.sec-Search .tabSearchWrap .tabSearchContents .conditionalSelectionWrap .typeWrap.typeWrap > ul.checklist > li,
section.sec-storeInfo .storeInfoWrap .storeInfoDetail .tagList > li {
	border: 1px solid #cfcfcf;
	background: #fff;
}
section.sec-storeInfo .storeInfoWrap .storeInfoDetail .contactWrap .tel {
  color: #f6dd00;
}
section.sec-newPropertyInfo .newPropertyListWrap .newPropertyInfoSlider a.is-new .imgWrap::after {
	background: linear-gradient(90deg, rgb(0, 88, 18) 0%, rgb(3, 105, 59) 100%);
}
footer { background: #e7e3dbad; }
	



section.sec-kv .kvWrap .kvTxt h2 span {
  font-size: 36px;
  color: #111111;
  background: #ffffffab;
  text-shadow: none;
}
/*section.sec-contents-nav .contentsNavWrap h3 span.jp { font-size: 24px;}
section.sec-contents-nav .contentsNavWrap h3 span.color { font-size: 36px;}*/
.splide__arrow svg {
  fill: #fff !important;
}
@media only screen and (max-width: 767px) {
  section.sec-kv .kvWrap .kvTxt h2 span {
    font-size: 22px !important;
    line-height: 1.4 !important;
  }
}
#pxBase .pagejump-logo {
  height: 24px !important;
  width: auto;
}

section.sec-contents-nav {
  padding: 0 40px 50px;
}
section.sec-newPropertyInfo {
  margin-top: 0px;
  padding-top: 0;
}
section.sec-newPropertyInfo .newPropertyListWrap .newPropertyInfoSlider a .newPropertiesListDetail .detailWrap > p.name {
  font-size: min(18px);
}
section.sec-Search .tabSearchWrap .tabSearchContents .conditionalSelectionWrap .typeWrap.typeWrap > ul.checklist {
  width: auto;
}
section.sec-news {
  padding-bottom: 0;
}
/* HTMLの移動により外れてしまうカテゴリ枠のスタイルを再設定 */
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;
}
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%;
	background: #fff;
}
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;
  }
}
section.sec-news .newsLinkWrap {
  margin-top: 0px;
  padding-top: 0px;
  padding-right: 40px;
  border-top: none;
}
/* HTMLの移動により外れてしまう日付のスタイルを再設定 */
section.sec-news .newsListWrap .newsListSlider a .newsDetail .newsDate {
  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;
  }
}
/* ==========================================
   綱島店舗ページ用：固定メニューバーカスタム（スマホはアコーディオン）
   ========================================== */
/* 1. 一番上の共通メニュー（全社ヘッダー）を非表示にする */
header, .globalNavBg {
  display: none !important;
}
/* 2. スマホ・タブレット（1024px以下）のスタイル：アコーディオンを維持しつつ白ベースに */
@media only screen and (max-width: 1024px) {
  section.sec-pagejump {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
    z-index: 10000 !important;
    border-bottom: none !important;
  }
  section.sec-pagejump details summary {
    background-color: #ffffff !important;
    color: #000000 !important;
  }
  /* アコーディオン矢印を1つに統合し、開閉で回転させる */
  section.sec-pagejump details::before {
    content: url("../img/pages/top/icn_nav_arrow.svg") !important;
    display: block !important;
    background: none !important;
    /* 緑色にするフィルター */
    filter: brightness(0) saturate(100%) invert(24%) sepia(86%) saturate(1185%) hue-rotate(125deg) brightness(95%) contrast(97%) !important;
    pointer-events: none !important; /* タップ貫通 */
    opacity: 1 !important; /* 常に消えないように固定 */
    transition: transform 0.3s ease !important; /* くるっと回るアニメーション */
    -webkit-mask-image: none !important;
    mask-image: none !important;
    z-index: 10001 !important; /* summary(1000)より手前に表示させる */
  }
  /* アコーディオンが開いたときは、矢印を180度回転させる */
  section.sec-pagejump details[open]::before {
    transform: rotate(180deg) !important;
    opacity: 1 !important;
  }
  /* 複雑な動作をしていた2つ目の矢印（after）は完全に無効化して衝突を防ぐ */
  section.sec-pagejump details::after, section.sec-pagejump details[open]::after {
    display: none !important;
  }
  /* メニューバー全体を確実にタップ・開閉できるようにする（前回と同じです） */
  section.sec-pagejump details summary {
    background-color: #ffffff !important;
    color: #000000 !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    width: 100% !important;
    display: block !important;
  }
  section.sec-pagejump details .pagejumpContents {
    background-color: #ffffff !important;
    border-top: 1px solid #eeeeee !important;
  }
  section.sec-pagejump details .pagejumpContents .pagejumpList li a {
    color: #000000 !important;
  }
  section.sec-pagejump details .pagejumpContents .pagejumpList li a::after {
    background: #000000 !important;
  }
  section.sec-pagejump details .pagejumpContents .btnList {
    display: flex !important;
    flex-direction: column !important; /* 縦に並べる */
    width: 100% !important; /* 幅をいっぱいにする */
    margin-top: 32px !important;
    margin-left: 0 !important;
    padding: 0 !important;
    gap: 8px !important;
  }
  section.sec-pagejump details .pagejumpContents .btnList li {
    width: 100% !important;
  }
  section.sec-pagejump details .pagejumpContents .btnList li a {
    width: 100% !important; /* ボタンの幅を100%にする */
    height: 40px !important; /* 高さを戻す */
    font-size: 14px !important; /* 文字の大きさを戻す */
  }
  /* ボタンの色設定 */
  section.sec-pagejump details .pagejumpContents .btnList li a.btn-reserve, section.sec-pagejump details .pagejumpContents .btnList li a.gradation, section.sec-pagejump details .pagejumpContents .btnList li a[href*="reserve"] {
    background: #03693B !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 20px;
  }
  section.sec-pagejump details .pagejumpContents .btnList li a.btn-contact, section.sec-pagejump details .pagejumpContents .btnList li a[href*="contact"] {
    background: #8c6239 !important;
    color: #ffffff !important;
    border: none !important;
  }
  section.sec-pagejump details .pagejumpContents .btnList li a.green {
    background: #72a95f !important;
    color: #ffffff !important;
    border: none !important;
  }
  main#pxBase {
    padding-top: 55px !important; /* スマホ時の上部余白 */
  }
  /* 元のSP用ボタン（簡単査定・物件を探す）が表示されてしまう場合は非表示にします */
  section.sec-pagejump details .pagejumpContents .btnList .visible-tbsp {
    display: none !important;
  }
}
/* 3. PC版（1025px以上）のスタイル：横並びのバーとして固定表示 */
@media only screen and (min-width: 1025px) {
  section.sec-pagejump {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
    padding: 0 !important;
    margin: 0 !important;
    z-index: 10000 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
  section.sec-pagejump details {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 40px !important;
    box-sizing: border-box !important;
    background-color: #ffffff !important;
  }
  section.sec-pagejump details::before, section.sec-pagejump details::after {
    display: none !important;
  }
  section.sec-pagejump details summary {
    color: #000000 !important;
    background-color: transparent !important;
    padding: 15px 0 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    list-style: none !important;
    pointer-events: none !important;
  }
  section.sec-pagejump details summary::-webkit-details-marker {
    display: none !important;
  }
  section.sec-pagejump details .pagejumpContents {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    background-color: transparent !important;
    padding: 0 !important;
    margin-left: auto !important;
    width: auto !important;
    opacity: 1 !important;
    height: auto !important;
  }
  section.sec-pagejump details .pagejumpContents .pagejumpList {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  section.sec-pagejump details .pagejumpContents .pagejumpList li {
    margin: 0 !important;
  }
  section.sec-pagejump details .pagejumpContents .pagejumpList li + li {
    margin-left: 36px !important;
  }
  section.sec-pagejump details .pagejumpContents .pagejumpList li a {
    color: #000000 !important;
    font-size: 15px !important;
    height: auto !important;
  }
  section.sec-pagejump details .pagejumpContents .pagejumpList li a::after {
    background: #000000 !important;
  }
  section.sec-pagejump details .pagejumpContents .btnList {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    margin-left: 30px !important;
    padding: 0 !important;
  }
  section.sec-pagejump details .pagejumpContents .btnList li {
    margin: 0 !important;
  }
  section.sec-pagejump details .pagejumpContents .btnList li a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 120px !important;
    height: 40px !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    text-decoration: none !important;
  }
  section.sec-pagejump details .pagejumpContents .btnList li a.btn-reserve, section.sec-pagejump details .pagejumpContents .btnList li a[href*="reserve"] {
    background: #03693B !important;
    color: #ffffff !important;
    border: none !important;
  }
  section.sec-pagejump details .pagejumpContents .btnList li a.btn-contact, section.sec-pagejump details .pagejumpContents .btnList li a[href*="contact"] {
    background: #8c6239 !important;
    color: #ffffff !important;
    border: none !important;
  }
  main#pxBase {
    padding-top: 60px !important;
  }
}
/* 6. メインコンテンツが固定バーの裏に隠れないように、上部に余白を作ります */
main#pxBase {
  padding-top: 0px !important; /* 固定バーの高さに合わせた隙間です */
}
/* 7. スマートフォン・タブレット（1024px以下）でも横並びを維持する調整 */
@media only screen and (max-width: 1024px) {
  section.sec-pagejump details {
    padding: 0 15px !important;
  }
  section.sec-pagejump details summary {
    font-size: 15px !important;
  }
  section.sec-pagejump details .pagejumpContents .pagejumpList li + li {
    margin-left: 12px !important;
  }
  section.sec-pagejump details .pagejumpContents .pagejumpList li a {
    font-size: 13px !important;
  }
  /* 元のSP用ボタン（簡単査定・物件を探す）が表示されてしまう場合は非表示にします */
  section.sec-pagejump details .pagejumpContents .btnList .visible-tbsp {
    display: none !important;
  }
}
/* ==========================================
   綱島店舗ページ用：ご挨拶テキストエリア
   ========================================== */
section.sec-intro {
  background-color: #ffffff; /* 背景を白にします */
  padding: 60px 20px; /* 上下60px、左右20pxの余白をとります */
  text-align: center; /* エリア全体を中央揃えにします */
  margin-top: -10px; /* 上の画像との隙間を微調整します（必要に応じて変更してください） */
  position: relative;
  z-index: 10; /* 背景画像より手前に表示させます */
}
/* テキストをまとめる枠 */
section.sec-intro .introWrap {
  max-width: 1000px;
  margin: 0 auto;
}
/* 見出し（キャッチコピー）のデザイン */
section.sec-intro .introCatch {
  font-size: 24px; /* 文字の大きさ */
  font-weight: 500;
  color: #000000;
  margin-bottom: 30px; /* 本文との間に余白を作ります */
  letter-spacing: 0.1em; /* 文字の少し間隔をあけて読みやすくします */
}
/* 本文のデザイン */
section.sec-intro .introText {
  font-size: 16px;
  line-height: 2.0; /* 行間を広めにして読みやすくします */
  color: #000000;
  display: inline-block; /* ブロック全体は中央に置きつつ... */
  text-align: left; /* 文章自体は左揃えにして整えます */
}
/* スマートフォン向けの調整 */
@media only screen and (max-width: 767px) {
  section.sec-intro {
    padding: 40px 15px;
  }
  section.sec-intro .introCatch {
    font-size: 18px;
    line-height: 1.5;
    margin-bottom: 20px;
  }
  section.sec-intro .introText {
    font-size: 14px;
    line-height: 1.8;
  }
}
/* ==========================================
   綱島店舗ページ用：右側追従メニューカスタマイズ
   ========================================== */
/* 1. 追従メニューを右側に移動させる */
.navScrollWrapBox .nav-scroll {
  margin-left: auto !important; /* メニュー自体を右側に寄せます */
  left: auto !important;
  right: 40px !important;
  padding-top: 45px !important; /* 右上の画像のスペースを確保します */
  overflow: hidden; /* 画像が角をはみ出さないようにします */
}
/* 2. メインコンテンツの余白を「右側」に変更する */
.navScrollWrapBox .navScrollWrap {
  padding-left: 2% !important;
  padding-right: 349px !important;
}
@media only screen and (max-width: 1024px) {
  .navScrollWrapBox .navScrollWrap {
    padding-right: 0 !important;
  }
}
/* 3. 右上の装飾画像の設定 */
.nav-scroll-decoration {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 60px; /* 画像のサイズ（必要に応じて調整してください） */
  height: auto;
  pointer-events: none; /* 画像をクリック判定の邪魔にならないようにします */
}
.nav-scroll-decoration img {
  width: 100%;
  height: auto;
  display: block;
}
/* 4. サイドメニューのボタンのデザイン */
/* ご来店予約ボタン：緑色 */
.navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.btn-reserve-side {
  background-color: #006838 !important;
  color: #ffffff !important;
  border: none !important;
}
/* 簡単査定依頼ボタン：薄緑色 */
.navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.btn-assess-side {
  background-color: #72a95f !important;
  color: #ffffff !important;
  border: none !important;
}
/* 5. 順番変更に伴う、現在地を示す緑丸（nowArrow）の位置修正 */
.navScrollWrapBox .nav-scroll .pagejumpContents #nowArrow.navScrollLinkNewPropertyInfo {
  top: 3px !important;
}
.navScrollWrapBox .nav-scroll .pagejumpContents #nowArrow.navScrollLinkAchievements {
  top: 45px !important;
}
.navScrollWrapBox .nav-scroll .pagejumpContents #nowArrow.navScrollLinkTripleAppraisal {
  top: 86px !important;
}
.navScrollWrapBox .nav-scroll .pagejumpContents #nowArrow.navScrollLinkSearch {
  top: 129px !important;
}
.navScrollWrapBox .nav-scroll .pagejumpContents #nowArrow.navScrollLinkNews {
  top: 170px !important;
}
.navScrollWrapBox .nav-scroll .pagejumpContents #nowArrow.navScrollLinkStoreInfo {
  top: 212px !important;
}
.navScrollWrapBox .nav-scroll .pagejumpContents #nowArrow.navScrollLinkOurStaff {
  top: 254px !important;
}
/* ==========================================
   物件検索：検索ボタンのスタイル復活
   ========================================== */
section.sec-Search > h3, section.sec-Search .tabSearchWrap .tabSearchContents .conditionalSelectionWrap {
  margin-left: 0;
}
section.sec-Search .submitWrap {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: 50px;
  padding-bottom: 50px; /* 検索エリアの下に少し余白を作ります */
}
section.sec-Search .submitBtn {
  font-family: "Noto Serif JP", serif;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 350px;
  height: 60px;
  background-color: #015735;
  border-radius: 60px;
  border: 1px solid #fff;
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: all ease-out 0.3s;
}
section.sec-Search .submitBtn svg {
  position: absolute;
  top: 50%;
  left: 20px;
  transform: translateY(-50%);
  width: 16px;
  height: auto;
  fill: #fff;
  transition: all ease-out 0.3s;
}
/* ホバー時（マウスを乗せた時）の動き */
section.sec-Search .submitBtn:hover {
  background-color: #FFF;
  color: #1E2549;
}
section.sec-Search .submitBtn:hover svg {
  fill: #1E2549;
}
/* スマホ向けのサイズ調整 */
@media only screen and (max-width: 1024px) {
  section.sec-Search .submitBtn {
    width: calc(100% - 40px);
    max-width: 360px;
    border-width: 2px;
  }
}
/* ==========================================
   綱島店舗ページ用：スタッフ紹介カスタマイズ
   ========================================== */
/* 1. おすすめ物件情報を非表示にする */
section.sec-ourStaff .staffList > li .recommend {
  display: none !important;
}
/* 2. 物件情報が消えた分、紹介文のエリアを広げる */
section.sec-ourStaff .staffList > li .text {
  width: calc(100% - 336px) !important; /* 全体から写真幅を引いたサイズ */
}
/* 画面サイズに応じた幅の微調整 */
@media only screen and (max-width: 1440px) {
  section.sec-ourStaff .staffList > li .text {
    width: calc(100% - 230px) !important;
  }
}
@media only screen and (max-width: 1200px) {
  section.sec-ourStaff .staffList > li .text {
    width: calc(100% - 150px) !important;
  }
}
@media only screen and (max-width: 1024px) {
  section.sec-ourStaff .staffList > li .text {
    width: 100% !important; /* スマホ・タブレットは横幅いっぱい */
  }
}
/* 3. 資格情報のデザインを黒背景・白文字に変更する */
section.sec-ourStaff .staffList > li .text .license > li {
  background-color: #000000 !important;
  color: #ffffff !important;
  height: auto !important;
  padding: 6px 16px !important; /* 上下・左右の余白 */
  margin-right: 8px !important;
  margin-bottom: 8px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border-radius: 2px !important; /* 少しだけ角を丸くして柔らかくします */
}
/* スマホ向けの資格デザイン調整 */
@media only screen and (max-width: 1024px) {
  section.sec-ourStaff .staffList > li .text .license > li {
    width: auto !important;
    max-width: none !important;
  }
}
/* 元の「葉っぱ」の装飾アイコンを消す */
section.sec-ourStaff .staffList > li .text .license > li::before, section.sec-ourStaff .staffList > li .text .license > li::after {
  display: none !important;
}
/* ==========================================
   店舗名ロゴ画像のサイズ調整と上下中央揃え
   ========================================== */
/* ロゴを囲んでいる枠に「縦の中央揃え」を設定します */
section.sec-pagejump details summary {
  display: flex !important;
  align-items: center !important;
}
.pagejump-store-logo {
  height: 30px !important; /* PCでの高さ */
  width: auto !important;
  margin-left: 8px !important; /* 左の「NICE」ロゴとの少し隙間を空けます */
  /* ↓ 画像自体の余白の都合でまだズレて見える場合は、ここで微調整が可能です */
  margin-top: -6px !important; 
}
/* スマホ向けのサイズ調整 */
@media only screen and (max-width: 1024px) {
  .pagejump-store-logo {
    height: 20px !important; /* スマホでの高さ */
    /* margin-top: 1px !important; */
  }
}
/* --- スクロールダウン・インジケーター（おしゃれ・右端配置仕様） --- */

/* 基準となる親要素の位置設定 */
.sec-kv .kvImg {
  position: relative;
}

/* アニメーション全体の配置（右端の下部へ配置） */
.scroll-indicator {
  position: absolute;
  bottom: 0; /* 画像の一番下端にぴったり合わせる */
  z-index: 10; /* 画像より手前に表示 */
  
  /* 文字と線を美しく縦に並べる魔法のレイアウト設定 */
  display: flex;
  flex-direction: column;
  align-items: center;
	left: 50%;
  transform: translateX(-50%);
}
/* ▼▼ スマホ・タブレット用の設定（画面幅1024px以下の場合に適用） ▼▼ */
@media only screen and (max-width: 1024px) {
  .scroll-indicator {
    left: auto;        /* 中央配置を解除 */
    transform: none;   /* 中央配置の移動を解除 */
    right: 40px;       /* スマホでは右端から20pxの位置に配置 */
  }
}

/* "SCROLL" の文字デザイン（スタイリッシュな縦配置） */
.scroll-text {
  color: #ffffff; /* 文字の色（白） */
  font-family: 'Inter', sans-serif; /* 読みやすい英字フォント */
  font-size: 10px; /* おしゃれに見せるため少し小さめで上品に */
  letter-spacing: 0.3em; /* 文字と文字の間隔を大きく広げて抜け感を出す */
  text-transform: uppercase; /* 大文字に変換 */
  
  /* 英文字を時計回りに90度回転させて縦に並べる設定 */
  //writing-mode: vertical-rl;
  //margin-bottom: 15px; /* 下の線との隙間 */
  text-shadow: 0 0 4px rgba(0, 0, 0, 0.6); /* 空の色に溶け込まないための影 */
}

/* 下に伸びる線の背景（細く美しい長めのライン） */
.scroll-line {
  display: block;
  width: 1px; /* 太くならないよう確実な1px */
  height: 80px; /* おしゃれさを出すために長めに設定 */
  background-color: rgba(255, 255, 255, 0.25); /* 背景のうっすら白線 */
  position: relative;
  overflow: hidden; /* はみ出した光を隠す */
}

/* 上から下へ流れる光の線（アニメーション本体） */
.scroll-line::after {
  content: '';
  position: absolute;
  left: 0;
  width: 1px;
  background-color: #ffffff; /* 光る線の色（はっきりした白） */
  /* より滑らかで高級感のある動き（cubic-bezier）を採用 */
  animation: scrollRightEdgeAnim 2.2s infinite cubic-bezier(0.65, 0, 0.35, 1);
}

/* どんなブラウザでも美しく動く光のアニメーション定義 */
@keyframes scrollRightEdgeAnim {
  0% {
    top: 0;
    height: 0;
    opacity: 0; /* 最初は透明でふわっと現れる */
  }
  30% {
    opacity: 1; /* はっきりと光る */
  }
  50% {
    top: 0;
    height: 100%; /* 一番下まで線が伸びる */
  }
  100% {
    top: 100%;
    height: 0;
    opacity: 0; /* 下に消えながら透明になる */
  }
}
/* ==========================================
   ボタンのホバー効果（top.cssの流用・再設定）
   ========================================== */
/* 全ボタンに滑らかなアニメーションを設定 */
section.sec-pagejump details .pagejumpContents .btnList li a[href*="reserve"],
section.sec-pagejump details .pagejumpContents .btnList li a[href*="contact"],
.navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.btn-reserve-side,
.navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.btn-assess-side {
  transition: all 0.3s ease !important;
}

/* ホバー時のスタイル（パソコンなどマウスが使える環境のみ適用） */
@media (hover: hover) and (pointer: fine) {
  
  /* --- 1. ヘッダーナビ：ご来店予約 --- */
  section.sec-pagejump details .pagejumpContents .btnList li a[href*="reserve"]:hover {
    background-color: #ffffff !important;
    color: #03693B !important;
    /* レイアウトを崩さずに内側に枠線を描画するテクニック */
    box-shadow: inset 0 0 0 1px #03693B !important; 
  }
  
  /* --- 1. ヘッダーナビ：お問い合わせ --- */
  section.sec-pagejump details .pagejumpContents .btnList li a[href*="contact"]:hover {
    background-color: #ffffff !important;
    color: #8c6239 !important;
    box-shadow: inset 0 0 0 1px #8c6239 !important;
  }

  /* --- 2. 右側追従メニュー：ご来店予約 --- */
  .navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.btn-reserve-side:hover {
    background-color: #ffffff !important;
    color: #006838 !important;
    /* top.cssと同様に、うっすらとした影を外側に追加 */
    box-shadow: inset 0 0 0 1px #006838, 0 0 15px rgba(0, 0, 0, 0.16) !important;
  }

  /* --- 2. 右側追従メニュー：簡単査定依頼 --- */
  .navScrollWrapBox .nav-scroll .pagejumpContents .btnList li a.btn-assess-side:hover {
    background-color: #ffffff !important;
    color: #72a95f !important;
    box-shadow: inset 0 0 0 1px #72a95f, 0 0 15px rgba(0, 0, 0, 0.16) !important;
  }
}

/* ==========================================
   店舗情報のスマホ時表示順変更（画像を上にする）
   ========================================== */
@media only screen and (max-width: 767px) {
  /* 親要素をFlexboxにして縦並びに設定 */
  section.sec-storeInfo .storeInfoWrap {
    display: flex !important;
    flex-direction: column !important;
  }

  /* 画像エリアを1番目（上）に指定 */
  section.sec-storeInfo .storeInfoSliderWrap {
    order: 1 !important;
  }

  /* 概要エリアを2番目（下）に指定 */
  section.sec-storeInfo .storeInfoDetail {
    order: 2 !important;
  }
}
/* ==========================================
   物件検索：検索ボタンのアイコン位置と色調整
   ========================================== */
/* 左側の虫眼鏡アイコンの位置指定 */
section.sec-Search .submitBtn svg.search-icon {
  left: 20px;
  right: auto;
}

/* 右側の矢印アイコンの位置とサイズ指定 */
section.sec-Search .submitBtn svg.arrow-icon {
  left: auto;
  right: 20px; /* 右から20pxの位置に配置 */
  width: 14px; /* 矢印のサイズ（お好みで変更可能です） */
}

/* ホバー時（マウスを乗せた時）の矢印の色を黒にする */
section.sec-Search .submitBtn:hover svg.arrow-icon {
  fill: #000000; 
}
/* ==========================================
   スマートフォン用：メニュー開閉アイコンを三本線（ハンバーガー）に変更
   ========================================== */
@media only screen and (max-width: 1024px) {
  /* 1. 閉じている時の三本線を作る */
  section.sec-pagejump details::before {
    content: "" !important; /* 画像の指定を空にして図形を作ります */
    display: block !important;
    position: absolute !important;
    top: 24px !important; /* 上からの位置調整 */
    right: 20px !important; /* 右からの位置調整 */
    width: 24px !important; /* 線の長さ */
    height: 2px !important; /* 線の太さ */
    background-color: #000000 !important; /* 真ん中の線の色（黒） */
    filter: none !important; /* 過去の色変更フィルターを解除します */
    pointer-events: none !important; 
    transition: all 0.3s ease !important; /* なめらかに変形させる設定 */
    /* 上下の線を影（box-shadow）を使って表現します（-8pxが上、8pxが下） */
    box-shadow: 0 -8px 0 0 #000000, 0 8px 0 0 #000000 !important;
    z-index: 10001 !important;
    transform: none !important; /* 過去の回転設定を解除します */
  }

  /* 2. 開いた時の「×」のもう1本の線（普段は隠しておく） */
  section.sec-pagejump details::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 24px !important;
    right: 20px !important;
    width: 24px !important;
    height: 2px !important;
    background-color: #000000 !important;
    opacity: 0 !important; /* 閉じている時は透明で見えないようにします */
    transition: all 0.3s ease !important;
    pointer-events: none !important;
    z-index: 10001 !important;
    transform: none !important;
  }

  /* 3. メニューが開いた状態の時の動き（三本線から「×」に変形） */
  section.sec-pagejump details[open]::before {
    box-shadow: none !important; /* 上下の線を消します */
    transform: rotate(45deg) !important; /* 真ん中の線を45度回転させます */
  }

  section.sec-pagejump details[open]::after {
    display: block !important; /* 以前の非表示設定を上書きします */
    opacity: 1 !important; /* 見えるようにします */
    transform: rotate(-45deg) !important; /* 逆方向に45度回転させて「×」にします */
  }
}
/* SP版でメニュー展開時にフッターが被るのを防ぎ、背景の重なりも修正する */
@media only screen and (max-width: 1024px) {
  main#pxBase {
    position: static !important;
    z-index: auto !important;
  }
}
/* KV画像の左下にテキストを配置 */
.sec-kv .kvWrap .kvImg .kv-caption {
  position: absolute; /* 親要素（kvImg）を基準に自由に配置する設定 */
  bottom: 20px;       /* 下からの位置 */
  left: 20px;         /* 左からの位置 */
  z-index: 10;        /* 画像より手前に表示させる */
  margin: 0;          /* 最初からある余白を消す */
  
  /* 文字のデザイン */
  color: #ffffff;      /* 文字の色（白） */
  font-size: 13px;     /* 文字の大きさ */
  font-weight: 500;    /* 文字の太さ */
  letter-spacing: 0.05em; /* 文字の間隔を少し開ける */
  
  /* 背景のデザイン（写真と同化しないように薄い黒を敷く） */
  background-color: rgba(0, 0, 0, 0.4); 
  padding: 5px 10px;   /* 文字の周りの余白 */
  border-radius: 4px;  /* 背景の角を少し丸くする */
}

/* スマホ画面向けの調整（文字や位置を少し小さくします） */
@media only screen and (max-width: 767px) {
  .sec-kv .kvWrap .kvImg .kv-caption {
    bottom: 10px;
    left: 10px;
    font-size: 11px;
    padding: 3px 6px;
  }
}