@charset "utf-8";

/* =======================================================================================
	TEMPLATE
======================================================================================= */



/* =======================================================================================
	COMMON
======================================================================================= */



/* =======================================================================================
	PAGE
======================================================================================= */

/* ------------------------------------------------------------------------
	facade
------------------------------------------------------------------------ */
/* facadeContainer
------------------------------------------------------------------------ */
	.facadeContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 28%;
		--default-bgWavyBox-pattern-scale:		-1.82 1.82;
		--default-bgWavyBox-pattern-rotate:		8deg;
		--default-bgWavyBox-pattern-opacity:	.43;
		--default-bgWavyBox-pattern-translateX:	0;
		--default-bgWavyBox-pattern-translateY:	0;
	}
@media screen and (max-width: 1050px) {
	.facadeContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 300px;
		--default-bgWavyBox-pattern-scale:		-2.5 2.5;
		--default-bgWavyBox-pattern-rotate:		7deg;
		--default-bgWavyBox-pattern-translateX:	40%;
	}
	.facadeContainer .bgWavyBox span::after {	/* パターンに重ねる白グラデ(下) */
		background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, .92) 50%, rgba(255, 255, 255, 0) 98%);
	}
}
@media screen and (max-width: 736px) {
	.facadeContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 100px;
		--default-bgWavyBox-pattern-scale:		-3 3;
		--default-bgWavyBox-pattern-translateX:	39%;
		--default-bgWavyBox-pattern-translateY:	48%;
		--default-bgWavyBox-gradient-bottom-height:	min(70%, 950px);
	}
}

/* facadeSection
------------------------------------------------------------------------ */
	.facadeSection[class*="SmkGridBox_A-"] {
		--__gtColumns-A_pic: max(400px, (1260 / 1920 * 100%));
		width: 100%;
		max-width: none;
	}
	.facadeSection .materialPic {
		position: relative;
		width: 85%;
		max-width: 390px;
		margin-top: 2.5em;
	}
@media screen and (min-width: 1050.02px) {
	.facadeSection .SmkGridBox_A__txt {
		padding-right: clamp(27px, (40 / 1700 * 100vw), 40px);
	}
}
@media screen and (max-width: 1050px) {
	.facadeSection .materialPic {
		aspect-ratio: 307 / 175;
		margin-left: auto;
		margin-right: auto;
	}
	.facadeSection .materialPic img {
		position: absolute;
		inset: 0;
		z-index: 0;
		width: 100%;
		max-width: none;
		height: 100%;
		object-fit: cover;
		object-position: 50% 60%;
	}
	.facadeSection .SmkGridBox_A__pic .picBox {
		width: 100%;
		aspect-ratio: 540 / 485;
	}
	.facadeSection .SmkGridBox_A__pic .picBox img {
		position: absolute;
		inset: 0;
		z-index: 0;
		width: 100%;
		max-width: none;
		height: 100%;
		object-fit: cover;
		object-position: 20% 50%;
	}
}
@media screen and (max-width: 736px) {
	.facadeSection .materialPic {
		width: 100%;
	}
}





/* ------------------------------------------------------------------------
	entrance
------------------------------------------------------------------------ */
/* entranceContainer
------------------------------------------------------------------------ */
	.entranceContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center -20%;
		--default-bgWavyBox-pattern-scale:		1.75 1.75;
		--default-bgWavyBox-pattern-rotate:		-6deg;
		--default-bgWavyBox-pattern-opacity:	.3;
		--default-bgWavyBox-pattern-translateX:	-20%;
		--default-bgWavyBox-pattern-translateY:	0;
	}
@media screen and (max-width: 1050px) {
	.entranceContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 0;
		--default-bgWavyBox-pattern-scale:		2.5 2.5;
		--default-bgWavyBox-pattern-rotate:		-8deg;
		--default-bgWavyBox-pattern-opacity:	.43;
		--default-bgWavyBox-pattern-translateX:	18%;
		--default-bgWavyBox-pattern-translateY:	46%;
	}
}
@media screen and (max-width: 736px) {
	.entranceContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 0;
		--default-bgWavyBox-pattern-scale:		1.94 1.94;
		--default-bgWavyBox-pattern-rotate:		-8deg;
		--default-bgWavyBox-pattern-opacity:	.43;
		--default-bgWavyBox-pattern-translateX:	18%;
		--default-bgWavyBox-pattern-translateY:	36%;
	}
}

