@charset "utf-8";

/* =======================================================================================
	TEMPLATE
======================================================================================= */



/* =======================================================================================
	COMMON
======================================================================================= */

/* swiper
------------------------------------------------------------------------ */
	.locSwiper.swiperOuter-btnOverflow.is-swiperOn .swiper-button-next,
	.locSwiper.swiperOuter-btnOverflow.is-swiperOn .swiper-button-prev {
		top: calc(50% - 1.85em);
	}



/* =======================================================================================
	PAGE
======================================================================================= */

/* areamapContainer
------------------------------------------------------------------------ */
	.areamapContainer {}

/* areamapBox
---------------------------------------------------- */
	.areamapBox {}
@media screen and (max-width: 736px) {
	.areamapBox small.bltr {
		padding-left: .5em;
		padding-right: .5em;
	}
	
	/* ===== jsSwipeIt ===== */
	.areamapBox .jsSwipeIt .pic {
		padding: 0 1em;
	}
}



/* regionContainer
------------------------------------------------------------------------ */
	.regionContainer {
	}
	.regionBox {
		padding: clamp(90px, (150 / 1400 * 100vw), 150px) clamp(40px, (80 / 1400 * 100vw), 80px);
	}
	.regionBox[data-bgcap-parent] {
		background: #f7f7f8 url("../images/location/region_bg_01.jpg") center bottom no-repeat;
	}
	.regionBox[data-bgcap-parent]::after {
		color: #fff;
		text-shadow: 0 0 0px #343d39, 0 0 0px #343d39, 0 0 0px #343d39, 0 0 1px #343d39, 0 0 2px #343d39, 0 0 5px #343d39, 0 1px 3px #343d39;
	}
	.regionBox :is(.heading, .txt) {
		max-width: 700px;
	}
	.regionBox .heading {
		text-align: left;
	}
	.regionBox .txt {
		background: rgba(255, 255, 255, .28);
		box-shadow: 0 0 4em rgba(255, 255, 255, .65);
		border-radius: 3em;
	}
@media screen and (max-width: 736px) {
	.regionBox {
		padding: clamp(55px, (55 / 375 * 100vw), 70px) clamp(25px, (25 / 375 * 100vw), 40px) 120px;
	}
	.regionBox[data-bgcap-parent] {
		background-position: calc(100% - (220 / 736 * 100%)) 78%;
	}
	.regionBox[data-bgcap-parent]::after {
		color: #222;
		text-shadow: 0 0 0px #f3f4f4, 0 0 0px #f3f4f4, 0 0 2px #f3f4f4, 0 0 5px #f3f4f4;
	}
	.regionBox .heading {
		text-align: center;
	}
	.regionBox .txt {
		letter-spacing: .12em;
	}
}
@media screen and (max-width: 359px) {
	.regionBox .heading {
		text-align: left;
	}
	.regionBox .heading br {
		display: none;
	}
}



/* areaInfoContainer | エリアインフォの共通設定（'個別設定'は後述）
------------------------------------------------------------------------ */
	.areaInfoContainer {}
	.areaInfoHeader {
		position: relative;
		z-index: 0;
	}
	.areaInfoHeader .headingBox .heading {
		--areaInfoHeader-heading-inlinePosition: calc(160 / 1920 * 100%);
		display: grid;
		grid-template-rows: 1fr;
		gap: .15em 0;
		position: absolute;
		top: 0;
		/* left か right に var(--areaInfoHeader-heading-inlinePosition) を'個別設定'する（後述） */
		z-index: 1;
		line-height: 1.1;
		font-size: clamp(2.8rem, (38 / 1600 * 100vw), 3.8rem);
		writing-mode: vertical-rl;
		background: #fff;
		padding: 1.4em .64em 1.11em;
	}
	.areaInfoHeader .headingBox .heading .ja {
		color: #333;
		letter-spacing: .27em;
	}
	.areaInfoHeader .headingBox .heading .en {
		color: rgba(var(--site-themeColor-accent_2), 1);
		font-family: var(--site-font_family-en_1);
		letter-spacing: .15em;
		font-size: max(.85rem, .473684em);
		text-align: center;
	}
	.areaInfoHeader .picBox {
		overflow: hidden;
	}
	.areaInfoHeader .picBox img {
		width: 100%;
		max-width: none;
		height: 100%;
		min-height: 400px;
		object-fit: cover;
		object-position: 50% 50%;
	}
	.areaInfoHeader .picBox .imgcapkeep {
		text-align: right;
		letter-spacing: normal;
	}
