@charset "utf-8";

/** drawer **/
.drawer.drawer--right {
	display: none;
}

/* # =================================================================
#### 1200
# ================================================================= */
@media screen and (max-width: 1200px) {

	/* # =================================================================
#### common
# ================================================================= */
	.wrap {
		width: 100%;
		/* padding: 0 15px; */
	}

	/* # =================================================================
#### header
# ================================================================= */

	/*** nav ***/
	header nav {
		width: 100%;
	}

	/* # =================================================================
#### footer
# ================================================================= */
	/*** footer_list ***/
	.footer_list .swiper-container {
		width: 850px;
	}

	.footer_list .swiper-wrapper .swiper-slide a {
		padding: 28px 15px;
		height: 104px;
	}

	.footer_list .swiper-button-prev:after {
		margin-left: 15px;
	}

	.footer_list .swiper-button-next:after {
		margin-right: 15px;
	}

	/*** footer ***/
	.footer .flex .right .box {
		padding: 0 10px;
	}

	.footer .flex .left {
		width: 40%;
	}

	.footer .flex .right {
		width: 60%;
		padding-left: 30px;
	}

	/* # =================================================================
#### tab-area
# ================================================================= */
	.tab-area {
		width: 95%;
	}

	/*** tab-content ***/
	.tab-content {
		width: 100%;
	}




}

/* 1200 */
/* # =================================================================
#### 1024
# ================================================================= */
@media screen and (max-width: 1024px) {

	/* # =================================================================
#### topics
# ================================================================= */
	.topics_wrap {
		width: 100%;
		padding: 0 15px;
	}

	.footer_list ul:before {
		width: 170px;
	}

	.footer_list ul:after {
		width: 170px;
	}

	.footer_list ul li {
		width: 170px;
	}

	/* # =================================================================
#### 詳細
# ================================================================= */
	.blog {
		padding: 50px 15px;
	}

	.blog h2.title {
		width: 100%;
	}

	.blog p.ymd {
		width: 100%;
	}

	.blog .wrap {
		width: 100%;
	}

	/*** ページング ***/
	#pagenavi {
		width: 100%;
	}


}

/* 1024 */


/* # =================================================================
#### 1000 20230729
# ================================================================= */
@media screen and (max-width: 1000px) {

	.temp .catebox span {
		font-size: 11px;
	}
}

/* 1000 */


/* # =================================================================
#### 896
# ================================================================= */
@media screen and (max-width: 896px) {

	/* # =================================================================
#### common
# ================================================================= */
	h2.headline {
		margin-bottom: 16px;
	}

	h2.headline span {
		font-size: 18px;
	}

	/* # =================================================================
#### header
# ================================================================= */
	header:after {
		height: 55.45px;
	}

	header h1 {
		margin-bottom: 0;
	}

	/*** nav ***/
	.menu {
		display: none;
	}

	/** drawer **/
	.drawer.drawer--right {
		display: block;
	}

	/* # =================================================================
#### footer
# ================================================================= */
	/*** footer_list ***/
	.footer_list .swiper-container {
		width: 85%;
	}

	/*** footer_fixed ***/
	.footer_fixed .pc_wrap .top {
		padding: 0 15px 15px;
	}

	.footer_fixed .pc_wrap .flex {
		width: 100%;
	}

	/***  ***/
	.footer .flex .left .bottom p {
		font-size: 12px;
	}

	.footer .flex .right .box ul li a {
		font-size: 12px;
	}

	/* # =================================================================
#### swiper
# ================================================================= */
	.swiper-button-next,
	.swiper-button-prev {
		top: 44%;
	}

	.swiper-button-prev:after,
	.swiper-button-next:after {
		font-size: 20px;
	}

	/* # =================================================================
#### tab-area
# =================================================================
.tab-list-wrap{
	width : 350px;
}
*/
	/* # =================================================================
#### 新着・既存・街 テンプレート
# ================================================================= */
	.temp .swiper-button-next,
	.temp .swiper-button-prev {
		top: 37%;
	}

	.temp.machi .swiper-button-next,
	.temp.machi .swiper-button-prev {
		top: 29%;
	}

	.temp.machi .swiper-button-next {
		right: 10px;
	}

	.temp.machi .swiper-button-prev {
		left: 10px;
	}

	.temp .swiper-button-prev:after,
	.temp .swiper-button-next:after {
		/* font-size: 20px; */
		height: 23px;
		width: 23px;
	}

	/* # =================================================================
#### 一覧
# ================================================================= */
	.page_header .page_nav {
		/* width: 100%; */
		width: calc(100% - 48px);
	}

	.page_header .page_nav ul {
		position: relative;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		/* justify-content: space-around; */
		justify-content: flex-start;
		padding: 0 10px;
	}

	.page_header .page_nav ul li {
		margin: 0 10px 10px 0;
	}

	.page .temp .flex:after {
		content: none;
	}

	.page .temp .flex .temp_box {
		width: 48%;
	}

	/* # =================================================================
#### modal 20230824追加
# ================================================================= */
	.modal-content {
		width: 80% !important;
	}

}