/* entranceSection
------------------------------------------------------------------------ */
	.entranceSection[class*="SmkGridBox_A-"] {
		--__gtColumns-A_pic: max(400px, (1270 / 1920 * 100%));
		width: 100%;
		max-width: none;
	}
@media screen and (min-width: 1050.02px) {
	.entranceSection .SmkGridBox_A__txt {
		padding-left: clamp(37px, (50 / 1700 * 100vw), 50px);
	}
}





/* ------------------------------------------------------------------------
	entranceHall
------------------------------------------------------------------------ */
/* entranceHallContainer
------------------------------------------------------------------------ */
	.entranceHallContainer {
		padding-bottom: var(--site-marpad-XXXL);
	}
	.entranceHallContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 0%;
		--default-bgWavyBox-pattern-scale:		-1.85 1.85;
		--default-bgWavyBox-pattern-rotate:		8deg;
		--default-bgWavyBox-pattern-opacity:	.35;
		--default-bgWavyBox-pattern-translateX:	15%;
		--default-bgWavyBox-pattern-translateY:	0;
	}
@media screen and (max-width: 1050px) {
	.entranceHallContainer {
		padding-bottom: 0;
	}
	.entranceHallContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 9%;
		--default-bgWavyBox-pattern-scale:		-2.2 2.2;
	}
}

/* entranceHallSection
------------------------------------------------------------------------ */
	.entranceHallSection {
	}
	.entranceHallSection[class*="SmkGridBox_A-"] {
		--__gtColumns-A_pic: max(400px, (1155 / 1920 * 100%));
		width: 100%;
		max-width: none;
	}
@media screen and (min-width: 1050.02px) {
	.entranceHallSection .SmkGridBox_A__txt {
		padding-right: clamp(27px, (40 / 1700 * 100vw), 40px);
	}
}





/* ------------------------------------------------------------------------
	commonSpaceStory
------------------------------------------------------------------------ */
/* commonSpaceStoryContainer
------------------------------------------------------------------------ */
	.commonSpaceStoryContainer {
	}
	.commonSpaceStoryContainer .is_bgWavyBox_1 {
		display: none;
	}
@media screen and (max-width: 1050px) {
	.commonSpaceStoryContainer {
		padding-top: var(--site-marpad-XXXL);
	}
	.commonSpaceStoryContainer .is_bgWavyBox_1 {
		--default-bgWavyBox-pattern-bgPosition:	center 30%;
		--default-bgWavyBox-pattern-scale:		-2.5 2.5;
		--default-bgWavyBox-pattern-rotate:		0deg;
		--default-bgWavyBox-pattern-opacity:	.17;
		--default-bgWavyBox-pattern-translateX:	-3%;
		--default-bgWavyBox-pattern-translateY:	15%;
		display: block;
		height: 430px;
	}
}

