@charset "utf-8";
/* CSS Document */


input,
select {
	-webkit-appearance: none;
	appearance: none;
}

/***********

サイトマップ

******************/


.sitemapPage .box {
	background: #f1f1f1;
}

.sitemapPage .box ul {
	list-style: circle;
	padding: 50px;
}

.sitemapPage .box ul li {}



/***********

プラン・料金表

******************/
sup {
	vertical-align: super;
	font-size: smaller;
}

.u-pc-active {
	display: block;
}

.u-sp-active {
	display: none;
}

.plan tr th {
	width: 25%;
}

.plan table {
	font-size: 2.7vw;
}

.box .PlanBox__flex {
	display: flex;
	margin: 1rem 0;
}

.box .PlanBox {
	width: 33%;
}

.box .PlanBox__border {
	border: 4px solid black;
}

.box .PlanBox__flex> :nth-child(2) {
	margin: 0px 2%;
}

.box .PlanBox__title {
	text-align: center;
	font-size: 30px;
	font-weight: bold;
	margin: 10px 0 0 0;
}

.box .PlanBox__title02 {
	margin: 0px;
	text-align: center;
	font-size: 27px;
	font-weight: bold;
}

.box .PlanBox__container {
	margin: 0 auto;
	width: 140px;
}

.box .PlanBox__content {
	display: inline-block;
	font-size: 38px;
	font-weight: bold;
	line-height: 1;
	margin: 0px;
}

.box .PBC__sup {
	display: inline-block;
	width: 40px;
}

.PBC__sup>p {
	margin: 0px;
	line-height: 1.3;
	font-weight: bold;
}

.box .PBC__sup> :nth-child(1) {
	font-size: 10px;
}

.box .PBC__sup> :nth-child(2) {
	font-size: 20px;
}

.box .PlanBox__title03 {
	text-align: center;
	position: relative;
	margin: 5px 0 0 0;
	font-size: 23px;
	font-weight: bold;
}

.box .PlanBox__title03::before {
	content: '';
	position: absolute;
	left: 4%;
	top: 18px;
	width: 20%;
	height: 1px;
	background-color: black;
}

.box .PlanBox__title03::after {
	content: '';
	position: absolute;
	right: 4%;
	top: 18px;
	width: 20%;
	height: 1px;
	background-color: black;
}

.PBT03__space {
	letter-spacing: 0px;
}

.box .PlanBox__container02 {
	display: flex;
	flex-wrap: wrap;
	margin: 5px 0px 10px 0px;
	justify-content: center;
}

.box .PlanBox__container02>div {
	border: 1px solid #909090;
	border-radius: 20px;
	text-align: center;
	font-size: 12px;
	padding: 5px 10px 5px 10px;
	margin: 10px 2px 0px 2px;
	letter-spacing: -2px;
}

.PlanBox__container02>div:nth-child(5) {
	letter-spacing: 0px;
}

.PlanBox__container02>div:nth-child(6) {
	padding-left: 5px;
	padding-right: 5px;
}

.PBC02__active {
	color: white;
	background-color: black;
}

.box .PBC__TextRight {
	display: flex;
	justify-content: end;
	font-weight: bold;
	font-size: 10px;
	margin-top: 5px;
}

.box .PBC__space {
	letter-spacing: -1px;
}

@media only screen and (max-width:800px) {
	.u-pc-active {
		display: none;
	}

	.u-sp-active {
		display: block;
	}

	.box .PlanBox__flex {
		display: block;
	}

	.box .PlanBox__flex> :nth-child(2) {
		margin: 0px;
	}

	.box .PlanBox {
		width: 100%;
		margin: 20px 0px;
	}

	.box .PlanBox__title03::before {
		width: 23vw;
		left: 5vw;
	}

	.box .PlanBox__title03::after {
		width: 23vw;
		right: 5vw;
	}
}

@media only screen and (max-width:375px) {
	.box .PlanBox__title03::before {
		width: 20vw;
		left: 2vw;
	}

	.box .PlanBox__title03::after {
		width: 20vw;
		right: 2vw;
	}
}