@media screen and (max-width: 736px) {
	.areaInfoHeader .headingBox .heading {
		--areaInfoHeader-heading-inlinePosition: calc(35 / 375 * 100%);
		font-size: max(1.9rem, (19 / 375 * 100vw));
	}
	.areaInfoHeader .picBox img {
		min-height: 300px;
	}
	.areaInfoHeader .picBox .imgcapkeep {
		text-align: right;
		letter-spacing: normal;
	}
}
/* areaInfoBody
---------------------------------------------------- */
	.areaInfoBody {
	}



/* ------------------------------------------------------------------------
	areaInfo-jiyugaoka | areaInfoContainerの'個別設定'
------------------------------------------------------------------------ */
	:where(.areaInfo-jiyugaoka) .areaInfoHeader .headingBox .heading {
		right: var(--areaInfoHeader-heading-inlinePosition);
	}
	.areaInfo-jiyugaoka .areaInfoBody {}


/* jiyugaokaSection01
---------------------------------------------------- */
	.jiyugaokaSection01 {}

	.jiyugaokaDescriptionTxtBox {
		width: var(--site-sizeContentWide-M);
		max-width: var(--site-sizeMaxWidth-M);
	}
	.jiyugaokaDescriptionTxtBox .ptTextbox {
		margin-left: 0;
	}

	.jiyugaokaDescriptionSlideWrap {
		width: calc( min(var(--site-sizeContentWide-M), var(--site-sizeMaxWidth-M)) + (100vw - min(var(--site-sizeContentWide-M), var(--site-sizeMaxWidth-M)) ) / 2 );
		max-width: none;
		margin-left: auto;
		margin-right: 0;
		padding-left: min((70 / 1200 * 100vw), 70px);
		padding-right: min((60 / 1200 * 100vw), 60px);
	}
	.jiyugaokaDescriptionSlideWrap .imgcapkeep {
		text-align: right;
	}
	.jiyugaokaDescriptionSlideWrap .swiperOuter:not(.is-swiperOn) .swiper-wrapper { /* PCTB時は通常レイアウト */
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 0 min((30 / 1200 * 100vw), 30px);
	}
@media screen and (max-width: 1200px) {
	.jiyugaokaDescriptionSlideWrap {
		padding-left: 0;
		padding-right: 0;
	}
}
@media screen and (max-width: 736px) {
	.jiyugaokaDescriptionSlideWrap {
		width: var(--site-sizeContentWide-S);
		margin-left: auto;
		margin-right: auto;
	}
}

/* jiyugaokaSection02
---------------------------------------------------- */
	.jiyugaokaSection02 {
	}

	.jiyugaokaRedevelopmentBox {
		display: grid;
		grid-template-columns: calc(500 / 1080 * 100%) calc(500 / 1080 * 100%);
		justify-content: space-between;
		align-items: center;
		padding: clamp(60px, (100 / 1400 * 100vw), 100px) clamp(50px, (80 / 1400 * 100vw), 80px);
	}

	.jiyugaokaRedevelopmentTxtBox .heading {
		text-align: left;
	}
	.jiyugaokaRedevelopmentTxtBox .heading .en {
		display: block;
		color: rgba(var(--site-themeColor-accent_2), 1);
		font-family: var(--site-font_family-en_1);
		font-size: max(1.1rem, .6em);
		margin-top: .65em;
	}
	.jiyugaokaRedevelopmentTxtBox .txt {
		text-align: justify;
	}
	.jiyugaokaRedevelopmentTxtBox .txt small.bl {
		font-family: inherit;
		font-size: 1.2rem;
		letter-spacing: .15em;
		margin-top: .4em;
	}
	.jiyugaokaRedevelopmentPicBox .redeveMap {
	}
@media screen and (max-width: 900px) {
	.jiyugaokaRedevelopmentBox {
		grid-template-columns: 1fr;
		padding: clamp(40px, (40 / 375 * 100vw), 60px) clamp(25px, (25 / 375 * 100vw), 50px);
	}
	.jiyugaokaRedevelopmentPicBox .redeveMap {
		max-width: 600px;	
		margin-top: clamp(30px, (30 / 375 * 100vw), 40px);
		margin-left: auto;
		margin-right: auto;
	}
}
@media screen and (max-width: 736px) {
	.jiyugaokaRedevelopmentTxtBox .txt small.bl {
		font-size: 1.1rem;
		letter-spacing: .11em;
	}
}



/* ------------------------------------------------------------------------
	areaInfo-futako | areaInfoContainerの'個別設定'
------------------------------------------------------------------------ */
	:where(.areaInfo-futako) .areaInfoHeader .headingBox .heading {
		left: var(--areaInfoHeader-heading-inlinePosition);
	}
	.areaInfo-futako .areaInfoBody {}