/* 896 */
/* # =================================================================
#### 800
# ================================================================= */
@media screen and (max-width: 800px) {
	.main_slider {
		padding: 0 0 50px;
	}
}

/* # =================================================================
#### 600
# ================================================================= */
@media screen and (max-width: 600px) {

	/* # =================================================================
#### common
# ================================================================= */
	section.contents {
		padding: 0 0 30px;
	}

	/* # =================================================================
#### slider
# ================================================================= */
	.main_slider .swiper-button-next,
	.main_slider .swiper-button-prev {
		display: none;
	}

	.main_slider {
		padding: 0 0 20px;
	}

	/* # =================================================================
#### header
# ================================================================= */
	header:after {
		height: 51.2px;
	}

	header h1 {
		width: 250px;
	}

	/* # =================================================================
#### footer
# ================================================================= */
	/*** page top ***/
	.page_top p a {
		font-size: 14px;
		padding: 15px 0;
	}

	/*** footer_list ***/
	.footer_list ul {
		/* display : block; */
	}

	.footer_list ul li {
		width: 100%;
		height: auto;
	}

	.footer_list ul li:last-child {
		margin-bottom: 0;
	}

	.footer_list ul li a {
		font-size: 16px;
		padding: 15px;
	}

	/*** footer ***/
	.footer {
		padding: 0 0 50px;
	}

	.footer .wrap {
		padding: 0;
	}

	.footer .flex {
		display: block;
	}

	/** left **/
	.footer .flex .left {
		width: 100%;
		margin-bottom: 20px;
	}

	.footer .flex .left .bottom {
		padding: 10px;
	}

	.footer .flex .left .bottom p {
		line-height: 1.8;
	}

	/** right **/
	.footer .flex .right {
		display: block;
		width: 100%;
		padding-left: 0;
	}

	.footer .flex .right .box {
		width: 100%;
		border-left: none;
		border-bottom: 1px solid #A0A0A0;
		padding: 0 30px 20px;
		margin-bottom: 20px;
	}

	.footer .flex .right .box ul li:last-child {
		margin-bottom: 0;
	}

	.footer small {
		font-size: 12px;
		padding: 0 5px;
	}

	/**  **/
	.footer_fixed .inner {
		padding: 0;
	}

	.footer_fixed .pc_wrap {
		display: none;
	}

	.footer_fixed .sp_wrap {
		display: block;
	}

	/* # =================================================================
#### tab-area
# ================================================================= */
	.tab-list-wrap {
		width: 100%;
	}

	.tab-list {
		font-size: 16px;
		padding: 5px 0;
	}

	.tab-content-wrap {
		padding: 20px 10px 10px;
	}

	#tab-btn1:checked~.tab-list-wrap #tab-list1:after,
	#tab-btn2:checked~.tab-list-wrap #tab-list2:after,
	#tab-btn3:checked~.tab-list-wrap #tab-list3:after,
	#tab-btn4:checked~.tab-list-wrap #tab-list4:after {
		bottom: -44px;
	}

	h3.title_link span {
		font-size: 16px;
	}

	h3.title_link a {
		font-size: 13px;
	}

	h3.title_link span {
		padding-right: 10px;
		margin-right: 5px;
	}

	/* # =================================================================
#### main_slider
# ================================================================= */
	.main_slider .swiper-container {
		padding-bottom: 30px;
	}

	.main_slider .swiper-pagination {
		bottom: 5px;
	}

	.main_slider .swiper-pagination-bullet {
		width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 10px));
		height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 10px));
	}

	/* # =================================================================
#### topics
# ================================================================= */
	.topics dl dd p {
		width: 100%;
		padding-right: 0;
	}

	.topics dl dd .thumb {
		display: none;
	}

	.topics dl dt {
		padding-bottom: 5px;
		margin-bottom: 5px;
	}

	.topics dl dd {
		padding-bottom: 5px;
		margin-bottom: 5px;
		line-height: 1.8;
	}

	/* # =================================================================
#### 新着・既存・街 テンプレート
# ================================================================= */
	.page .temp {
		padding: 30px 0;
	}

	.temp {
		margin-bottom: 40px;
	}

	.temp .infobox .name {
		font-size: 16px;
	}

	/** 全ての物件を確認する
.sp_all{
	display : block;
}
 **/
	/* # =================================================================
#### トピックス一覧
# ================================================================= */
	.topics_wrap .text {
		width: 100%;
		padding-right: 0;
	}

	/**  **/
	.tablenav {
		margin: 30px 0 0
	}

	/* # =================================================================
#### 一覧
# ================================================================= */
	.page_header .page_nav {
		margin-bottom: 30px;
	}

	.page_header .page_nav ul li a {
		padding: 5px 15px;
		font-size: 14px;
		font-weight: bold;
		color: #003784;
		border: 2px solid #003784;
	}

	.page .temp .flex {
		display: block;
	}

	.page .temp .flex .temp_box {
		width: 100%;
	}

	.page .temp .flex .temp_box:last-child {
		margin-bottom: 0;
	}

	/* # =================================================================
#### 詳細
# ================================================================= */
	.blog .wrap {
		padding: 15px;
	}










}