/**************

見学会予約

**********************/


.page.contact.inspection .f-item .flex p {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
}

.page.contact.inspection .f-item .flex p span {
	padding-right: 15px;
}

.page.contact.inspection .f-item .flex p span[data-name="menu-day"],
.page.contact.inspection .f-item .flex p span[data-name="menu-time"] {
	padding-left: 15px;
}

.page.contact .f-item span.hissu {
	background: #d80000;
	display: inline-block;
	color: #fff;
	padding: 0px 3px;
	text-align: center;
	margin-left: 5px;
	font-size: 12px;
}

.page.contact.inspection .f-item .flex p .nichiji {}

@media only screen and (max-width:800px) {

	.page.contact.inspection .f-item .flex p span {
		padding-right: 1vmin;
		padding-bottom: 3vmin;
	}

	.page.contact.inspection .f-item .flex p span[data-name="menu-day"],
	.page.contact.inspection .f-item .flex p span[data-name="menu-time"] {
		padding-left: 0px;
	}

	.page.contact.inspection .f-item .flex p span[data-name="nichiji01"],
	.page.contact.inspection .f-item .flex p span[data-name="nichiji02"],
	.page.contact.inspection .f-item .flex p span[data-name="nichiji03"] {
		display: block;
		width: 100%;
	}

	.page.contact.inspection .f-item .flex p .nichiji {
		width: 200px;
		display: block;
	}


}

/***********

登録～契約までの流れ

******************/
.c_red {
	color: #cc0000;
}

.flowPage {}

.flowPage .leadTxt {}

.flowPage .flowBlock {}

.flowPage .flowBlock::after {}