/* futakoSection01
---------------------------------------------------- */
	.futakoSection01 {}
	
	.futakoDescriptionWrap {
		display: grid;
		grid-template-columns: calc(674 / 1260 * 100%) 1fr;
		align-items: center;
		gap: 0 calc(50 / 1400 * 100%);
	}
	.futakoDescriptionTxtBox .heading {
		text-align: left;
	}
	.futakoDescriptionPicBox {
		order: -1;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 0 calc(33 / 674 * 100%);
	}
	.futakoDescriptionPicBox small.bl {
		line-height: 1.6;
		margin-top: .5em;
	}
	/* -- Individual -- */
	.futakoDescriptionPicBox .picBox02 {
		margin-top: min((74 / 1400 * 100vw), 74px);
	}
@media screen and (max-width: 900px) {
	.futakoDescriptionWrap {
		grid-template-columns: 1fr;
	}
	.futakoDescriptionPicBox {
		order: 0;
		margin-top:var(--site-marpad-XL);
	}
}
@media screen and (max-width: 736px) {
	.futakoDescriptionPicBox {
		grid-template-columns: 1fr;
		gap: 30px 0;
	}
	.futakoDescriptionPicBox > [class*="picBox"] {
		position: relative;
		z-index: 0;
		padding-top: min((30 / 375 * 100vw), 50px);
		max-width: 550px;
	}
	.futakoDescriptionPicBox > [class*="picBox"]::before {
		content: "";
		position: absolute;
		inset: 0 0 0 auto;
		z-index: -1;
		width: 94%;
		aspect-ratio: 1 / .86;
		background: rgba(var(--site-themeColor-main), 1) var(--site-variationColor-pattern_gray);
	}
	.futakoDescriptionPicBox > [class*="picBox"] .pic {
		display: block;
		width: 72%;
		aspect-ratio: 235 / 250;
	}
	.futakoDescriptionPicBox > [class*="picBox"] img {
		width: 100%;
		max-width: none;
		height: 100%;
		object-fit: cover;
	}
	/* -- Individual -- */
	.futakoDescriptionPicBox > [class*="picBox"]:nth-of-type(even) {
		margin-left: auto;
	}
	.futakoDescriptionPicBox > [class*="picBox"]:nth-of-type(even)::before {
		inset: 0 auto 0 0;
	}
	.futakoDescriptionPicBox > [class*="picBox"]:nth-of-type(even) .pic {
		margin-left: auto;
	}
	.futakoDescriptionPicBox > [class*="picBox"]:nth-of-type(even) small.bl {
		width: 72%;
		margin-left: auto;
	}
	.futakoDescriptionPicBox .picBox01 img {
		object-position: 50% 3%;
	}
	.futakoDescriptionPicBox .picBox02 img {
		object-position: 50% 96%;
	}
	.futakoDescriptionPicBox .picBox02 {
		margin-top: 0;
	}
}



