/*list-grid1
---------------------------------------------------------------------------*/
/*list内の全ての要素のマージンを一旦リセット*/
.fudosan16-list-grid1 .fudosan16-list * {
	margin: 0;
	padding: 0;
}

/*listブロック全体を囲むブロック*/
.fudosan16-list-grid1 {
	display: grid;
    grid-template-columns: repeat(1, 1fr);	/*2列にする指定。3列にしたければrepeat(3, 1fr)とする。*/
    gap: 1rem;	/*ブロックの間に空けるマージン的な指定*/
}


	/*画面幅800px以上の追加指定*/
	@media screen and (min-width:800px) {

	/*listブロック全体を囲むブロック*/
	.fudosan16-list-grid1 {
		grid-template-columns: repeat(4, 1fr);	/*4列にする指定*/
	}

	}/*追加指定ここまで*/


/*ボックス１個あたり*/
.fudosan16-list-grid1 .fudosan16-list {
	position: relative;
	overflow: hidden;
    display: grid;
	padding: 0.5rem;		/*ボックス内の余白*/
	background: #fff;		/*背景色*/
    grid-template-rows: auto auto 1fr;	/*1つ目と2つ目（この場合はfigureとh4）は自動に、3つ目（この場合はtextブロック））を残った高さで占める*/
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、ぼかし幅。0,0,0は黒の事で0.2は色が20%ついた状態。*/
}

/*ボックス内のh4見出し*/
.fudosan16-list-grid1 .fudosan16-list h4 {
	color: var(--primary-color);
}
.fudosan16-list-grid1 .fudosan16-list h4 a {
	color: inherit;
}

/*ボックス内のp要素*/
.fudosan16-list-grid1 .fudosan16-list p {
	font-size: 0.7rem;	/*文字サイズを70%に*/
	line-height: 1.5;	/*行間を少し狭く*/
}

/*ボックス内のfigure画像*/
.fudosan16-list-grid1 .fudosan16-list figure img {
	margin-bottom: 0.5rem;	/*画像の下に空けるスペース*/
}


/*色アイコン
---------------------------------------------------------------------------*/
/*色アイコン 共通*/
.fudosan16-icon {
	display: inline-block;
	line-height: 1;
	padding: 5px 10px !important;
	border-radius: 3px;
	font-size: 0.6rem;
	margin-left: 0.5rem !important;
	position: relative;bottom: 0.2rem;
	font-weight: 400;
}

/*red-iconへの追加指定。*/
.fudosan16-black-icon {
	background: #fff;	/*背景色*/
	color: #000;			/*文字色*/
	border: solid black 1px;
}

/*gray-iconへの追加指定。*/
.fudosan16-gray-icon {
	background: #a5a5a5;	/*背景色*/
	color: #d0d0d0;			/*文字色*/
}


/*option帯リボン
---------------------------------------------------------------------------*/
/*option1,option2 共通*/
.fudosan16-option1, .fudosan16-option2 {
	font-size: 0.7rem;	/*文字サイズ。remの単位についてはテンプレート内の解説をお読み下さい。*/
	display: inline-block;
	width: 200px;
	text-align: center;
	position: absolute;
	top: 0px;
	left: 0px;
	transform: translate(-60px, 20px) rotate(-30deg);	/*translateは配置場所の指定。rotateは回転。*/
	box-shadow: 0px 3px 2px rgba(0,0,0,0.2);			/*影*/
}

/*h2タグ内で使った場合のoption1,option2 共通（※CMS用）*/
h2 .fudosan16-option1, h2 .fudosan16-option2 {
	width: auto;
	position: relative;
	transform: translate(0px, -4px) rotate(0deg);
	padding: 5px 20px;
	margin-left: 10px;
}

/*option1への追加指定。*/
.fudosan16-option1 {
	background: #fffd55;	/*背景色*/
	color: #000000;			/*文字色*/
}

/*option2への追加指定。*/
.fudosan16-option2 {
	background: #ccc;		/*背景色*/
	color: #888;			/*文字色*/
}


/*テーブル
---------------------------------------------------------------------------*/

dl.line {
	font-size: 9pt;
}

dl.line dt.line {
    width: 10em;
}

dl.line dd.line {
    width: calc(100% - 10em);
}

dl.line dt.line, dl.line dd.line {
    padding-left: 5px;
    padding-right: 5px;
}

dl.line dd.line {
	font-weight: 400;
}