.flowPage .flowBlock h2.ttl {
	text-align: left;
	/* font-weight: normal; */
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.flowPage .flowBlock h2.ttl .num {
	font-size: 55px;
	width: 5%;
	font-weight: normal;
}

.flowPage .flowBlock h2.ttl .txt {
	border-bottom: 1px solid #937960;
	flex: 1;
	padding-bottom: 10px;
	font-size: 30px;
}

.flowPage .flowBlock .flowBox {
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-ms-flex-pack: justify;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	position: relative;
	margin-bottom: 120px;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.flowPage .flowBlock .flowBox::after {
	content: "";
	position: absolute;
	bottom: -60px;
	left: 0;
	right: 0;
	margin: auto;
	border-left: 100px solid transparent;
	border-right: 100px solid transparent;
	border-top: 40px solid #937960;
	text-align: center;
	display: block;
	width: 0;
	height: 0;
}

.flowPage .flowBlock .flowBox:last-child::after {
	content: none;
}

.flowPage .flowBlock .flowBox:last-child {
	margin-bottom: 12vmin;
}

.flowPage .flowBlock .flowBox .lArea {
	width: 49%;
}

.flowPage .flowBlock .flowBox .rArea {
	width: 49%;
}

.flowPage .flowBlock .flowBox .img {
	text-align: center;
}

.flowPage .flowBlock .flowBox .img img {}

.flowPage .flowBlock .flowBox .ttl {}

.flowPage .flowBlock .flowBox .txt {
	font-weight: bold;
	font-size: 18px;
}

.flowPage .flowBlock .flowBox .s_txt {}

.flowPage .flowBlock .flowBox .caution {
	margin-block: 5px;
	line-height: 1.7;
	font-size: 14px;
	text-indent: -1.2em;
	padding-left: 1.2em;
}




/**SP**/
@media (max-width: 767px) {
	.flowPage {}

	.flowPage .leadTxt {}

	.flowPage .flowBlock {}

	.flowPage .flowBlock h2.ttl {}

	.flowPage .flowBlock h2.ttl .num {
		width: 11%;
		font-size: 10vmin;
	}

	.flowPage .flowBlock h2.ttl .txt {
		font-size: 5.6vmin;
		padding-bottom: 2vmin;
	}

	.flowPage .flowBlock .flowBox {
		display: block;
	}

	.flowPage .flowBlock .flowBox::after {}

	.flowPage .flowBlock .flowBox .lArea {
		width: 100%;
		margin-bottom: 6vmin;
	}

	.flowPage .flowBlock .flowBox .rArea {
		width: 100%;
	}

	.flowPage .flowBlock .flowBox .img {}

	.flowPage .flowBlock .flowBox .img img {}

	.flowPage .flowBlock .flowBox .ttl {}

	.flowPage .flowBlock .flowBox .txt {}

	.flowPage .flowBlock .flowBox .s_txt {}

	.flowPage .flowBlock .flowBox .caution {}
}





.esthetic ul.slider02 {
	list-style: none;
	margin: auto;
	padding-top: 30px;
	padding-bottom: 30px;
	margin-bottom: 80px;
}

.esthetic ul.slider02 li {
	margin-bottom: 0;
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
	text-indent: 0;
	padding-left: 0;
	opacity: 0.1;
}

.esthetic ul.slider02 li.slick-slide {
	margin: 0 30px;
}

.esthetic ul li.slick-active {
	opacity: 1;
}

.esthetic ul.slider02 li::before {
	content: none;
}

.esthetic ul.slider02 li img {
	margin: auto;
	text-align: center;
	display: block;
}

.esthetic .slide-arrow {
	bottom: 0;
	cursor: pointer;
	margin: auto;
	position: absolute;
	top: 0;
	width: 50px;
	z-index: 1;
}

.esthetic .prev-arrow {
	left: 175px;

}

.esthetic .next-arrow {
	right: 175px;
}

.esthetic ul.slick-dots {
	margin-left: 0;
	bottom: -25px;
}

.esthetic ul.slick-dots li {
	margin: 0 5px;
}

.esthetic ul.slider02 li img {
	margin: auto;
	text-align: center;
	display: block;
}

.esthetic ul.slick-dots li button::before {
	font-size: 45px;
}

.esthetic ul.slick-dots li.slick-active button:before {
	color: #937960;
}


@media only screen and (max-width:767px) {

	.esthetic .prev-arrow {
		left: 0px;

	}

	.esthetic .next-arrow {
		right: 0px;
	}

	.esthetic ul.slider02 li.slick-slide {
		margin: 0 10px;
	}

	.esthetic .design_button {
		width: 100%;
	}

}



/***********

フロアマップ

******************/

article.floormap .pc {}

article.floormap .sp {
	display: none;
}

article.floormap h2.ttl {
	text-align: center;
	font-size: 26px;
	margin-bottom: 60px;
}

article.floormap .txt {
	text-align: center;
	font-size: 18px;
	margin-bottom: 60px;
}


article.floormap .tabcontent {
	/*display: none;*/
}

article.floormap .tabs {
	display: flex;
	justify-content: flex-start;
	border-bottom: 3px solid #221714;
	margin: auto;
	margin-bottom: 100px;
	max-width: 610px;
}

article.floormap .tablinks {
	padding: 20px 20px;
	cursor: pointer;
	background-color: #efefef;
	border: none;
	outline: none;
	transition: background-color 0.3s;
	width: 50%;
	font-size: 20px;

}

article.floormap .map {
	position: relative;
}

article.floormap .tablinks:hover {
	background-color: #ddd;
}

article.floormap .tablinks.active {
	background-color: #221714;
	color: #fff;
	font-size: 20px;
	position: relative;
}

article.floormap .tablinks.active::after {
	content: "";
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #221714;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	bottom: -10px;
}

article.floormap .img_area {}

article.floormap .img_area .box {
	margin-bottom: 50px;
}

article.floormap .img_area .box .ttl {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 30px;
	position: relative;
}

article.floormap .img_area .box .ttl::before {
	content: "";
	border-bottom: 1px solid #231815;
	width: 140px;
	position: absolute;
	left: 0;
	bottom: 0px;
}

article.floormap .img_area .box .ttl::after {
	content: "";
	border-bottom: 1px solid #dcdddd;
	width: 790px;
	position: absolute;
	left: 140px;
	bottom: 0px;
}

article.floormap .img_area .box .img {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 2%;
}

article.floormap .map .link,
article.floormap .map .link02 {
	position: relative;
}

article.floormap .map button.link,
article.floormap .map button.link02 {
	color: #000;
	font-size: 14px;
	background: none;
	border: none;
	line-height: 1.2;
	cursor: pointer;
	padding: 0;
	font-weight: bold;
}

article.floormap .map .link::before {
	content: "";
	background: url(../img/map/icon.png) no-repeat;
	width: 18px;
	height: 19px;
	position: absolute;
	left: -25px;
	top: -5px;
}

article.floormap .map .link02::after {
	content: "";
	background: url(../img/map/icon.png) no-repeat;
	width: 18px;
	height: 19px;
	position: absolute;
	right: -25px;
	top: 0px;
}

article.floormap .map .link.link01 {
	position: absolute;
	top: 13px;
	left: 215px;
}

article.floormap .map .link.link002 {
	position: absolute;
	top: 65px;
	left: 175px;
}

article.floormap .map .link.link03 {
	position: absolute;
	top: 115px;
	left: 115px;
}

article.floormap .map .link.link04 {
	position: absolute;
	top: 178px;
	left: 0;
}

article.floormap .map .link02.link05 {
	position: absolute;
	top: 73px;
	left: 365px;
}

article.floormap .map .link02.link06 {
	position: absolute;
	left: 500px;
	top: 180px;
}

article.floormap .map .link02.link07 {
	position: absolute;
	left: 500px;
	top: 300px;
}

article.floormap .map .link02.link08 {
	position: absolute;
	top: 385px;
	left: 550px;
}

article.floormap .map .link.link09 {
	position: absolute;
	top: 190px;
	left: 300px;
}

article.floormap .map .link.link10 {
	position: absolute;
	top: 307px;
	left: 360px;
}

article.floormap .map .link02.link11 {
	position: absolute;
	top: 180px;
	left: 525px;
}

article.floormap .map .link02.link12 {
	position: absolute;
	top: 265px;
	left: 560px;
}

article.floormap .map .link02.link13 {
	position: absolute;
	top: 313px;
	left: 495px;
}

article.floormap .map .link02.link14 {
	position: absolute;
	left: 500px;
	top: 380px;
}

article.floormap .map .link02.link15 {
	position: absolute;
	left: 665px;
	top: 380px;
}

article.floormap .map .link02.link16 {
	position: absolute;
	top: 290px;
	left: 355px;
}

article.floormap .map .link02.link16::after,
article.floormap .map .link02.link17::after,
article.floormap .map .link02.link21::after,
article.floormap .map .link02.link18::after,
article.floormap .map .link02.link19::after {
	content: "";
	width: 18px;
	height: 19px;
	position: absolute;
	margin: auto;
	left: 0;
	right: 0;
	top: -20px !important;
}

article.floormap .map .link02.link17 {
	position: absolute;
	top: 390px;
    left: 335px;
}

article.floormap .map .link02.link21 {
	position: absolute;
	top: 315px;
	left: 209px;
}


article.floormap .map .link02.link18 {
	position: absolute;
	left: 310px;
	top: 250px;
}

article.floormap .map .link02.link19 {
	position: absolute;
	top: 325px;
	left: 200px;
}

article.floormap .map .link02.link20 {
	position: absolute;
	top: 185px;
	left: 225px;
}

article.floormap .img_area button {
	background: none;
	padding: 0;
	margin: 0;
	border: none;
	cursor: pointer;
	transition: 0.3s;
}

article.floormap .img_area button:hover {
	opacity: 0.7;
}

article.floormap .img_area p.open-popup {
	width: 49%;
	cursor: pointer;
	transition: 0.3s;
}

article.floormap .img_area p.open-popup:hover {
	opacity: 0.7;
}


@media only screen and (max-width:767px) {

	article.floormap .pc {
		display: none;
	}

	article.floormap .sp {
		display: inherit;
	}

	article.floormap .img_area .box .ttl::before {
		width: 30%;
	}

	article.floormap .img_area .box .ttl::after {
		width: 100%;
		left: 0;
	}

	article.floormap .img_area p.open-popup {
		width: 47.333333%;
		cursor: pointer;
		transition: 0.3s;
	}

	article.floormap .img_area .box {
		margin-bottom: 0;
	}

}



/* ポップアップのスタイル */
.popup-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 1000;

	/* 追加 */
	overflow-y: auto;
	/* はみ出したらオーバーレイ自体をスクロール */
	padding: 20px 10px;
	/* 上下に余白を確保（お好みで） */
	box-sizing: border-box;
}

.popup-content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: #fff;
	padding: 20px;
	border-radius: 8px;
	width: 80%;
	max-width: 700px;
	/* 追加 */
	max-height: calc(100vh - 40px);
	/* 画面の高さから余白を引いた最大値 */
	overflow-y: auto;
	/* 内容が長いときはここでスクロール */
	box-sizing: border-box;
	text-align: center;
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}