/* 600 */
/* # =================================================================
#### 480
# ================================================================= */
@media screen and (max-width: 480px) {

	/* # =================================================================
#### modal 20230824追加
# ================================================================= */
	.modal-content {
		width: 100% !important;
	}

	.modal-content.simulation {
		height: 100%;
		z-index: 10000;
	}

	.simulation h2.simulation-title {
		font-size: 18px;
		padding: 15px 10px;
	}

	.simulation__wrap {
		padding: 15px 15px 150px;
	}

	.close-btn a {
		padding: 25px 10px;
	}

	/***** simulation__input-forms *****/
	.simulation__input-forms li {
		font-size: 14px;
	}

	.simulation__input-forms li label {
		font-size: 14px;
	}

	/***** simulation__output-result- *****/
	.simulation__output-result h2 {
		font-size: 18px;
	}

	.simulation__output-result-wrap span {
		width: 100%;
		margin-bottom: 10px;
	}

	.simulation__output-result-wrap div {
		width: 100%;
	}

	/***** simulation__wrap .simulation__info-result *****/
	.simulation__wrap .simulation__info-result {
		font-size: 14px;
	}


}

/* 480 */
/* # =================================================================
#### 320
# ================================================================= */
@media screen and (max-width: 320px) {
	.drawer-hamburger {
		padding: 0px;
		top: 11px;
		width: 45px;
		height: 25px;
	}

	.drawer--right .drawer-hamburger,
	.drawer--right.drawer-open .drawer-hamburger {
		right: 10px;
	}

	.drawer-hamburger-icon,
	.drawer-hamburger-icon:after,
	.drawer-hamburger-icon:before {
		font-size: 12px;
	}

	/* # =================================================================
#### header
# ================================================================= */
	header h1 {
		width: 225px;
	}

	header .inner {
		padding: 15px 10px;
	}

	header:after {
		height: 49.05px;
	}

	/* # =================================================================
#### footer
# ================================================================= */
	.footer_fixed .sp_wrap .flex {
		width: 300px
	}

	.sp_wrap .bottom .tel_wrap {
		width: 200px;
	}

	.footer_fixed .sp_wrap .flex a img {
		width: 80px;
	}

	/* # =================================================================
#### 一覧
# ================================================================= */
	.page_header .page_nav ul li a {
		padding: 5px 10px;
		font-size: 12px;
	}

	/* # =================================================================
#### 詳細
# ================================================================= */
	#pagenavi li.center a:before {
		content: none;
	}

	/* # =================================================================
#### 20230729
# ================================================================= */
	.temp .catebox span {
		font-size: 11px;
	}







}

/* 320 */