/*-------------------------------*/
/*スマホ時のヘッダー header.php*/

/*widthが768px以上の時は隠しておく*/
.top_head_containar{
    display:none;
}
.top_head_containar_left{
    flex: 0 0 80%; /* フレックスボックス内で幅を80%に指定 */
}
.top_head_containar_right{
    flex: 0 0 20%; /* フレックスボックス内で幅を80%に指定 */
}

.line_pr,
.line_pr_sumaho {
    align-items: center;
    color: #333;
    font-size: 14px;
    line-height: 1.5;
}

.line_pr {
    display: flex;
    justify-content: flex-end;
}

.line_pr_sumaho {
    display: none;
    justify-content: center;
    padding: 8px 12px;
    background: #fff;
}

.footer-houritu {
    padding: 14px 20px;
    text-align: center;
    font-size: 13px;
    line-height: 1.8;
}

.footer-houritu a {
    color: inherit;
}

.fproinv-custom-search .screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/*スマホ時のヘッダーの設定はここまで*/
/*-------------------------------*/







/*-------------------------------*/
/* トップページのメインの画像の設定 _main-banner.php*/

.banner_costam {
    width: 100%;
    height: 85vh; /* 画面の高さ全体に設定 */
    display: flex; /* 子要素を中央揃えなどしたい場合に使用 */
    align-items: center; /* 子要素を垂直中央に配置 */
    justify-content: center; /* 子要素を水平方向に中央に配置 */

}

/* 背景画像を設定 */
.banner-img {
    width: 100%;
    height: 100%; /* 親要素に合わせて高さを設定 */
    background-image: var(--fproinv-main-visual, url('../images/hero-desktop.jpg')); /* 背景画像を設定 */
    background-size: cover; /* 画像を要素全体にカバー */
    background-position: center; /* 画像の中心を表示 */
    background-repeat: no-repeat; /* 画像の繰り返しを無効 */
    position: relative; /* 必要に応じて */
}


.top_banner_containar{
    position: absolute; /* テキストの位置を調整するために絶対配置 */
    top: 30%; /* 親要素の高さの中央に配置 */
    left: 50%; /* 親要素の幅の中央に配置 */
    text-align: center; /* テキストを中央揃え */
    transform: translate(-50%, -50%); /* 完全に中央に配置するための調整 */
}

/*トップページメイン画像の中のロゴ*/
.rogo_img img{
    width:200px;
    height:auto;
    margin-top:5%;
}

/* テキストのスタイル */
.top_banner_text {
    white-space: nowrap; /* テキストを改行させない */
    color: white; /* テキストの色を白に設定（背景によって変更） */
    font-size: 1.5em; /* テキストサイズを調整 */
    letter-spacing: 0.3em; /* 文字間を広く設定（0.1emは好みで調整） */

}

.object-fig-img {
    display: block;
    width: 100%; /* 親要素に合わせて幅を調整 */
    height: auto;
}

.overlay-text {
    position: absolute;
    top: 50%; /* 縦方向に中央に配置 */
    left: 50%; /* 横方向に中央に配置 */
    transform: translate(-50%, -50%); /* 完全に中央に配置 */
    color: white; /* テキストの色を白に設定 */
    font-size: 24px; /* フォントサイズを調整 */
    font-weight: bold; /* 太字に設定 */
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); /* テキストに影を付ける */
    background-color: rgba(0, 0, 0, 0.5); /* 半透明の黒い背景 */
    padding: 10px 20px; /* テキスト周りに余白を追加 */
    border-radius: 5px; /* テキスト背景の角を丸くする */
    z-index: 10; /* 画像より前面に表示 */
}

/* トップページのメインの画像の設定はここまで*/
/*---------------------------------------*/







/*---------------------------------------------*/
/*物件サーチ結果のボタンや概要の見た目*/

.bukken_result_display_containar {
    display: flex; /* 横並びにする */
    justify-content: center; /* 中央に寄せる */
    gap: 10px; /* ボタン間のスペースを調整 */
    padding: 20px;
}

.bukken_result_display_containar div {
    display: flex; /* 各ボタンをフレックスボックスに */
    align-items: center; /* 垂直方向に中央揃え */
    justify-content: center; /* 水平方向に中央揃え */
}