/* スマホ・タブレットでも安心して収まるように */
@media (max-width: 768px) {
	.popup-content {
		width: 100%;
		padding: 16px;
		border-radius: 0;
		/* スマホでは全画面風にしたい場合 */
	}
}

/* 画像を縮小してはみ出しにくくする */
.popup-overlay .img img {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
}


.close-popup {
	position: absolute;
	top: 10px;
	right: 15px;
	font-size: 24px;
	cursor: pointer;
}

.popup-overlay h2 {
	margin: 0;
	margin-bottom: 30px;
	text-align: left;
	position: relative;
}

.popup-overlay h2::before {
	content: "";
	position: absolute;
	left: 0;
	bottom: -10px;
	border-bottom: 1px solid #aaa;
	width: 30%;
}

.popup-overlay h2::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: -10px;
	border-bottom: 1px solid #937960;
	width: 70%;
}

.popup-overlay .img {
	margin-top: 20px;
	margin-bottom: 20px;
}

.popup-overlay p {
	text-align: left;
	line-height: 2;
}


/* PC表示（変更なし） */
.campaign_bnr {
	position: fixed;
	bottom: 0;
	width: 350px;
	height: 350px;
	z-index: 9999;
	/* ▼▼▼ ここから追加・変更 ▼▼▼ */
	opacity: 0;
	/* 最初は透明にする */
	visibility: hidden;
	/* 最初はクリック判定も消す */
	transform: translateY(20px);
	/* 少し下に隠しておく（動きをつけるため） */
	transition: all 0.3s ease;
	/* ふわっと変化させる */
	/* ▲▲▲ ここまで追加・変更 ▲▲▲ */
	/* PCでは最初から表示させておく場合、ここはこのままでOK */
}