/* lifestyleSceneWrap | 共通スタイル（Shopping、Parenting、Nature の個別設定は後述(.lifestyleSceneSection00)）
------------------------------------------------------------------------ */
	.lifestyleSceneWrap {}
	.lifestyleSceneSection {}

	.lifestyleScene {
		--lifestyleScene-maxW_val: 1920;
		--lifestyleSceneHeaderMainPic-aspect_w: 1260;
		--lifestyleSceneHeaderMainPic-aspect_h: 600;
		--lifestyleSceneHeaderMainPic-h: calc(var(--lifestyleSceneHeaderMainPic-aspect_h) / var(--lifestyleScene-maxW_val) * 100vw);

		max-width: calc(var(--lifestyleScene-maxW_val) * 1px);
		margin-left: auto;
		margin-right: auto;
	}
	.lifestyleScene__innerWidthSmall {
		width: var(--site-sizeContentWide-M);
		max-width: var(--site-sizeMaxWidth-M);
		margin-left: auto;
		margin-right: auto;
	}

	.lifestyleScene__header {
		display: grid;
		grid-template-columns: auto auto;
		justify-content: space-between;
		align-items: center;
		position: relative;
		z-index: 1; /* __body（はみ出し背景画像）より上にするため必須 */
	}
	.lifestyleScene__header .heading {
		position: relative;
		z-index: 1; /* 画像の上に文字を被せるため必須 */
		line-height: 1.35;
		color: #dad3ca;
		font-family: var(--site-font_family-en_2);
		font-size: min((150 / var(--lifestyleScene-maxW_val) * 100vw), 15rem);
		font-style: italic;
		letter-spacing: -.03em;
		margin-bottom: .3em;
	}
	.lifestyleScene__header .mainPic {
		position: relative;
		width: min((var(--lifestyleSceneHeaderMainPic-aspect_w) / var(--lifestyleScene-maxW_val) * 100vw), (var(--lifestyleSceneHeaderMainPic-aspect_w) * 1px));
		aspect-ratio: var(--lifestyleSceneHeaderMainPic-aspect_w) / var(--lifestyleSceneHeaderMainPic-aspect_h);
	}
	.lifestyleScene__header .mainPic img {
		width: 100%;
		max-width: none;
		height: 100%;
		object-fit: cover;
		object-position: 50% 50%;
	}

	.lifestyleScene__body {
		position: relative;
		z-index: 0;
		padding-top: clamp(60px, (90 / 1600 * 100vw), 90px);
		padding-bottom: clamp(130px, (160 / 1200 * 100vw), 160px);
	}
	.lifestyleScene__body::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		width: min((1760 / var(--lifestyleScene-maxW_val) * 100vw), 1760px);
		background: rgba(var(--site-themeColor-main), 1) var(--site-variationColor-pattern_gray);
		margin-top: calc(var(--lifestyleSceneHeaderMainPic-h) / -2); /* はみ出し背景画像 */
	}
	.lifestyleScene__body .lifestyleSceneIntroBox {
		width: 85%; /* 調整 */
		margin-left: auto;
		margin-right: auto;
	}
	.lifestyleScene__body .lifestyleSceneIntroBox .ptTextbox {
		text-align: center;
	}
	.lifestyleScene__body .lifestyleSceneIntroBox .ptTextbox br.SP {
		display: none;
	}

	/* -- Individual -- */
	:where(.lifestyleSceneSection:nth-of-type(odd)) .lifestyleScene__header .mainPic {
		order: -1;
	}
	:where(.lifestyleSceneSection:nth-of-type(odd)) .lifestyleScene__header .heading {
		padding-left: .166667em;
		padding-right: .566667em;
	}
	:where(.lifestyleSceneSection:nth-of-type(even)) .lifestyleScene__header .heading {
		padding-left: .566667em;
		padding-right: .166667em;
	}
	:where(.lifestyleSceneSection:nth-of-type(odd)) .lifestyleScene__body::before {
		right: auto;
	}
	:where(.lifestyleSceneSection:nth-of-type(even)) .lifestyleScene__body::before {
		left: auto;
	}

	.lifestyleSceneShopping .lifestyleScene__header .mainPic img {
		object-position: 50% 100%;
	}
	.lifestyleSceneParenting .lifestyleScene__header .mainPic img {
		object-position: 50% 50%;
	}
	.lifestyleSceneNature .lifestyleScene__header .mainPic img {
		object-position: 50% 100%;
	}

@media screen and (max-width:1200px) {
	.lifestyleScene__innerWidthSmall {
		width: 78%; /* 普通の幅より小さめに設定 */
	}
	.lifestyleScene__body .lifestyleSceneIntroBox {
		width: 95%;
	}
}
@media screen and (max-width: 900px) {
	.lifestyleScene {
		--lifestyleScene-maxW_val: 375;
		--lifestyleSceneHeaderMainPic-aspect_w: 314;
		--lifestyleSceneHeaderMainPic-aspect_h: 176;
		max-width: none;
	}
	.lifestyleScene__innerWidthSmall {
		width: 82%; /* 普通の幅より小さめに設定 */
	}

	.lifestyleScene__header {
		display: grid;
		grid-template-columns: 1fr;
	}
	.lifestyleScene__header .heading {
		font-size: max(5.4rem, (54 / var(--lifestyleScene-maxW_val) * 100vw));
		margin-bottom: -.15em;
	}
	.lifestyleScene__header .mainPic {
		width: calc(var(--lifestyleSceneHeaderMainPic-aspect_w) / var(--lifestyleScene-maxW_val) * 100vw);
	}

	.lifestyleScene__body::before {
		width: 94%;
	}

	/* -- Individual -- */
	:where(.lifestyleSceneSection:nth-of-type(odd)) .lifestyleScene__header .mainPic {
		order: 0;
	}
	:where(.lifestyleSceneSection:nth-of-type(odd)) .lifestyleScene__header .heading {
		text-align: right;
		padding-left: .15em;
		padding-right: .35em;
	}
	:where(.lifestyleSceneSection:nth-of-type(even)) .lifestyleScene__header .heading {
		text-align: left;
		padding-left: .35em;
		padding-right: .15em;
	}
}
@media screen and (max-width: 736px) {
	.lifestyleScene__body {
		padding-top: clamp(40px, (40 / var(--lifestyleScene-maxW_val) * 100vw), 60px);
		padding-bottom: clamp(70px, (70 / var(--lifestyleScene-maxW_val) * 100vw), 90px);
	}
	.lifestyleScene__body .lifestyleSceneIntroBox .ptTextbox {
		text-align: left;
	}
	.lifestyleScene__body .lifestyleSceneIntroBox .ptTextbox br.SP {
		display: inline;
	}

	/* -- Individual -- */
	.lifestyleSceneShopping .lifestyleScene__header .mainPic img {
		object-position: 50% 6%;
	}
}