/* commonSpaceStorySection
------------------------------------------------------------------------ */
	.commonSpaceStorySection {
		--design-commonSpaceStorySection__pic-adjustPaddingTop: 60;		/* 微調整 */
		display: grid;
		grid-template: 
			"ttl pic" auto
			"txt pic" auto /
			1fr min((860 / 1560 * 100vw), 860px);
		width: var(--site-sizeContentWide-M2);
		align-content: center;
		align-items: center;
		gap: 15px 60px;
		max-width: 1370px;
		margin-left: auto;
		margin-right: auto;
	}
	.commonSpaceStorySection__ttl {	grid-area: ttl;	align-self: end;}
	.commonSpaceStorySection__txt {	grid-area: txt;	align-self: start;}
	.commonSpaceStorySection__pic {	grid-area: pic;}

	.commonSpaceStorySection__ttl {
		position: relative;
		z-index: 1; /* __picより上にくるように（少し見出しをはみ出すため） */
	}
	.commonSpaceStorySection__ttl [class*="ptItalicTitle_"] {
		--default-ptItalicTitle_-color-alpha:	.39;
		margin-bottom: .05em;
		margin-top: calc(var(--design-commonSpaceStorySection__pic-adjustPaddingTop) * -1px); /* 微調整｜上へずらす */
	}
	.commonSpaceStorySection__ttl [class*="ptItalicTitle_"] > * {
		display: inline-block;
		font-size: 1.05em;
		/*letter-spacing: -.03em;*/
		margin-right: calc(-60px + -1.1em); /* gap + はみ出し量 | 少し見出しをはみ出す */
	}
	.commonSpaceStorySection__ttl .ptHeading {
		margin-right: -2em; /* 少し見出しをはみ出す */
	}
	
	.commonSpaceStorySection__pic {
		position: relative;
		z-index: 0;
		padding-top: calc(var(--design-commonSpaceStorySection__pic-adjustPaddingTop) * 1px); /* 微調整｜上に余白を増やす */
	}
	.commonSpaceStorySection__pic img {
		width: 100%;
		max-width: none;
		height: auto;
	}
	
	.commonSpaceStorySection__txt {
		line-height: 1.75;
		font-size: clamp(1.275rem, (14.4 / 1560 * 100vw), .9em);
		text-align: justify;
		letter-spacing: .06em;
	}
	.commonSpaceStorySection__txt .pointSection {
		--commonSpaceStorySection-pointSection-heading-color: currentColor;
	}
	.commonSpaceStorySection__txt .pointSection_1 {	--commonSpaceStorySection-pointSection-heading-color: #009175;}
	.commonSpaceStorySection__txt .pointSection_2 {	--commonSpaceStorySection-pointSection-heading-color: #1e76ad;}
	.commonSpaceStorySection__txt .pointSection_3 {	--commonSpaceStorySection-pointSection-heading-color: #ed7d31;}

	.commonSpaceStorySection__txt .pointSection:nth-of-type(n+2) {
		margin-top: 2.4em;
	}
	.commonSpaceStorySection__txt .pointSection .heading {
		position: relative;
		line-height: 1.5;
		color: var(--commonSpaceStorySection-pointSection-heading-color);
		font-size: 1.5em;
		letter-spacing: .07em;
		margin-bottom: .35em;
	}
	.commonSpaceStorySection__txt .pointSection .heading .point {
		display: inline-block;
		font-family: var(--site-font_family-en_1);
		font-size: 1.075em;
		letter-spacing: .01em;
		margin-right: .75em;
	}
	.commonSpaceStorySection__txt .pointSection .hedingWord {
		display: inline-block;
	}
@media screen and (max-width: 1050px) {
	.commonSpaceStorySection {
		--design-commonSpaceStorySection__pic-adjustPaddingTop: 0;		/* 微調整のリセット */
		display: block;
	}
	
	.commonSpaceStorySection__ttl {
		text-align: center;
	}
	.commonSpaceStorySection__ttl [class*="ptItalicTitle_"] > * {
		font-size: 1em;
		margin-right: 0;
	}
	.commonSpaceStorySection__ttl .ptHeading {
		margin-right: 0;
	}
	
	.commonSpaceStorySection__pic {
		width: 94%;
		max-width: 650px;
		margin-left: auto;
		margin-right: auto;
		margin-top: clamp(25px, (30 / 540 * 100vw), 35px);
	}
	
	.commonSpaceStorySection__txt {
		width: 94%;
		max-width: 650px;
		line-height: 1.85;
		font-size: .9em;
		margin-top: clamp(40px, (40 / 540 * 100vw), 60px);
		margin-left: auto;
		margin-right: auto;
	}
	.commonSpaceStorySection__txt .pointSection:nth-of-type(n+2) {
		margin-top: 2.75em;
	}
	.commonSpaceStorySection__txt .pointSection .heading {
		font-size: 1.7em;
	}
	.commonSpaceStorySection__txt .pointSection .heading::before {
		content: "";
		display: block;
		width: calc(((100vw - var(--site-sizeContentWide-M2)) / 2) + 4.2em);
		height: 0;
		margin-bottom: .45em;
		margin-left: calc((100vw - var(--site-sizeContentWide-M2)) / -2);
		border-top: 1px solid var(--commonSpaceStorySection-pointSection-heading-color);
	}
}
@media screen and (max-width: 736px) {
	.commonSpaceStorySection__ttl [class*="ptItalicTitle_"] > * {
		font-size: .935em;
	}
	.commonSpaceStorySection__txt {
		font-size: min(1em, 1.35rem);
	}
	.commonSpaceStorySection__txt .pointSection .heading {
		font-size: clamp(2rem, (23 / 540 * 100vw), 2.7rem);
	}
}
@media screen and (max-width: 540px) {
	.commonSpaceStorySection__pic,
	.commonSpaceStorySection__txt {
		width: 100%;
		max-width: none;
	}
}




/* ------------------------------------------------------------------------
	landscape
------------------------------------------------------------------------ */
/* landscapeContainer
------------------------------------------------------------------------ */
	.landscapeContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 50%;
		--default-bgWavyBox-pattern-scale:		-1.7 1.7;
		--default-bgWavyBox-pattern-rotate:		8deg;
		--default-bgWavyBox-pattern-opacity:	.35;
		--default-bgWavyBox-pattern-translateX:	-3%;
		--default-bgWavyBox-pattern-translateY:	30%;
	}
@media screen and (max-width: 1050px) {
	.landscapeContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 20%;
		--default-bgWavyBox-pattern-scale:		4 4;
		--default-bgWavyBox-pattern-rotate:		-8deg;
		--default-bgWavyBox-pattern-opacity:	.35;
		--default-bgWavyBox-pattern-translateX:	67%;
		--default-bgWavyBox-pattern-translateY:	56%;
	}
}
@media screen and (max-width: 540px) {
	.landscapeContainer .bgWavyBox {
		--default-bgWavyBox-pattern-translateX:	57%;
		--default-bgWavyBox-pattern-translateY:	64%;
	}
}

/* landscapeSection
------------------------------------------------------------------------ */
	.landscapeSection {
	}
	.landscapeSection[class*="SmkGridBox_A-"] {
		--__gtColumns-A_pic: max(400px, (1070 / 1600 * 100%));
		width: var(--site-sizeContentWide-M5);
		max-width: 1600px;
	}
	.landscapeSection .SmkGridBox_A__pic [class*="bgBoxShadow_"] {
	 	--default-bgBoxShadow_-padding: 0;
	 }
	.landscapeSection .SmkGridBox_A__pic [class*="bgBoxShadow_"] .imgcapkeep {
	 	padding: 2em;
	 }
@media screen and (max-width: 736px) {
	.landscapeSection .SmkGridBox_A__txt {
		margin-top: clamp(30px, (30 / 540 * 100vw), 40px); /* 微調整 */
	}
	.landscapeSection .SmkGridBox_A__pic [class*="bgBoxShadow_"] .imgcapkeep {
	 	padding: 1em;
	 }
}





/* ------------------------------------------------------------------------
	ecology
------------------------------------------------------------------------ */
/* ecologyContainer
------------------------------------------------------------------------ */
	.ecologyContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 50%;
		--default-bgWavyBox-pattern-scale:		-1.9 1.9;
		--default-bgWavyBox-pattern-rotate:		8deg;
		--default-bgWavyBox-pattern-opacity:	.35;
		--default-bgWavyBox-pattern-translateX:	-5%;
		--default-bgWavyBox-pattern-translateY:	33%;
	}