/* ▼▼▼ スクロール時にJSで付与するクラス ▼▼▼ */
.campaign_bnr.is-active {
	opacity: 1;
	/* 不透明にする（見えるように） */
	visibility: visible;
	/* クリックできるようにする */
	transform: translateY(0);
	/* 元の位置に戻す */
}

/* ▼▼▼ 追加箇所：閉じるボタンのスタイル ▼▼▼ */
.campaign_close {
	position: absolute;
	top: -15px;
	/* 画像の少し上に配置 */
	right: -10px;
	/* 画像の少し右にはみ出させる */
	width: 30px;
	/* ボタンの幅 */
	height: 30px;
	/* ボタンの高さ */
	background: #333;
	/* 背景色（黒っぽいグレー） */
	color: #fff;
	/* 文字色（白） */
	border-radius: 50%;
	/* まんまるにする */
	text-align: center;
	line-height: 28px;
	/* 文字の上下位置調整 */
	font-size: 18px;
	/* ×のサイズ */
	font-weight: bold;
	cursor: pointer;
	z-index: 10000;
	/* 画像より手前に表示 */
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
	/* 影をつけて浮き出させる */
}

.campaign_bnr img {
	max-width: 100%;
}

/* スマホ・タブレット表示（768px以下） */
@media (max-width: 768px) {
	.campaign_bnr {
		width: 180px;
		bottom: 5rem;
	}


}

