/*
Theme Name: Sinwa Bussan ver 4.1
Theme URI:
Author: SHOKODO Co.,Ltd
Description: 物件アーカイブおよび物件詳細ページ「更新料」の表示位置変更。他、軽微不具合調整。詳細はchangelog.txt参照。
Version: 4.1
*/
/*================================================
【MediaQuery】
Small / max-width: 639px
	(max-width: 639px min-width: 521px)
	(max-width: 520px)

Medium / max-width: 959px - min-width: 640px
	(max-width: 959px min-width: 781px)
	(max-width: 780px min-width: 640px)

Large / min-width: 960px
--------------------------------------------------
【使用カラー】
茶色
　#332f00(50,47,0) 文字色
　#8c6239　画像上のライン
	#d6d6cc　ボタンhover背景
黄緑色
　#86bd42　footer背景色
　#a0d850　物件詳細項目タイトル
紺色
　#221f66
赤色
　#e6002e
ベージュ
　#f8f6eb　テクスチャが表示されるまで表示する色
==================================================*/
html {
  width: 100%;
	height: 100%;
  margin: 0;
  padding: 0;
  scroll-behavior: smooth;
}

body {
	font-family: "Zen Maru Gothic", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 16px;
	color: #322f00;
	margin: 0;
	padding: 0;
	background-color: #fff;
}
/* ドロワー展開時に背景をスクロールさせない */
.wrap {
	inset: 0;
	overflow: auto;
}
/*-------------------------------------------------
  Heading
--------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	font-family: "Zen Maru Gothic", serif;
	font-weight: 700;
	font-style: normal;
}
h1 { font-size: 175%; }
h2 { font-size: 150%; }
h3 { font-size: 125%; }
h4, h5, h6 { font-size: 100%; }

/* new upマークをタイトルに横並びにする */
.entry-title a,
.entry-title {
	display: flex;
	align-items: center;
}
/*-------------------------------------------------
  Link
--------------------------------------------------*/
a {
	color: #322f00;
	text-decoration: none;
}
	a:hover {
		text-decoration: underline;
	}
/*---------------------------------------------------
  Font
---------------------------------------------------*/
/* 金額の、万円、円を小さめ
	 プラグイン内で指定 */
.p-small {
	font-size: 75%;
}
/* new upマーク */
.bukken-item .new_mark,
.bukken-item .up_mark {
	min-height: 26px;
}
#list_simplepage2 .entry-title .new_mark,
#list_simplepage2 .entry-title .up_mark {
	min-height: 30px;
}
.new_mark {
	position: absolute;
	top: 0.5em;
	left: 0;
	display: inline-block;
	line-height: 0.8;
	margin: 0 0.5em;
	padding: 0.5em;
	color: #fff;
	font-size: 80%;
	background-color: #a32100;
	border-radius: 3px;
}
.up_mark {
	position: absolute;
	top: 0.5em;
	left: 0;
	display: inline-block;
	line-height: 0.8;
	margin: 0 0.5em;
	padding: 0.5em;
	color: #fff;
	font-size: 80%;
	background-color: #a32100;
	border-radius: 3px;
}
/*---------------------------------------------------
	Frame
---------------------------------------------------*/
main {
	margin: 0 auto;
	padding: 0;
	min-height: 300px;
}
/*---------------------------------------------------
  header
	Drawerの中身はdrawer.css
---------------------------------------------------*/
header {
	position: relative;
	z-index: 10;
	display: grid;
  grid-template-rows: 60px;
	background-color: #fff;
}
.contact-area {
	box-sizing: border-box;
	color: #fff;
	text-align: center;
	background-color: #807800;
}
.contact-area a,
.contact-area a:hover {
	color: #fff;
	text-decoration: none;
}
.corp-name-area {
	font-size: 75%;
	padding-left: 5px;
	padding-top: 5px;
	box-sizing: border-box;
}
.phone-area {
	font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 900;
  font-style: normal;
	margin-left: 0;
}
  .phone-area a {
    display: block;
		width: 100%;
  }
.phone-area i {
	display: block;
	width: 60px;
	height: 60px;
	text-align: center;
	line-height: 60px;
	color: #fff;
	background-color: #322f00;
}
.phone-area span {
	font-size: 175%;
	font-weight: 700;
	color: #a32100;
}
/*----------------------------------------------------------
  Slide
----------------------------------------------------------*/
#main-slide {
	position: relative;
	display: block;
	width: 100%;
	margin: 0 auto;
	padding: 0;
}
	#main-slide .slides {
		display: block;
		width: 100%;
		margin: 0 auto;
		padding: 0;
	}
		#main-slide .slides li {
			text-align: center;
		}