.bukken_result_display_containar div a,
.bukken_result_display_containar div span {
    background-color: #4CAF50; /* 背景色 */
    color: white; /* テキストカラー */
    border: none; /* ボーダーを削除 */
    padding: 10px 20px; /* パディングでボタンサイズを調整 */
    text-align: center; /* テキストを中央に配置 */
    text-decoration: none; /* 下線を削除 */
    display: inline-flex; /* インラインフレックスでアイコンとテキストを横並びに */
    align-items: center; /* アイコンとテキストを垂直に中央揃え */
    justify-content: center; /* アイコンとテキストを中央に配置 */
    font-size: 16px; /* フォントサイズ */
    border-radius: 5px; /* 角を丸くする */
    transition: background-color 0.3s ease; /* 背景色変更のアニメーション */
    width: 150px; /* 幅を揃える */
}

.bukken_result_display_containar div a i,
.bukken_result_display_containar div span i {
    margin-right: 8px; /* アイコンとテキストの間にスペースを追加 */
}

.bukken_result_display_containar div a:hover,
.bukken_result_display_containar div span:hover {
    background-color: #45a049; /* ホバー時の背景色変更 */
}

.search-house-info table {
    width: 100%; /* 自動調整 */
}


/*物件サーチ結果のボタンや概要の見た目はここまで*/
/*---------------------------------------------*/






/*-------------------------*/
/*スマホメニューの設定*/


/*スマホメニューのお問い合せを非表示にする*/
#js_ghost_menu .el_ghost_menu_item:nth-child(6) {
        display: none;
}
/*スマホメニューのテーマ購入を非表示にする*/
#js_ghost_menu .el_ghost_menu_item:nth-child(7) {
        display: none;
}

/*ハンバーガーメニューの設定*/
#js_toggle_menu {
    position: fixed;  /* メニューを固定する */
    top: 10px;           /* 画面の上部に固定 */
    right: 20px;          /* 左端に配置 */
    z-index: 9999;    /* メニューが他の要素の上に表示されるようにする */
    background-color: transparent;  /* 背景色を透明に設定 */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* 下に影をつけて際立たせる */
}

#js_toggle_menu .three::after {
    content: "menu";  /* 表示するテキスト */
    display: block;   /* ブロック要素として表示 */
    text-align: center;  /* テキストを中央揃え */
    font-size: 12px;  /* 文字サイズ */
    color: #000;      /* 文字色（必要に応じて調整） */
    margin-top: 5px;  /* アイコンとの間に余白を追加 */
}

/* onクラスが付与された時、疑似要素を消す */
#js_toggle_menu.on .three::after {
    content: "";
}

/*スマホメニューの設定はここまで*/
/*-------------------------*/





/*-------------------------*/
/*その他の設定*/

/*フッターのお気に入りボタンの見た目*/
.okini_btn {
    display: flex; /* フレックスボックスで中央寄せ */
    justify-content: center; /* 水平方向に中央寄せ */
    align-items: center; /* 垂直方向に中央寄せ（もし高さが固定されている場合） */
    margin: 20px 0; /* 上下にマージンを追加して余白を取る */
}
.okini_btn a {
    background-color: #4CAF50; /* ボタンの背景色 */
    color: white; /* テキストの色 */
    padding: 12px 24px; /* パディングでボタンサイズを調整 */
    text-decoration: none; /* 下線を削除 */
    font-size: 18px; /* フォントサイズ */
    border-radius: 25px; /* 角を丸くしてボタン風に */
    transition: background-color 0.3s ease, transform 0.3s ease; /* 背景色と拡大のアニメーション */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* 軽いボックスシャドウで立体感を追加 */
}
.okini_btn a:hover {
    background-color: #45a049; /* ホバー時の背景色変更 */
    transform: scale(1.05); /* ホバー時に少し拡大して動きを追加 */
}


/*物件詳細ページのお気に入りの見た目*/
.favorite-cnt {
    font-size: 1.2em; /* テキストサイズを1.2emに設定 */
}

.favorite-cnt span {
    font-size:1.5em;
}


/*強みの説明文*/
.tuyomi_text{
    background-color: rgba(255, 255, 255, 0.5); /* 背景色を白にし、透明度を50%に設定 */
    width: 95%; /* 親要素の幅の95%に設定 */
    padding: 10px; /* 少し余白を追加 */
    margin: 5px auto; /* 中央に配置 */
}