.home .icon-menu {
	display: none;
}

/* スマホ表示の微調整 */
@media (max-width: 768px) {

	#header_slider_wrap figure {
		height: auto;
		position: absolute;
		bottom: -3px;
		width: calc(100% + 32px);
		left: -16px;
	}

	/* メニュー全体の枠 */
	.home .icon-menu {
		display: block;
		width: 100%;
		background: #fff;
		border-bottom: 1px solid #eee;
		margin: 5rem 0 0px;
		padding-bottom: 3rem;
	}

	/* 横並びの設定 */
	.home .icon-menu ul {
		display: flex;
		justify-content: space-around;
		/* 均等に配置 */
		list-style: none;
		padding: 0;
		margin: 0 auto;
		max-width: 600px;
		/* PCで広がりすぎないように制限 */
	}

	.home .icon-menu li {
		width: 25%;
		/* 4つなので25%ずつ */
		text-align: center;
	}

	.home .icon-menu a {
		display: block;
		text-decoration: none;
		color: #333;
		/* 文字色：黒/濃いグレー */
		transition: opacity 0.3s;
	}

	.home .icon-menu a:hover {
		opacity: 0.7;
		/* ホバー時に少し薄く */
	}

	/* アイコン画像のサイズ */
	.home .icon-box img {
		width: 40px;
		/* アイコンの幅（Fumottoっぽく少し小さめに） */
		height: 40px;
		/* 高さ */
		object-fit: contain;
		margin-bottom: 8px;
		/* 文字との隙間 */
	}

	/* テキストの設定 */
	.home .icon-menu span {
		display: block;
		font-size: 12px;
		/* スマホで見やすいサイズ */
		font-weight: 500;
		line-height: 1.2;
	}

	.home .icon-menu ul {
		width: 100%;
	}

	.home .icon-box img {
		width: 35px;
		/* スマホでは少し小さく */
		height: 35px;
	}

	.home .icon-menu span {
		font-size: 11px;
		/* 文字も少し小さく */
	}
}



/* 初期状態：Slick初期化前はコンテナごと非表示にしてFOUCを防ぐ */
.home .center-container {
	width: 95%;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.6s ease, visibility 0.6s ease;
	min-height: 300px;
}

/* Slick初期化前のスライドが縦積みになるのを防ぐ */
.home .center-slider {
	display: block !important;
	overflow: hidden;
	white-space: nowrap;
	max-height: 600px;
}

.home .center-slider .slider-item {
	display: inline-block;
	vertical-align: top;
}

/* Slick初期化後：コンテナを表示し、初期化前の制御をリセット */
.home .center-slider.slick-initialized {
	overflow: visible;
	white-space: normal;
	max-height: none;
}

.home .center-slider.slick-initialized .slider-item {
	display: block;
}

.home .center-container:has(.slick-initialized),
.home .center-container.is-slider-ready {
	opacity: 1 !important;
	visibility: visible !important;
}


/* -------------------------------------------
     スライダーのカスタマイズCSS
  ------------------------------------------- */

/* 画像そのもののスタイル */
.home .center-container .slider-item img {
	/* 幅は指定しない（なりゆき） */
	width: auto;
	/* 高さを600pxに固定 */
	height: 600px;
	/* 画面幅より大きくならないように制限（念の為） */
	max-width: 80vw;
	display: block;
	border-radius: 4px;
	-webkit-backface-visibility: hidden;
	/* Safariのチラつき防止 */
	will-change: opacity;
}

.home .center-container .slider-item {
	height: 600px;
	/* スライドの幅も中身（画像）に合わせる */
	width: auto;
	/* 左右の隙間調整 */
	margin: 0 20px;
}

/* スライド間の隙間を作る */
.home .center-container .slick-slide {
	margin: 0 15px;
	/* PCでの画像の横の隙間 */
}

