@charset "utf-8";
/* 敷地配置（LANDPLAN）※アルファステイツ北長野のランドプランを踏襲 */
#pankuzu { margin: 0px 0; padding: 20px 0; background: #edece1; }

/* 敷地配置（メイン） */
.concept_area2 { background: #fff; padding: 80px 0; text-align: center; }
.concept_area2 h3 { font-size: 30px; letter-spacing: 0.2em; color: #b1a57a; line-height: 1.6; }
.concept_area2 .txt { padding: 30px 0 0; text-align: center; font-size: 18px; line-height: 2.2; }
.concept_area2 .txt span { font-size: 13px; }
.concept_area2 .zu { position: relative; margin-top: 40px; }
.concept_area2 .zu img { width: 100%; height: auto; max-width: 900px; }

.concept_area2 ul,
.concept_area2 li { margin: 0; padding: 0; list-style: none; }
.concept_area2 > .inner--base > ul { display: flex; flex-wrap: wrap; justify-content: space-between; }
.concept_area2 li { width: 22%; margin-top: 40px; }
.concept_area2 li .img { position: relative; }
.concept_area2 li .img img { width: 100%; height: auto; }
.concept_area2 li h4 { font-size: 14px; color: rgb(67, 19, 20); padding: 0 0 10px 0; margin: 16px 0; border-bottom: 1px solid rgb(67, 19, 20); text-align: left; }
.concept_area2 li .txt { text-align: left; line-height: 1.8; font-size: 14px; padding: 0; }
.concept_area2 li .txt span { font-size: 12px; }

/* 防災倉庫 */
.concept_area2 .bousai { width: 72%; background: #eae4d0; box-sizing: border-box; padding: 60px 30px 30px; position: relative; margin-top: 20px; }
.concept_area2 .bousai h5 { position: absolute; left: 0; top: 0px; background: #000; color: #fff; font-size: 18px; padding: 8px; margin: 0; }
.concept_area2 .bousai > ul { display: flex; flex-wrap: wrap; justify-content: space-between; }
.concept_area2 .bousai li.st1 { width: 32%; margin-top: 0; }
.concept_area2 .bousai li.st2 { width: 65%; margin-top: 0; }
.concept_area2 .bousai li h4 { margin-top: 0; text-align: left; }
.concept_area2 .bousai .waku { background: #fff; padding: 10px; margin-top: 10px; text-align: left; font-size: 13px; }
.concept_area2 .bousai .waku span { font-size: 12px; }
.concept_area2 .bousai .img2 { margin-top: 30px !important; }
.concept_area2 .bousai .img2 img { width: 100%; }

/* 宅配ボックス：PCでは防災倉庫（bousai 72%）と同じ行の右側に置く（22%＋72%＝94%） */
.concept_area2 > .inner--base > ul > li.takuhai { order: 1; margin-top: 20px; }

/* 平面駐車場という価値 */
.concept_area3 { background: #edece1; padding: 80px 0; text-align: center; }
.concept_area3 .inner--base { width: 960px; max-width: 92%; }
.concept_area3 h3 { margin: 0 0 40px; }
.concept_area3 h3 img { width: 100%; max-width: 620px; height: auto; }
.concept_area3 h3 img.pc { max-width: 900px; }
.concept_area3 h3 img.sp { max-width: 340px; }
.concept_area3 .txt { text-align: center; font-size: 15px; line-height: 2; padding: 0 0 40px; }
.concept_area3 > .inner--base > p img { width: 100%; height: auto; }
.concept_area3 > .inner--base > p { margin-top: 40px; }

/* .txt内の注釈spanは行間を少し狭く（PC/SP共通） */
.concept_area2 .txt span,
.concept_area3 .txt span { line-height: 1.5; }

/* 注記（共通CSSのpaddingは活かし、上マージンのみ0に） */
#landplan .notes-area { margin-top: 0; }

.pc { display: block; }
.sp { display: none; }

@media screen and (max-width: 810px) {/*スマホ設定*/
	.sp { display: block; }
	.pc { display: none; }

	#landplan .inner--base { margin-inline: 12px; }

	.concept_area2 { padding: 40px 0; }
	.concept_area2 h3 { font-size: 22px; }
	.concept_area2 .txt { font-size: 15px; line-height: 2; text-align: left; }
	.concept_area2 li { width: 48%; }
	.concept_area2 li .txt { font-size: 13px; padding: 0; }

	.concept_area2 .bousai { width: 100%; padding: 50px 20px 20px; }
	.concept_area2 .bousai h5 { font-size: 15px; top: 0px; }
	.concept_area2 .bousai li.st1 { width: 100%; }
	.concept_area2 .bousai li.st2 { width: 100%; margin-top: 20px; }
	.concept_area2 .bousai .waku { font-size: 11px; }
	.concept_area2 .bousai .waku span { font-size: 10px; }

	/* SPは並び替えせずDOM順（防犯カメラの次）に表示 */
	.concept_area2 > .inner--base > ul > li.takuhai { order: 0; margin-top: 40px; }

	.concept_area3 { padding: 40px 0; }
	.concept_area3 .inner--base { width: 96%; max-width: 96%; }
}