/* lifestyleSceneSlideWrap
---------------------------------------------------- */
	.lifestyleSceneSlideWrap {
	}
	.lifestyleSceneSlideWrap .picBox {
		position: relative;
	}
	.lifestyleSceneSlideWrap .dataBox {
		line-height: 1.55;
		text-align: center;
	}
	.lifestyleSceneSlideWrap .dataBox .name {
		font-size: clamp(1.3rem, (16 / 1400 * 100vw), 1.6rem);
		letter-spacing: .18em;
		margin-top: .6em;
		margin-bottom: .15em;
	}
	.lifestyleSceneSlideWrap .dataBox .dist {
		font-size: 1rem;
		letter-spacing: normal;
	}
@media screen and (max-width: 736px) {
	.lifestyleSceneSlideWrap .dataBox .name {
		letter-spacing: .16em;
	}
}


/* lifestyleSceneSection02
---------------------------------------------------- */
	.lifestyleSceneSection02 {}


/* lifestyleSceneSection03
---------------------------------------------------- */
	.lifestyleSceneSection03 .internationalSchoolBox {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 30px calc(60 / 1260 * 100%);
	}
	.lifestyleSceneSection03 .internationalSchoolBox .picBox .dataBox {
		line-height: 1.55;
		font-family: inherit;
		text-align: right;
		margin-top: .3em;
	}
	.lifestyleSceneSection03 .internationalSchoolBox .picBox .dataBox .name {
		display: inline-block;
		font-size: clamp(1.3rem, (16 / 1400 * 100vw), 1.6rem);
		letter-spacing: .18em;
	}
	.lifestyleSceneSection03 .internationalSchoolBox .picBox .dataBox .dist {
		display: inline-block;
		font-size: 1rem;
		letter-spacing: normal;
	}
@media screen and (max-width: 1200px) {
	.lifestyleSceneSection03 .internationalSchoolBox {
		column-gap: 20px;
		margin-left: calc(50 / 1000 * 100vw * -1); /* 調整 */
		margin-right: calc(50 / 1000 * 100vw * -1); /* 調整 */
	}
	.lifestyleSceneSection03 .internationalSchoolBox .picBox .dataBox {
		text-align: center;
		margin-top: .6em;
	}
	.lifestyleSceneSection03 .internationalSchoolBox .picBox .dataBox .dist {
		display: block;
		margin-top: .3em;
	}
}
@media screen and (max-width: 736px) {
	.lifestyleSceneSection03 .internationalSchoolBox {
		grid-template-columns: 1fr;
		margin-left: revert;
		margin-right: revert;
	}
}


/* lifestyleSceneSection04
---------------------------------------------------- */
	.lifestyleSceneSection04 .naturePickup {
		display: grid;
		grid-template-columns: calc(726 / 1260 * 100%) 1fr;
		gap: 0 calc(76 / 1400 * 100%);
	}
	.lifestyleSceneSection04 .naturePickup + .naturePickup {
		margin-top:var(--site-marpad-XL);
	}
	.lifestyleSceneSection04 .naturePickupPicBox {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		align-items: flex-start;
		gap: 0 calc(24 / 726 * 100%);
	}
	.lifestyleSceneSection04 .naturePickupPicBox > [class*="picBox"] {
		position: relative;
	}
	.lifestyleSceneSection04 .naturePickupTxtBox {
		align-self: center;
	}
	.lifestyleSceneSection04 .naturePickupTxtBox .dataBox .name {
		display: inline-block;
		line-height: 1.6;
		font-size: 1.714285em;
		letter-spacing: .18em;
	}
	.lifestyleSceneSection04 .naturePickupTxtBox .dataBox .dist {
		display: inline-block;
	}
	.lifestyleSceneSection04 .naturePickupTxtBox .txtBox {
		margin-top: 2em;
	}
	/* -- Individual -- */
	.lifestyleSceneSection04 .naturePickup:where(:nth-of-type(even)) {
		grid-template-columns: 1fr calc(726 / 1260 * 100%);
	}
	.lifestyleSceneSection04 :where(.naturePickup:nth-of-type(even)) .naturePickupTxtBox {
		order: -1;
	}
	.lifestyleSceneSection04 .naturePickupPicBox .picBox02 {
		margin-top: min((50 / 1400 * 100vw), 50px);
	}