/* 【重要】PC表示時の「センター以外を薄くする」設定 */
.home .center-container .slick-slide {
	opacity: 0.4;
	/* 通常（両端）は40%の濃さ */
	transition: opacity 0.3s ease, transform 0.3s ease;
	/* ふわっと変化させる */
	transform: scale(0.9);
	/* オプション：両端を少し小さくすると奥行きが出ます（不要なら削除可） */
}

/* 【重要】センターに来たスライドの設定 */
.home .center-container .slick-center {
	opacity: 1;
	/* センターは100%の濃さ */
	transform: scale(1);
	/* サイズを元に戻す */
	position: relative;
	z-index: 10;
}

/* -------------------------------------------
     【変更点2】左右の矢印（ナビゲーション）の調整
  ------------------------------------------- */
.home .center-container .slick-prev,
.home .center-container .slick-next {
	width: 50px;
	/* クリック範囲を広げる */
	height: 50px;
	z-index: 100;
	/* 画像より手前に表示 */
	border-radius: 5px;
}

/* 矢印のデザイン変更 */
.home .center-container .slick-prev:before,
.home .center-container .slick-next:before {
	content: "";
	font-size: 50px;
	/* 矢印のアイコンサイズを大きく */
	color: #333;
	/* 色を黒っぽくして見やすく（背景に合わせて変更可） */
	opacity: 0.8;
}

/* 矢印の位置調整 */
.home .center-container .slick-prev {
	left: -40px;
	/* 左側の外へ */
	width: 30px;
	height: 30px;
	border: 5px solid;
	border-color: transparent transparent #565656 #565656;
	transform: rotate(45deg);
}

.home .center-container .slick-next {
	right: -40px;
	width: 30px;
	height: 30px;
	border: 5px solid;
	border-color: #565656 #565656 transparent transparent;
	transform: rotate(45deg);
}

/* -------------------------------------------
     【変更点3】下のページ送り（ドット）の調整
  ------------------------------------------- */
.home .center-container .slick-dots {
	bottom: -50px;
	/* 画像との距離 */
}

.home .center-container .slick-dots li {
	margin: 0 10px;
	/* ドット同士の間隔を広げる */
}

.home .center-container .slick-dots li button {
	width: 12px;
	height: 12px;
}

.home .center-container .slick-dots li button:before {
	content: '';
	display: block;
	width: 12px;
	height: 12px;
	line-height: 12px;
	background: transparent;
	border: 1px solid #937960;
	border-radius: 100%;
	position: absolute;
	/* top: 0; */
	left: 0;
}

.home .center-container .slick-dots li.slick-active button:before {
	background: #937960;
}




/* -------------------------------------------
     SP（スマホ）表示時の調整
  ------------------------------------------- */
@media screen and (max-width: 767px) {
	.home .center-container .slick-slide {
		margin: 0;
		/* スマホは隙間なし、または少なめに */
		opacity: 1;
		/* スマホは1枚表示なので、常にハッキリ表示させる */
		transform: scale(1);
		height: auto;
	}

	.home .center-container .container {
		padding: 0;
		/* スマホは画面いっぱいにする場合 */
	}

	/* スマホで矢印が邪魔な場合は消す、必要なら display: block に */
	.home .center-container .slick-prev,
	.home .center-container .slick-next {
		display: none !important;
	}

	.home .center-container .slider-item img {
		height: auto;
		/* または height: 300px; など */
		object-fit: contain;
		/* もし固定値にするなら cover */
		max-width: 100%;
	}
}


.home #mainVisual {
	position: relative;
	z-index: auto;
	display: none;
}


#mainVisual figure {
	width: calc(100% + 20px);
	height: auto;
	position: absolute;
	left: -10px;
	bottom: 26px;
}

@media screen and (max-width: 1280px) {

	.home #mainVisual {
		display: block;
	}

	#mainVisual figure {
		bottom: 1.5rem;
		width: 100%;
	}
}

@media screen and (max-width: 1280px) {
	#mainVisual .figure {
		width: calc(100% + 32px);
		left: -16px
	}
}