/*条件に近い物件の枠の余白*/
.new-info-list-details{
    padding:0 5px 0 5px;
}

/*問い合わせタイトル*/
.toiawase_title{
    text-shadow:
        -1px -1px 0 #fff, /* 左上 */
        1px -1px 0 #fff,  /* 右上 */
        -1px 1px 0 #fff,  /* 左下 */
        1px 1px 0 #fff;   /* 右下 */
}

/*トップページの当社の強みの文字*/
.strong_title {
    text-shadow:
        -1px -1px 0 #fff, /* 左上 */
        1px -1px 0 #fff,  /* 右上 */
        -1px 1px 0 #fff,  /* 左下 */
        1px 1px 0 #fff;   /* 右下 */
}


/*投稿ページの他のページへのリンクを非表示*/
.nav-links .nav-previous,.nav-links .nav-next{
    display:none;
}

/*投稿ページの一番したの線*/
nav.post-navigation{
    border-top:0;
}

/*物件詳細の上のボタンが表示されるエリアを非表示*/
.details-title{
    display:none;
}

/*トップページおすすめ物件のタイトルの設定*/
.new-info-title{
    margin-bottom: 0;/*上下の隙間*/
}

/*2つ目のボタンを非表示する*/
.header-cnt2{
    display: none;
}
/*2つ目のボタンを非表示する*/
.header-cnt2 .loan{
	display:none;
}
/*ヘッダーの物件検索ボタン*/
.search-condition{
	display:none;
}

/*箇所不明*/
.part1 ul li:nth-child(1),
.part1 ul li:nth-child(3) {
    display: none;
}