@media screen and (max-width: 1050px) {
	.ecologyContainer .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 20%;
		--default-bgWavyBox-pattern-scale:		4.5 4.5;
		--default-bgWavyBox-pattern-rotate:		-8deg;
		--default-bgWavyBox-pattern-opacity:	.3;
		--default-bgWavyBox-pattern-translateX:	70%;
		--default-bgWavyBox-pattern-translateY:	45%;
	}
}
@media screen and (max-width: 736px) {
	.ecologyContainer {
		padding-bottom: var(--site-marpad-XXL);
	}
	.ecologyContainer .bgWavyBox {
		--default-bgWavyBox-pattern-scale:		5 5;
		--default-bgWavyBox-pattern-translateX:	100%;
		--default-bgWavyBox-pattern-translateY:	70%;
	}
}

/* ecologySection
------------------------------------------------------------------------ */
	.ecologySection {
		position: relative;
		z-index: 0;
		padding-top: clamp(80px, (120 / 1920 * 100vw), 120px);
		padding-bottom: 40px;
	}
	.ecologySection::before {
		content: "";
		position: absolute;
		inset: 0% 0 0 auto;
		z-index: -1;
		width: 60%;
		height: 80%;
		background: linear-gradient(145deg, rgba(var(--site-themeColor-sub), .92) 0%, rgba(var(--site-themeColor-sub), .15) 58%, rgba(var(--site-themeColor-sub), 0) 80%);
	}
	.ecologySection[class*="SmkGridBox_A-"] {
		--__gtColumns-A_pic: max(400px, (725 / 1360 * 100%));
		width: var(--site-sizeContentWide-M1);
		max-width: 1360px;
	}