.layer-text {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}
/*----------------------------------------------------------
  To Top
----------------------------------------------------------*/
.pagetop {
	height: 50px;
	width: 50px;
	position: fixed;
	padding: 18px 0 0 18px;
	box-sizing: border-box;
	background: #fff;
	border: solid 2px #322f00;
	border-radius: 50%;
	justify-content: center;
	align-items: center;
	z-index: 2;
	cursor: pointer;
}
	.pagetop__arrow {
		display: block;
		height: 10px;
		width: 10px;
		border-top: 3px solid #322f00;
		border-right: 3px solid #322f00;
		transform: translateY(20%) rotate(-45deg);
	}
/*----------------------------------------------------------
  Footer
----------------------------------------------------------*/
footer {
	padding: 2em 0 0 0;
	color: #fff;
	background: url(images/back-greentex.png) #a0d850 repeat;
}
	footer a {
		color: #fff;
	}
	.inner-foot {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	#aboutus-area {
		text-align: center;
	}
	footer .corp-name {
		font-size: 180%;
	}
		footer .corp-name img {
			width: auto;
			height: 35px;
			margin-right: 10px;
		}
	.contact-txt {
		display: block;
		width: 90%;
		margin: 1em auto 0.5em auto;
		text-align: center;
		color: #a0d850;
		font-weight: 700;
		background-color: #fff;
		border-radius: 10px;
	}
	.contact-tel {
		display: block;
		text-align: center;
		font-size: 150%;
		color: #a32100;
		font-weight: 700;
	}
	#foot-nav {
	list-style: none;
	margin: 1em auto;
	padding: 0.5em 0;
	display: flex;
	flex-wrap: wrap;
	border-top: #fff 1px solid;
	border-bottom: #fff 1px solid;
}
#foot-nav ul {
	margin: 0;
	padding: 0;
}
	#foot-nav li {
		display: inline-block;
		margin-right: 0.5em;
		padding: 0.5em 1em;
		box-sizing: border-box;
	}
	.certification-num {
		width: 100%;
		margin: 1em 0;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 0.8em;
	}
	.certification-num img {
		height: auto;
		margin-right: 1em;
	}
	.certification-num ul {
		list-style: none;
		margin: 0 0 0 0;
		padding: 0;
	}
/*----------------------------------------------------------
  Copyright
----------------------------------------------------------*/
#copyright {
	display: block;
	width: 100%;
	padding: 1em 0;
	box-sizing: border-box;
	text-align: center;
	color: #fff;
}

/*/////////////////////////////////////////////////////////
  Index Contents
/////////////////////////////////////////////////////////*/
.bn-icon-area {
  margin: 1em auto;
  padding: 0;
}
  .bn-icon-area img {
    display: block;
    height: auto;
    margin: 0 auto;
  }