/*物件のカテゴリー表示設定*/
.bukken_category_span{
    width: 100px;
    padding: 5px;
    color: #fff;
    background: #015dac;
    background-image: radial-gradient(#0175d5 13%, transparent 13%), radial-gradient(#0175d5 13%, transparent 13%);
    background-size: 20px 20px;
    background-position: 0 0, 25px 25px;
    box-sizing: border-box;
    text-align: center;
    display: inline-block;
    margin-bottom:10px;
}

/*トップページおすすめ物件の見た目*/
.info-intr-part1 a{
width:120px;
    padding: 5px 5px;
    margin: 5px;
    background-color: #FF0000 !important; /* 背景色を赤に設定 */
    font-size: 1.1em; /* フォントサイズを相対的に1.1倍大きくする */
    font-weight: bold;
    color: #fff !important; /* 文字色を白にする */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* 影をつける */
}

/*物件詳細画面の所在地でグーグルマップのアイコンをだす*/
.googlemap_link::before {
    content: "\f3c5"; /* fa-map-marker-alt のUnicode */
    font-family: "Font Awesome 5 Free"; /* Font Awesomeを指定 */
    font-weight: 900; /* アイコンのスタイルを太くする */
    display: inline-block;
    margin-right: 8px; /* テキストとの間隔を調整 */
    vertical-align: middle;
    font-size: 20px; /* アイコンの大きさ */
}

/*copyrightを非表示に*/
.copyright{
    display:none;
}


/*その他の設定ここまで*/
/*-------------------------*/






/*------------------------------------------------------*/
/*----フッターの設定はここから---*/

.footer-section{
    background-color:#7AA1D5;
}


/*----フッターの設定はここまで---*/
/*------------------------------------------------------*/


/*------------------------------------------------------*/
/*----ヘッダーのサブメニューの設定はここから---*/

/* サブメニューを最初は非表示にする */
.main-nav .sub-menu {
    display: none; /* 初期状態で非表示 */
    position: absolute;
    top: 100%; /* 親メニューの直下に配置 */
    left: 0; /* 親メニューと左揃え */
    background-color: white;
    list-style-type: none;
    padding: 0;
    margin: 0;
    z-index: 9999; /* 高い値に設定して前面に表示 */
    width: 100%; /* 親メニューの幅に合わせる */
}

/* 親メニューのアイテムにホバーした時にサブメニューを表示 */
.main-nav li.menu-item-has-children:hover > .sub-menu {
    display: block; /* ホバー時に表示 */

}

/* サブメニューのアイテム */
.main-nav .sub-menu li {
    display: block;
    text-align: center; /* テキストを中央揃え */
    white-space: nowrap; /* テキストが折り返されないように */
}

/* サブメニューのリンクのスタイル */
.main-nav .sub-menu li a {
    text-decoration: none;
    color: #333; /* テキストの色 */
    display: block;
    min-width: 237px; /* リンク全体を親の幅に合わせる */
    padding: 10px 0px; /* 上下に余白を追加 */
    text-align: center; /* テキストを中央に揃える */
}

/* 親メニューのアイテム */
.main-nav li {
    position: relative; /* サブメニューの位置が親メニューに対して相対的になるように設定 */
}

/* サブメニューのホバー時の背景色を親項目に合わせる */
.main-nav .sub-menu li a:hover {
    background-color: black; /* 背景色を黒に設定 */
    color: white; /* ホバー時にテキストを白にする */
    min-width: 237px; /* 親の幅に合わせる */
}

/*----ヘッダーのサブメニューの設定はここまで---*/
/*------------------------------------------------------*/







/*------------------------------------------------------*/
/*----全体のレイアウトを1カラムにする---*/

.main-content {
    display: block; /* flexをblockに変更 */
}

.main-content .left,
.main-content .right {
    width: 100%; /* 両方のカラムを100%の幅に設定 */
}

.main-content .left {
    display:none;
    margin-bottom: 20px; /* 左カラムが上に来るようにして、下に余白をつける */
}


/*----全体のレイアウトを1カラムにするはここまで---*/
/*------------------------------------------------------*/







/*------------------------------------------------------*/
/*物件検索結果一覧の物件種別のマーク*/

.info-intr-part_custom {
    display: flex; /* 子要素を横並びにする */
    gap: 1px; /* 要素間に余白を設定*/
}


.info-intr-part_custom span {
    width:150px;
    padding: 5px 5px;
    color: #000;
    font-size: 1.1em;
    border-radius: 2vh;
    background-image: -webkit-gradient(linear, right top, left top, from(#9be15d), to(#00e3ae));
    background-image: -webkit-linear-gradient(right, #9be15d 0%, #00e3ae 100%);
    background-image: linear-gradient(to left, #9be15d 0%, #00e3ae 100%);

}

/*物件検索結果一覧の物件種別のマークはここまで*/
/*------------------------------------------------------*/







/*------------------------------------------------------*/
/*検索フォーム全体のスタイル*/

.search-title h3{
    font-size: 1em;
}

.selection-title-chiled{
    font-size: 1.2em;
    position: relative;
    padding: 0 65px;
    text-align: center;
}

.selection-title-chiled:before{
    position: absolute;
    top: calc(50% - 1px);
    left: 0;
    width: 100%;
    height: 2px;
    content: '';
    background: #000;
}

.selection-title-chiled span{
    position: relative;
    padding: 0 1em;
    background: #F5F5F5;
}

.selection-title {
cursor: pointer; /* ポインター（手の形）に変更 */
    font-size: 16px; /* フォントサイズを大きく */
    font-weight: bold; /* 太字にする */
    color: #333; /* テキストカラー */
    padding: 5px 5px; /* 内側の余白（上下10px、左右20px） */
    background-color: #f9f9f9; /* 背景色を淡いグレーに */
    border: 2px solid #007bff; /* 青い枠線 */
    border-radius: 8px; /* 角を丸める */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* ボックスシャドウで立体感を出す */
    text-align: center; /* タイトルを中央揃え */
    width: 100%; /* 全幅を占める */
    margin-bottom: 20px; /* 下部に余白を追加 */
}


/* 全体のマージンとスタイル */
.region, .property-type, .category-type, .price-range, .rimawari-range, .madori-type, .area-range, .toho-range {
    margin-bottom: 20px;
}

/* 見出しのスタイル */
.region h3, .property-type h3, .category-type h3, .price-range h3, .rimawari-range h3, .madori-type h3, .area-range h3, .toho-range h3 {
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
}

/* チェックボックスグループ */
.checkbox-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start; /* 左揃え */
    align-items: center; /* 垂直方向の中央揃え */
}

/* チェックボックスアイテム */
.checkbox-item {
    display: flex;
    align-items: center; /* チェックボックスとテキストを垂直方向に揃える */
    width: 25%; /* 各アイテムの横幅を25%に設定 */
    box-sizing: border-box;
    margin-bottom: 10px;
    gap: 3px; /* チェックボックスとテキストの間隔 */
}

/* チェックボックスとラジオボタンのスタイル変更 */
input[type="checkbox"], input[type="radio"] {
    transform: scale(1); /* サイズを1.2倍に拡大 */
    cursor: pointer;
}

/* チェックボックスとラジオボタンのラベル */
.checkbox-item label, .toho-range .checkbox-item label {
    font-size: 16px;
    cursor: pointer;
    margin-left: 5px; /* チェックボックスとテキストの間隔を調整 */
}

/* チェックボックスやラジオボタンが選択されたときのカラー */
input[type="checkbox"]:checked, input[type="radio"]:checked {
    accent-color: #007bff; /* 選択時のカラーを青に変更 */
}

/* ラジオボタンのカスタムデザイン */
input[type="radio"] {
    width: 20px;
    height: 20px;
    border: 2px solid #007bff;
    border-radius: 50%;
    outline: none;
    appearance: none;
    position: relative;
}

input[type="radio"]:checked::before {
    content: '';
    display: block;
    width: 12px;
    height: 12px;
    background-color: #007bff;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* チェックボックスのカスタムデザイン */
input[type="checkbox"] {
    width: 24px; /* チェックボックスのサイズ */
    height: 24px;
    border: 2px solid #007bff; /* 枠の色を青に */
    outline: none;
    appearance: none;
    position: relative;
    background-color: transparent; /* 青丸がつかないように背景色を透明に */
    cursor: pointer;
    border-radius: 0px; /* 枠を四角にする */
}

input[type="checkbox"]:checked::before {
    content: ''; /* チェックマークの代わりに●を表示 */
    display: block;
    background-color: #007bff; /* 青色の丸 */
    border-radius: 50%; /* ●を丸くする */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* ●を中央に寄せる */
    width: 50%; /* ●のサイズを調整 */
    height: 50%;
}

/* 隠すためのクラス */
.hidden {
    display: none;
}

/* すべて選択ボタンのスタイル */
.select-all-btn {
    margin-bottom: 10px;
    padding: 5px 10px;
    background-color: #007bff;
    color: white;
    border: none;
    cursor: pointer;
    font-size: 14px;
    border-radius: 4px;
}

.select-all-btn:hover {
    background-color: #0056b3;
}

/* 価格セクションと表面利回りセクションを縦に並べる */
.price-range, .rimawari-range {
    display: block; /* ブロックレベルで表示して改行を行う */
    margin-bottom: 20px;
}

.price-select, .rimawari-select {
    margin-top: 10px; /* タイトルとの間に余白を追加 */
    display: inline-block;
}

.price-select label, .rimawari-select label {
    margin-right: 5px;
}

select {
    padding: 5px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* 駅からの徒歩セクションも縦に並べる */
.toho-range {
    display: block; /* ブロックレベルで表示して改行を行う */
    margin-bottom: 20px;
}

.toho-range .checkbox-item {
    margin-top: 10px; /* タイトルと項目の間に余白を追加 */
}

.toho-range input[type="radio"] {
    margin-right: 5px;
}

/* 検索ボタンのデザイン */
.side-search-btn {
    background-color: #007bff;
    color: #fff;
    border: none;
    padding: 15px 60px; /* 横長にするための幅を調整 */
    cursor: pointer;
    font-size: 16px;
    border-radius: 4px;
    display: block; /* ブロック要素にしてセンター寄せができるように */
    margin: 20px auto; /* 上下に余白をつけてセンター寄せ */
    width: fit-content; /* ボタンの幅をコンテンツに合わせる */
}

.side-search-btn:hover {
    background-color: #0056b3;
}


/* ボタン全体のデザイン */
button {
    transition: background-color 0.3s ease;
}

/*枠の隙間*/
.search-container{
    padding: 10px;
}

/*検索フォーム全体のスタイルはここまで*/
/*------------------------------------------------------*/




/*---------------------------------------------*/
/*物件サーチ結果のボタンや概要の見た目*/

.bukken_result_display_containar {
    display: flex; /* 横並びにする */
    justify-content: center; /* 中央に寄せる */
    gap: 10px; /* ボタン間のスペースを調整 */
    padding: 20px;
}

.bukken_result_display_containar div {
    display: flex; /* 各ボタンをフレックスボックスに */
    align-items: center; /* 垂直方向に中央揃え */
    justify-content: center; /* 水平方向に中央揃え */
}

.bukken_result_display_containar div a,
.bukken_result_display_containar div span {
    background-color: #4CAF50; /* 背景色 */
    color: white; /* テキストカラー */
    border: none; /* ボーダーを削除 */
    padding: 10px 20px; /* パディングでボタンサイズを調整 */
    text-align: center; /* テキストを中央に配置 */
    text-decoration: none; /* 下線を削除 */
    display: inline-flex; /* インラインフレックスでアイコンとテキストを横並びに */
    align-items: center; /* アイコンとテキストを垂直に中央揃え */
    justify-content: center; /* アイコンとテキストを中央に配置 */
    font-size: 16px; /* フォントサイズ */
    border-radius: 5px; /* 角を丸くする */
    transition: background-color 0.3s ease; /* 背景色変更のアニメーション */
    width: 150px; /* 幅を揃える */
}

.bukken_result_display_containar div a i,
.bukken_result_display_containar div span i {
    margin-right: 8px; /* アイコンとテキストの間にスペースを追加 */
}

.bukken_result_display_containar div a:hover,
.bukken_result_display_containar div span:hover {
    background-color: #45a049; /* ホバー時の背景色変更 */
}

.search-house-info table {
    width: 100%; /* 自動調整 */
}


/*物件サーチ結果のボタンや概要の見た目はここまで*/
/*---------------------------------------------*/


























/*------------------------------------------------------*/
/*レシポンシブ対応 1000px以下の表示*/

@media (max-width: 1000px) {
    /*スマホ時はヘッダーを非表示にする*/
    .header-section.wrapper{
        display:none;
    }

    /*スマホ時のヘッダー　javascritで、mainタグがtop:0になったらでてくる*/
    .sumaho_top_head_containar{
        position: fixed; /* 上部に固定するために固定ポジションを指定 */
        top: 0; /* 上端に固定 */
        left: 0; /* 左端に固定 */
        width: 100%; /* 横幅を全体に広げる */
        height:50px;
        z-index: 99999; /* 他の要素の前面に表示するために適宜z-indexを設定 */
        background-color: #fff; /* 必要に応じて背景色を指定（透明や背景色がある場合） */
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* 影をつけて浮き上がらせる場合 */
        display:flex;
    }

    /*スマホ時のトップページのメイン画像*/
    .banner-img {
        background-image: var(--fproinv-main-visual-mobile, url('../images/hero-mobile.jpg'));
    }
    .banner_costam {
        height: 100vh; /* 画面の高さ全体に設定 */
    }


    /*トップのロゴや電話番号の表示*/
    .index-title{
        width:100%;
    }
    .logo-container{
        display:none;
    }

    .line_pr {
        display: none;
    }

    .line_pr_sumaho {
        display: flex;
    }

    .header-section{
        padding-top:0;
    }

    /*メインの幅の余白をつける*/
    .main-content {
        padding: 0;
    }



    /*おすすめ物件のエリアの設定*/
    .new-info-list{
        padding:20px 5px 0 5px;
    }
    .new-info-list ul li {
        display: block;  /* 各リスト項目を縦並びに */
        width: 100%;  /* 各リスト項目の幅を100%に設定 */
        box-sizing: border-box;  /* パディングやボーダーが幅に影響しないようにする */
        margin-bottom: 20px;  /* 項目間に余白を追加（必要に応じて調整） */
    }

    /*条件に近い物件の表示の設定*/
    .new-info-list-details ul li {
        display: block;  /* 各リスト項目を縦並びに */
        width: 100%;  /* 各リスト項目の幅を100%に設定 */
        box-sizing: border-box;  /* パディングやボーダーが幅に影響しないようにする */
        margin-bottom: 20px;  /* 項目間に余白を追加（必要に応じて調整） */
    }
    .checkbox-item {
        width: 33.33%; /* 横に3つ表示 */
    }
    .concept1{
        padding-bottom:20px;
    }


}

/*スマホの表示はここまで*/
/*------------------------------------------------------*/