@media screen and (max-width: 1000px) {
	.lifestyleSceneSection04 .naturePickup {
		grid-template-columns: 1fr;
	}
	.lifestyleSceneSection04 .naturePickup + .naturePickup {
		margin-top:var(--site-marpad-XXXL);
	}
	.lifestyleSceneSection04 .naturePickupTxtBox {
		order: 0;
		margin-top: 2em;
	}
	.lifestyleSceneSection04 .naturePickupTxtBox .txtBox {
		margin-top: 2em;
	}
	/* -- Individual -- */
	.lifestyleSceneSection04 .naturePickupPicBox .picBox02 {
		margin-top: max(22px, (22 / 375 * 100vw));
	}
}
@media screen and (max-width: 736px) {
	.lifestyleSceneSection04 .naturePickupTxtBox {
		margin-top: 1em;
	}
	.lifestyleSceneSection04 .naturePickupTxtBox .txtBox {
		margin-top: 1em;
	}
}

/* nearbyParkSection
--------------------------------- */
	.nearbyParkSection {
	}




/* lifeInformationSection
------------------------------------------------------------------------ */
	.lifeInformationSection {
	
	}

/* lifeInformationMapWrap
------------------------------------------------------------------------ */
@media screen and (max-width: 600px) {
	.lifeInformationMapWrap {
		width: 92%;
	}
}

/* ---------------------------------
	gmap | maplace.js
--------------------------------- */
/* catColor
----------------------- */
	/*.gmapNav ul li.locMapNav--01, #controls-mixed.js_ctrls0 {	--locMap-catColor: 0, 0, 0; }		// #000000 //
	.gmapNav ul li.locMapNav--02, #controls-mixed.js_ctrls1 {	--locMap-catColor: 30, 30, 30; }	// #000000 //
	.gmapNav ul li.locMapNav--03, #controls-mixed.js_ctrls2 {	--locMap-catColor: 60, 60, 60; }	// #000000 //
	.gmapNav ul li.locMapNav--04, #controls-mixed.js_ctrls3 {	--locMap-catColor: 90, 90, 90; }	// #000000 //
	.gmapNav ul li.locMapNav--05, #controls-mixed.js_ctrls4 {	--locMap-catColor: 120, 120, 120; }	// #000000 //
	.gmapNav ul li.locMapNav--06, #controls-mixed.js_ctrls5 {	--locMap-catColor: 150, 150, 150; }	// #000000 //*/
	
	.gmapNav ul li.locMapNav--01, #controls-mixed.js_ctrls0,
	.gmapNav ul li.locMapNav--02, #controls-mixed.js_ctrls1,
	.gmapNav ul li.locMapNav--03, #controls-mixed.js_ctrls2,
	.gmapNav ul li.locMapNav--04, #controls-mixed.js_ctrls3,
	.gmapNav ul li.locMapNav--05, #controls-mixed.js_ctrls4,
	.gmapNav ul li.locMapNav--06, #controls-mixed.js_ctrls5 {	--locMap-catColor: 164, 105, 30; }



/* gmapNav
----------------------- */
	.gmapNav {
		position: relative;
		margin-bottom: 20px;
		padding: 0;
	}
	/*.gmapNav::after {
		content: "";
		display: block;
		position: absolute;
		z-index: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 3px;
		background: lime;
	}*/
	.gmapNav ul {
		display: grid;
		grid-template-columns: repeat(6, 1fr);
		gap: 0 3px;
		position: relative;
		z-index: 1;
		/*max-width: 1420px;*/
		margin: 0 auto;
	}
	.gmapNav ul li {
		--M-fluidFontSize-max-fontsize: 18;
		--M-fluidFontSize-min-fontsize: 14;
		--M-fluidFontSize-max-viewport: 1400;
		--M-fluidFontSize-min-viewport: 900;
		--M-fluidFontSize-fontSize: clamp( var(--M-fluidFontSize-min-fontsize) * 1px, (var(--M-fluidFontSize-min-fontsize) * 1px) + (1vw - (var(--M-fluidFontSize-min-viewport) / 100 * 1px)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport))), var(--M-fluidFontSize-max-fontsize) * 1px );
				/*flex-basis: calc((100% - 5px) / 6.02);*/
		display: grid;
		line-height: 1.2;
		font-size: var(--M-fluidFontSize-fontSize);
		text-align: center;
		letter-spacing: .09em;
	}
	.gmapNav ul li a {
		display: grid;
		place-content: center;
		position: relative;
		min-height: 3.3em;
		/*min-height: min((50px + 1.4vw), 80px);*/
		color: #868686;
		padding: .5em .3em;
		transition: color .35s ease;
	}
	.gmapNav ul li a::after {
		content: "";
		position: absolute;
		inset: auto 0 0;
		z-index: 1;
		border-bottom: 3px solid #a7a7a7;
		transition: border .35s ease;
	}
	/* hover */
	@media (hover: hover) and (pointer: fine) {
		.gmapNav ul li a:hover {
			color: #222;
		}
		.gmapNav ul li a:hover::after {
			border-bottom-color: #333;
		}
	}
	.gmapNav ul li a:active,	/* base.cssのリセット */
	.gmapNav ul li a:focus,		/* base.cssのリセット */
	.gmapNav ul li a:focus-visible {
			color: #222;
	}
	.gmapNav ul li a:focus-visible::after {
			border-bottom-color: #333;
	}
	/* current */
	.gmapNav ul li.active a {
		color: rgba(var(--locMap-catColor), 1);
		/*background: rgba(var(--locMap-catColor), 1);*/
	}
	.gmapNav ul li.active a:active,	/* base.cssのリセット */
	.gmapNav ul li.active a:focus {	/* base.cssのリセット */
		color: rgba(var(--locMap-catColor), 1);
	}
	.gmapNav ul li.active a::after {
		border-bottom: 5px solid rgba(var(--locMap-catColor), 1);
	}
	/* -- Individual -- */
	/*.gmapNav ul li.locMapNav--02,
	.gmapNav ul li.locMapNav--03,
	.gmapNav ul li.locMapNav--06 {
		letter-spacing: .01em;
	}*/