/*---------------------------------------------------
  Category Button Area
---------------------------------------------------*/
.catbtn-area {
	margin: 2em auto;
	text-align: center;
	display: grid;
}
.catbtn-area a img {
	display: block;
	object-fit: cover;
}
/*---------------------------------------------------
  Tab Area
---------------------------------------------------*/
/*タブ切り替え全体のスタイル*/
#tab-area {
	margin: 2em auto;
  background: url(images/back-lighttex.png) #f8f6eb repeat;
}
/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}
.tab_item:hover {
  opacity: 0.75;
}
/*タブのスタイル*/
.tab_item {
  width: calc(100%/3);
  height: 50px;
  background: url(images/back-brighttex.png) #f8f6eb repeat;
  line-height: 50px;
  text-align: center;
  display: block;
  float: left;
  font-weight: bold;
  transition: all 0.2s ease;
}
/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  padding: 1em 0;
  clear: both;
  overflow: hidden;
}
/*選択されているタブのコンテンツのみを表示*/
#recommend:checked ~ #recommend_content,
#buy:checked ~ #buy_content,
#rent:checked ~ #rent_content {
  display: block;
}
/*選択されているタブのスタイルを変える*/
#tab-area input:checked + .tab_item {
  background: url(images/back-lighttex.png) #f8f6eb repeat;
  color: #322f00;
  border-top: #8c6239 3px solid;
  font-weight: 400;
}
.wp-block-button__link {
  display: block;
  width: 100%;
  border-radius: 0;
  background-color: #322f00;
  border: #322f00 1px solid;
  color: #fff;
}
	.wp-block-button__link:hover {
		text-decoration: none;
		background-color: #f8f6eb;
		border: #322f00 1px solid;
		color: #322f00;
	}
	ul.grid-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1em 0.5em;
    list-style: none;
    margin: 0 0 1em 0;
    padding: 0;
  }
	li.box1 {
    display: grid;
    grid-template-columns: 1fr;
  }
	a.bukken-link {
		display: block;
		border-top: #8c6239 5px solid;
		background-color: #f8f6eb;
	}
	li.box1 a {
		grid-column: 1 / 3;
		grid-row: 1 / 2;
  }
	h4.top_title {
		grid-column: 1 / 3;
		grid-row: 2 / 3;
		margin: 0.3em 0;
		padding-bottom: 0.5em;
		color: #221f66;
		border-bottom: #8c6239 1px solid;
	}
	.numbers-line {
		grid-column: 1 / 2;
		grid-row: 3 / 4;
		display: flex;
	}
	.top_madori,
	.top_menseki {
		grid-column: 2 / 3;
		grid-row: 3 / 4;
		align-self: baseline;
		text-align: left;
	}
	.top_price {
		grid-column: 1 / 2;
		grid-row: 3 / 4;
		align-self: baseline;
		padding-right: 0.5em;
		font-size: 135%;
		font-weight: 700;
		text-align: right;
		color: #e6002e;
	}
	.top_shozaichi {
		grid-column: 1 / 3;
		grid-row: 4 / 5;
	}
	.top_kotsu {
		grid-column: 1 / 3;
		grid-row: 5 / 6;
	}
	.top_r_footer {
		grid-column: 1 / 3;
		grid-row: 6 / 7;
		margin-top: auto;
		text-align: right;
		align-self: baseline;
	}
	.top_r_footer::after {
		font: var(--fa-font-solid);
		content: '\f061';
		font-weight: 700;
		padding-right: 1em;
	}
/*---------------------------------------------------
  Owner Button Area
---------------------------------------------------*/
.ownerbtn-area {
	margin: 2em auto;
	text-align: center;
	display: flex;
	gap: 1em;
}
.ownerbtn-area a {
  display: block;
}
/*---------------------------------------------------
  Rinovation Area
---------------------------------------------------*/
.rinova-area {
	width: 100%;
	margin: 2em 0;
}
.rinova-area h3 {
  width: 100%;
  text-align: center;
  margin: 1em auto;
}
.rinov-item a {
	position: relative;
	display: block;
}
.rinov-item {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
}
.rino-img img {
	width: 100%;
	object-fit: cover;
}
.rinov-title {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  color: #fff;
  padding: 0.5em;
  box-sizing: border-box;
  background-color: rgba(50, 47, 0, 0.5) ;
}
  .rinov-title span {
    margin-left: 1em;
  }
/*---------------------------------------------------
  Notice Area
---------------------------------------------------*/
.notice-area {
	margin: 2em auto;
}
  .notice-area h3 {
    width: 100%;
    text-align: center;
    padding: 0.5em 0 1em 0;
    border-top: #8c6239 3px solid;
  }
  .notice-item {
    margin-bottom: 0.5em;
  }

.btn-notice {
  display: block;
  margin: 1em auto;
  text-align: center;
  background-color: #322f00;
  border: #322f00 1px solid;
  color: #fff;
  text-decoration: none;
}
  .btn-notice:hover {
    background-color: #d6d6cc;
    border: #322f00 1px solid;
    color: #322f00;
  }