/* 横スクロールを有効にするための設定 */
.price .table-container {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	/* スマホで滑らかにスクロール */
	margin-bottom: 10px;
}

.price .price-table .catch {
	font-size: 14px;
	font-weight: 700;
	color: #d80000;
}

/* 768px以下でテーブルの横幅を確保する */
@media screen and (max-width: 768px) {
	.price .price-table {
		min-width: 600px;
		/* スクロールさせるために最小幅を指定 */
		width: 100%;
		border-collapse: collapse;
	}

	/* スクロールを促すヒントを出す場合（任意） */
	.price .table-container::before {
		content: "← 横にスクロールできます →";
		display: block;
		font-size: 10px;
		color: #888;
		text-align: right;
		margin-bottom: 5px;
	}

	.price .price-table .catch {
		font-size: 60%;
		font-weight: 700;
	}
}

/* テーブルの見た目調整（必要に応じて） */
.price .price-table th,
.price .price-table td {}

.price .price-table th {
	font-weight: 700;
}

.price .bnr {
	text-align: center;
	margin-bottom: 20px;
}

.price .note {
	font-size: 20px;
	text-align: center;
	margin-top: 50px;
}

@media screen and (max-width: 768px) {

	.price .box {
		margin-bottom: 3rem;
	}

	.price .bnr {
		margin-bottom: 10px;
	}

	.price .note {
		font-size: 12px;
		text-align: center;
		margin-top: 15px;
	}

	.price .price-table th {
		width: 35%;
		font-size: 12px;
	}


}


/***********

TOP 新着情報エリア

******************/
.front_news {
	padding: 90px 20px 100px;
	background: #f4f1ef;
}

.front_news_inner {
	width: 930px;
	max-width: 100%;
	margin: 0 auto;
}

.front_news_heading {
	text-align: center;
	margin: 0 0 50px;
	color: #937960;
	line-height: 1.4;
}

.front_news_heading span {
	display: block;
	margin-top: 8px;
	font-size: 13px;
	letter-spacing: 0.15em;
	color: #b3a394;
}

.front_news_list {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid #ddd;
}

.front_news_item {
	border-bottom: 1px solid #ddd;
}

.front_news_link {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	padding: 22px 10px;
	text-decoration: none;
	color: #333;
	transition: color 0.3s ease;
}

.front_news_link:hover {
	color: #937960;
}

.front_news_date {
	flex: 0 0 auto;
	width: 110px;
	font-size: 14px;
	color: #937960;
	letter-spacing: 0.05em;
}

.front_news_category {
	flex: 0 0 auto;
	margin-right: 24px;
	padding: 3px 14px;
	font-size: 12px;
	line-height: 1.6;
	color: #fff;
	background: #937960;
	border-radius: 2px;
}

.front_news_text {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 15px;
	line-height: 1.7;
}

.front_news_more {
	text-align: center;
	margin-top: 50px;
}

.front_news_more_link {
	display: inline-block;
	min-width: 240px;
	padding: 16px 40px;
	font-size: 14px;
	letter-spacing: 0.1em;
	text-decoration: none;
	color: #937960;
	border: 1px solid #937960;
	transition: color 0.3s ease, background 0.3s ease;
}

.front_news_more_link:hover {
	color: #fff;
	background: #937960;
}

@media screen and (max-width: 800px) {

	.front_news {
		padding: 55px 20px 60px;
	}

	.front_news_heading {
		margin-bottom: 30px;
	}

	.front_news_link {
		padding: 16px 5px;
	}

	.front_news_date {
		width: auto;
		margin-right: 16px;
		font-size: 13px;
	}

	.front_news_category {
		margin-right: 0;
		font-size: 11px;
	}

	.front_news_text {
		flex: 1 1 100%;
		margin-top: 8px;
		font-size: 14px;
	}

	.front_news_more {
		margin-top: 35px;
	}

	.front_news_more_link {
		min-width: 200px;
		width: 100%;
		max-width: 320px;
	}

}