@media screen and (max-width: 900px) {
	.gmapNav ul {
		grid-template-columns: repeat(3, 1fr);
		gap: .2em 4px;
	}
	.gmapNav ul li {
		--M-fluidFontSize-max-fontsize: 17;
		--M-fluidFontSize-min-fontsize: 10;
		--M-fluidFontSize-max-viewport: 900;
		--M-fluidFontSize-min-viewport: 375;
	}
}
@media screen and (max-width: 736px) {
	.gmapNav {
		margin-bottom: 30px;
	}
	.gmapNav ul li a::after {
		border-bottom-width: 2px;
	}
	/* current */
	.gmapNav ul li.active a::after {
		border-bottom-width: 4px;
	}
}
@media screen and (max-width: 480px) {
	/*.gmapNav ul li a {
		min-height: 45px;
	}*/
}


/* gmapBox
----------------------- */
	.gmapWrap .gmapBox {
		display: grid;
		grid-template-columns: 1fr clamp(250px, (360 / 1260 * 100%), 360px);
		gap: 0 min((50 / 1260 * 100%), 50px);
		/*height: clamp(300px, (90svh - var(--js-site-stickyHeader-height)), 570px);*/
		height: clamp(400px, (88vh - (60px + 140px)), 800px); /* ざっくりUIの高さを引く（60px=タブボタンの高さ、140px=ヘッダーの高さ） */
	}
@media screen and (max-width: 900px) {
	.gmapWrap .gmapBox {
		grid-template-columns: 1fr;
		gap: 10px 0;
		height: revert;
	}
	.gmapWrap .gmap-wrapper {
		width: 100%;
	}
}


/* #gmap-mixed
----------------------- */
	#gmap-mixed {
		width: 100%;
		height: 100%;
		/*height: 720px;*/ /*clamp(300px, 65svh, 560px)*/
		color: #000;
		background: #f7f7f7;
		border: 1px solid currentColor;
	}
@media screen and (max-width: 900px) {
	#gmap-mixed {
		min-height: 220px;		/* リスト部の高さの計算式に入れる */
		aspect-ratio: 1 / .6;	/* リスト部の高さの計算式で使う */
	}
}
/*@media screen and (orientation: landscape) and (max-width: 736px) {
	#gmap-mixed {
		aspect-ratio: 1 / .4;
	}
}*/
/* gm-style | 地図内のプロット（強制的に調整） ---------- */
	#gmap-mixed .gm-style .gm-style-iw-c {
		padding: 0 12px 12px !important;
		border-radius: 4px !important;
							/*background: tan;*/
	}
	#gmap-mixed .gm-style .gm-style-iw-chr .gm-style-iw-ch {
		/*flex: 1 1 !important;*/
							/*background: cyan !important;*/
	}
	#gmap-mixed .gm-style .gm-style-iw-chr button {
		/*flex: 0 0 20px !important;*/
		width:	20px !important;
		height:	17px !important;
		margin-right: -12px !important;
		border-radius: 0 4px 0 0 !important;
							/*background: green !important;*/
	}
	#gmap-mixed .gm-style .gm-style-iw-chr button > span {
		width:	16px !important;
		height:	16px !important;
		margin: 0 !important;
		transform: translate(1px, 1px);
							/*background: red;*/
	}
	#gmap-mixed .gm-style .gm-style-iw-d {
		overflow: auto !important;
		line-height: 1.4;
							/*background: skyblue;*/
	}
	#gmap-mixed .gm-style .gm-ui-hover-effect {
		opacity: .45;
	}
	#gmap-mixed .gm-style .gm-ui-hover-effect:hover {
		opacity: 1;
	}