@media screen and (min-width: 960px) {
	/*---------------------------------------------------
		header
	---------------------------------------------------*/
	header {
		grid-template-columns: 60px 60px 1fr 255px;
		align-items: center;
	}
		.head-menu-area {
			grid-column: 1 / 2;
		}
		.contact-area {
			grid-column: 2 / 3;
			line-height: 60px;
		}
		.corp-name-area {
			grid-column: 3 / 4;
			margin-left: 0.5em;
			line-height: 60px;
			margin-left: 5px;
			margin-top: 5px;
		}
			.corp-name-area img {
				width: auto;
				height: 26px;
				margin-right: 0.5em;
			}
		.phone-area {
			grid-column: 4 / 5;
		}
			.phone-area a {
				display: flex;
				align-items: center;
			}
			.phone-area i {
				margin-right: 0.5em;
			}
	/*----------------------------------------------------------
		To Top
	----------------------------------------------------------*/
	.pagetop {
		right: 30px;
		bottom: 30px;
	}
	/*----------------------------------------------------------
		Footer
	----------------------------------------------------------*/
	.inner-foot {
		width: 800px;
		margin: 0 auto;
		justify-content: space-between;
	}
	#aboutus-area {
		width: 50%;
	}
	.certification-num img {
		width: 80px;
	}
	/*----------------------------------------------------------
		Slide
	----------------------------------------------------------*/
	.layer-text {
		max-width: 360px;
		max-height: 190px;
	}
}

@media screen and (min-width: 640px) and (max-width: 959px) {
	/*---------------------------------------------------
		header
	---------------------------------------------------*/
	header {
		grid-template-columns: 60px 60px 1fr 255px;
		align-items: center;
	}
	.head-menu-area {
		grid-column: 1 / 2;
	}
	.contact-area {
		grid-column: 2 / 3;
		line-height: 60px;
	}
	.corp-name-area {
		grid-column: 3 / 4;
		margin-left: 0.5em;
		margin-left: 5px;
		margin-top: 5px;
	}
		.corp-name-area img {
			display: block;
			width: auto;
			height: 26px;
			margin-right: 0.5em;
		}
	.phone-area {
		grid-column: 4 / 5;
	}
		.phone-area a {
			display: flex;
			align-items: center;
		}
		.phone-area i {
			margin-right: 0.5em;
		}
	/*----------------------------------------------------------
		To Top
	----------------------------------------------------------*/
	.pagetop {
		right: 15px;
		bottom: 10px;
	}
	/*----------------------------------------------------------
		Footer
	----------------------------------------------------------*/
	.inner-foot {
		width: 90%;
		margin: 0 auto;
		justify-content: space-between;
	}
	#aboutus-area {
		width: 45%;
	}
		footer .corp-name img {
			display: block;
		}
		.contact-txt {
			font-size: 80%;
		}
		.add-txt {
			display: block;
		}
	img.s-exterior {
		width: 50%;
		height: auto;
	}
	.certification-num img {
		width: 80px;
	}
	/*----------------------------------------------------------
		Slide
	----------------------------------------------------------*/
	.layer-text {
		max-height: 130px;
	}
}
@media screen and (max-width: 639px) {
	/*---------------------------------------------------
		header
	---------------------------------------------------*/
	header {
		grid-template-columns: repeat(3, 60px) 1fr;
	}
		.head-menu-area {
			grid-column: 1 / 2;
			grid-row: 1 / 2;
			margin: 0;
			padding: 0;
		}
		.contact-area {
			grid-column: 2 / 3;
			grid-row: 1 / 2;
			line-height: 42px;
			padding: 0.5em;
		}
		.corp-name-area {
			grid-column: 4 / 5;
			grid-row: 1 / 2;
			display: flex;
			align-items: center;
		}
		@media screen and (max-width: 639px) and (min-width: 521px) {
			.corp-name-area img {
				display: inline;
				height: 26px;
			}
		}
		@media screen and (max-width: 520px) {
			.corp-name-area img {
				display: block;
				height: 26px;
			}
		}

		.phone-area {
			grid-column: 3 / 4;
			grid-row: 1 / 2;
		}
			.phone-area span {
				display: none;
			}
	/*----------------------------------------------------------
		To Top
	----------------------------------------------------------*/
	.pagetop {
		right: 5px;
		bottom: 5px;
	}
	/*----------------------------------------------------------
		Footer
	----------------------------------------------------------*/
	.inner-foot {
		width: 90%;
		margin: 0 auto;
	}
	#aboutus-area {
		width: 100%;
		margin-bottom: 1em;
	}
		.corp-name img {
			width: auto;
			height: 35px;
			margin-right: 0.5em;
		}
		.biztime {
			text-align: center;
		}
		.certification-num img {
			width: 50px;
		}
		img.s-exterior {
			width: 384px;
			height: auto;
			margin: 0 auto;
		}
		#foot-nav {
			justify-content: center;
		}

	/*----------------------------------------------------------
		Slide
	----------------------------------------------------------*/
	.layer-text {
		max-width: 100%;
		max-height: 90px;
	}
}