@media screen and (max-width: 1050px) {
	.ecologySection {
		position: relative;
		z-index: 0;
		padding-top: 0;
		padding-bottom: 0;
	}
	.ecologySection::before {
		display: none;
	}
	.ecologySection .SmkGridBox_A__pic .picBox {
		aspect-ratio: 390 / 225;
	}
	.ecologySection .SmkGridBox_A__pic .picBox img {
		position: absolute;
		inset: 0;
		z-index: 0;
		width: 100%;
		max-width: none;
		height: 100%;
		object-fit: cover;
		object-position: 50% 40%;
	}
}
@media screen and (max-width: 736px) {
	.ecologySection .SmkGridBox_A__txt {
		margin-top: clamp(30px, (30 / 540 * 100vw), 40px); /* 微調整 */
	}
}





/* ------------------------------------------------------------------------
	results
------------------------------------------------------------------------ */
/* resultsContainer
------------------------------------------------------------------------ */
	.resultsContainer {
	}
/*@media screen and (max-width: 736px) {
	.resultsContainer {
		margin-top: 0;
	}
}*/

/* resultsSection
------------------------------------------------------------------------ */
	.resultsSection {
		width: 75%;
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
	}
	.resultsSectionHeader {
		text-align: center;
	}
	.resultsSectionHeader .heading {
		display: inline-block;
		margin-bottom: clamp(45px, (90 / 1600 * 100vw), 90px);
	}
	.resultsSectionHeader .heading .ttl {
		display: block;
		letter-spacing: .26em;
	}
	.resultsSectionHeader .heading .sttl {
		display: grid;
		grid-template-columns: minmax(.5em, 1fr) auto minmax(.5em, 1fr);
		align-items: center;
		gap: 0 .45em;
		font-size: .8048em;
		letter-spacing: .13em;
		margin-top: .5em;
	}
	.resultsSectionHeader .heading .sttl::before,
	.resultsSectionHeader .heading .sttl::after {
		content: "";
		display: block;
		border-top: 1px solid;
		margin-bottom: -.15em;
	}
	.resultsSection .phBox {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 17px calc(50 / 1000 * 100%);
	}
	.resultsSection .phUnit {
	}
	.resultsSection .phUnit .ph {
	}
	.resultsSection .phUnit .ph img {
		width: 100%;
		max-width: none;
		height: auto;
	}
	.resultsSection .phUnit .name {
		display: block;
		line-height: 1.5;
		font-size: clamp(1rem, (13.6 / 1050 * 100vw), 1.36rem);
		padding: .5em 0;
	}
	.resultsSection .phUnit .name .complete {
		display: inline-block;
	}
@media screen and (max-width: 1050px) {
	.resultsSection {
		width: var(--site-sizeContentWide-M1);
	}
	.resultsSection .phUnit .name {
		letter-spacing: .03em;
	}
}
@media screen and (max-width: 736px) {
	.resultsSection {
		width: var(--site-sizeContentWide-M3);
	}
	.resultsSectionHeader .heading .ttl {
		letter-spacing: .22em;
	}
	.resultsSectionHeader .heading .sttl {
		letter-spacing: .1em;
	}
}
@media screen and (max-width: 539.98px) {
	.resultsSectionHeader .heading .ttl {
		font-size: .91em;
	}
	.resultsSectionHeader .heading .sttl {
		font-size: .74em;
	}
	.resultsSection .phBox {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 10px calc(16 / 540 * 100%);
	}
	.resultsSection .phUnit .name .complete {
		display: block;
	}
}