/* #controls-mixed
----------------------- */
	#controls-mixed {
		/*--M-fluidFontSize-max-fontsize: 13;
		--M-fluidFontSize-min-fontsize: 11.5;
		--M-fluidFontSize-max-viewport: 1700;
		--M-fluidFontSize-min-viewport: 1400;
		--M-fluidFontSize-fontSize: clamp( var(--M-fluidFontSize-min-fontsize) * 1px, (var(--M-fluidFontSize-min-fontsize) * 1px) + (1vw - (var(--M-fluidFontSize-min-viewport) / 100 * 1px)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport))), var(--M-fluidFontSize-max-fontsize) * 1px );
		font-size: var(--M-fluidFontSize-fontSize);*/
		height: 100%;
		overflow-y: auto;
		line-height: 1.5;
		color: #000;
		font-size: 12px;
		letter-spacing: .08em;
		/*background: #fff;*/
		padding: 0;
	}
	#controls-mixed li {
		display: grid;
	}
	#controls-mixed li > a {
		display: grid !important;
		border-bottom: 1px solid currentColor;
		transition: background .35s ease;
	}
	#controls-mixed .titleText {
		display: flex;
		justify-content: space-between;
		align-items: baseline;
		gap: 0 .5em;
		width: 100%;
		/*font-size: .96em;*/
		padding: .17em 0 .22em;
	}
	#controls-mixed .ico_num {
		/*flex: 0 0 23px;*/
		flex: 0 0 1.916667em;
		translate: 0 20%; /* 微調整 */
	}
	#controls-mixed .nameSpecWrap {
		flex: 1 1;
		display: flex;
		flex-wrap: wrap;
		/*justify-content: space-between;
		align-items: center;*/
		gap: .2em 1.25em;
	}
	#controls-mixed .nameSpecWrap > * {
		flex-basis: 100%;
	}
	#controls-mixed .nameSpecWrap .name {
		/*flex: 1 1;*/
	}
	#controls-mixed .nameSpecWrap .name .nameInner {
	}
	#controls-mixed .nameSpecWrap .spec {
		/*flex-basis: 11.75em;*/
		/*flex-basis: 10.5em;*/
	}
	#controls-mixed .nameSpecWrap .spec > * {
		display: inline-block;
	}
	#controls-mixed .nameSpecWrap .note small {
		display: block;
		line-height: 1.3;
		font-family: inherit;
		font-size: .925em;
		color: inherit;
		letter-spacing: normal;
		margin-top: .2em;
	}
	/* hover */
	@media (hover: hover) and (pointer: fine) {
		#controls-mixed li > a:hover {
			/*background: rgba(var(--locMap-catColor), .05);*/
			background: rgba(var(--site-themeColor-accent_2), .08);
		}
	}
	#controls-mixed li > a:focus-visible {
			/*background: rgba(var(--locMap-catColor), .05);*/
			background: rgba(var(--site-themeColor-accent_2), .08);
	}
	/* current */
	#controls-mixed li.active > a {
		background: rgba(var(--site-themeColor-accent_2), .14);
	}
	/* -- Individual -- */
	#controls-mixed li:nth-of-type(1),	/* リストにViewAllは非表示 */
	#controls-mixed li:nth-of-type(2) {	/* リストに物件名は非表示 */
		display: none;
	}
@media screen and (max-width: 1200px) {
	#controls-mixed {
		font-size: 11px;
		letter-spacing: .03em;
	}
}
@media screen and (max-width: 900px) {
	#controls-mixed {
		height: clamp(200px, (95vh - (min(54vw, 220px) + 120px + 70px)), 400px); /* ざっくりUIの高さを引く（54vw=マップの高さ、120px=タブボタンの高さ、70px=追従ボタンの高さ）（ マップの高さ(vw) = ((マップの幅/ウィンドウの幅*100)*aspect-ratioの高さの値) = ((340/375*100)*.6)=約54vw ） */
		font-size: clamp(11px, (12 / 736 * 100vw), 12px);
	}
	#controls-mixed ul {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 0 20px;
	}
}
@media screen and (max-width: 600px) {
	#controls-mixed {
		font-size: 12px;
	}
	#controls-mixed ul {
		display: block;
	}
	#controls-mixed .titleText {
		padding: .4em 0 .43em;
		padding: 0 0 .1em;
	}
}
@media screen and (max-width: 450px) {
/*	#controls-mixed .titleText {
		padding: .15em 0 .18em;
	}
	#controls-mixed .nameSpecWrap {
		gap: 0 1.5em;
	}
	#controls-mixed .nameSpecWrap .spec {
		flex-basis: 6em;
	}
	#controls-mixed .nameSpecWrap .spec > .separate {
		display: none;
	}
	#controls-mixed .nameSpecWrap .spec > .time {
		display: block;
		color: #555;
	}*/
}












