@charset "utf-8";

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


/*--------------------------
	スワイプ 
--------------------------- */
.js_swipeMe .pic img{
		width: 100%;
		max-width: none;
	}

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

/* ---------------------------------------------------------------
planFloorSection
--------------------------------------------------------------- */




/*planFloorPontBox
-------------------------------------*/
	.planFloorPontBox {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-top:var(--site-marpad-XXL) ;
	}

	/* planUnit */
	.planFloorPontBox .planUnit{
		width: 32%;
		position: relative;
		border: 1px solid #474747;
		background: #FFFFFF;
		padding: 1.5em;
		text-align: center;
	}
	.planFloorPontBox .planUnit .type{
		top: -1.7em;
		left: 0;
		position: absolute;
		color: #000;
		font-family: var(--site-font_family-en_1);
		font-style: italic;
	}
	.planFloorPontBox .planUnit .type .txtL {
	  font-size: 2.25em;
		display: block;
		line-height: 0.75;
	}
	.planFloorPontBox .planUnit .typeMerit {
		--M-fluidFontSize-max-fontsize: 18;
		--M-fluidFontSize-min-fontsize: 16;
		--M-fluidFontSize-max-viewport: 1400;
		--M-fluidFontSize-min-viewport: 900;
		min-height: 0.001vw; /* for safari | font-sizeにclamp()使用時必須 */
		font-size: clamp(
			calc(var(--M-fluidFontSize-min-fontsize) * .1rem),
			calc(calc(var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - calc(var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport)))),
			calc(var(--M-fluidFontSize-max-fontsize) * .1rem)
		);
	}



@media screen and (max-width: 900px) {
	.planFloorPontBox {
		margin-top:var(--site-marpad-S) ;
	}
	.planFloorPontBox .planUnit{
		width: 90%;
		margin: 0 auto;
		margin-top: 3em;
	}
}

@media screen and (max-width: 600px) {
	.planFloorPontBox .planUnit .typeMerit .inbl{
		display: inline;
	}
}
@media screen and (max-width: 480px) {
	.planFloorPontBox .planUnit{
		padding: 1em;
	}
	.planFloorPontBox .planUnit .type{
		font-size: 1.1rem;
	}
	.planFloorPontBox .planUnit .typeMerit {
		--M-fluidFontSize-max-fontsize: 16;
		--M-fluidFontSize-min-fontsize: 14;
		--M-fluidFontSize-max-viewport: 600;
		--M-fluidFontSize-min-viewport: 480;
		text-align: left;
	}

}








/* ---------------------------------------------------------------
planContSection
--------------------------------------------------------------- */

/* movieWrap
-----------------------------------------*/

/* venobox btn START */
.vbox-overlay {
	width: 100%;
}
	/* ----- hove ----- */
	.movieWrap .movieItem_img a.venobox:focus {
        outline: none;
    }
	@media (hover: hover) and (pointer: fine) {
       .movieWrap .movieItem_img a.venobox:hover {
            opacity: .7;
		   transition: opacity 0.2s;
		}
    }
/* venobox btn END */

	
	/*venobox*/
	.venobox_movieSizeAdjust {
	  position: relative;
	  width:100%; /* 横幅は100%にしておく*/
	  height:0; /* 高さは0にしておく(padding-topで高さを指定するため) */
	  padding-top: 56.25%; /* 高さを指定(16:9) */
	 }
	.venobox_movieSizeAdjust video,
	.venobox_movieSizeAdjust iframe {
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	}





/* planListWrap
-----------------------------------------*/
	.planListWrap {
		margin-top:var(--site-marpad-XXL);
	}

	/* jquery_tabs button ---------*/
	.planTypeTabBox .jsTabs_btn {
        margin-bottom: 2px;
	}
	.planTypeTabBox .jsTabs_btn ul {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        margin: 0;
        padding: 0;
	}
	.planTypeTabBox .jsTabs_btn li {
		flex-grow: 0;
		display: flex;
		width: 22%;
		margin-right: 2px;
		
	}
	.planTypeTabBox .jsTabs_btn li a {
        display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		z-index: 1;
        width: 100%;
        line-height: 1;
        font-size: clamp(1.6rem, (20 / 1400 * 100vw), 2rem);
        letter-spacing: .1em;
        min-height: 50px;
        text-align: left;
        margin: 0 auto;
        padding: .2em 1em .3em;
        color: rgba(var(--site-variationColor-whitish), 1);
		background: #ac9170;
		font-family: var(--site-font_family-en_1);
		transition: all .33s ease-out;
	}
	.planTypeTabBox .jsTabs_btn li a[href]::before{
		content:"";display:block;position:absolute;top:0;right:0;z-index:-1;width:100%;height:100%;
		background: linear-gradient(to right, #4e3414 0, #af9473 50%, #4e3414 100%);
		opacity: 0;
		transition: opacity .18s ease-out;
	}
    .planTypeTabBox .jsTabs_btn li a .inner{
        width: 100%;
    }
    .planTypeTabBox .jsTabs_btn .inner .name{
		font-size: 1.85em;
    }


	/*Coming Soon*/
	.planTypeTabBox .jsTabs_btn li a:not([href]) {
       pointer-events: none;
		color: #bbbbbb;
		background: #eaeaea;
	}


	/* hover, focus, current */
	.planTypeTabBox .jsTabs_btn li.is-current a[href]::before{
		opacity: 1;
        background: linear-gradient(to right, #4e3414 0, #af9473 50%, #4e3414 100%);
	}
	@media (hover: hover) and (pointer: fine) {
	.planTypeTabBox .jsTabs_btn li:not(.is-current) a:hover {
			background: #4e3414;
		}
	}
	.planTypeTabBox .jsTabs_btn li:not(.is-current) a:focus-visible  {
		 background: #4e3414;
	}

@media screen and (max-width: 900px) {
	.planTypeTabBox .jsTabs_btn ul {
		justify-content: space-between;
		margin-right: 0;
		padding: 0 1.5em;
	}
	.planTypeTabBox .jsTabs_btn li {
		width: 33%;
		margin-right: 0px;
	}
}

@media screen and (max-width: 480px) {
	.planTypeTabBox .jsTabs_btn ul {
		padding: 0 ;
	}
	.planTypeTabBox .jsTabs_btn li a {
		font-size: 1.55rem;
		padding: .3em .5em;
		letter-spacing: 0.05em;
		text-align: center;
	}
}



/*　jsTabs_content
------------------------------------------------------------------------ */

/* jsTabs_content 共通設定
--------------------------------------- */
    .jsTabs_content {
        border: 1px solid #acacac;
    }

	/*specSection*/
	.jsTabs_content .specSection {
		background: #f8f8f8 var(--site-pattern-lightGray);
		padding: clamp(30px, (30 / 900 * 100vw), 60px) 0;
	}

/*　specWrap
------------------------------------- */
	/* spec1 */
	.jsTabs_content .specWrap .spec1 {
		line-height: 1.2;
		text-align: center;
		margin: 0 .1em;
		background: #957959;
		color: #fff;
	}
	.jsTabs_content .specWrap .spec1 .spec-type {
		--M-fluidFontSize-max-fontsize: 30;
		--M-fluidFontSize-min-fontsize: 20;
		--M-fluidFontSize-max-viewport: 1200;
		--M-fluidFontSize-min-viewport: 480;
		min-height: 0.001vw; /* for safari | font-sizeにclamp()使用時必須 */
		font-size: clamp(
			calc(var(--M-fluidFontSize-min-fontsize) * .1rem),
			calc(calc(var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - calc(var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport)))),
			calc(var(--M-fluidFontSize-max-fontsize) * .1rem)
		);
		font-family: var(--site-font_family-en_1);
		letter-spacing: 0.2em;
	}
	.jsTabs_content .specWrap .spec1 .spec-type .type {
		font-size: 0.8em;
		letter-spacing: .1em;
	}
	.jsTabs_content .specWrap .spec1 .spec-type .name {
		font-size: 2.333em;
		letter-spacing: 0.03em;
	}
	.jsTabs_content .specWrap .spec1 .all-area {
		display: block;
		background: #503617;
		padding: 0.3em;
		line-height: 1;
	}
	.jsTabs_content .specWrap .spec1 .value {
		font-family: var(--site-font_family-en_1);
		font-size: 2em;
	}
	.jsTabs_content .specWrap .spec1 .value em {
		font-size: 1.4em;
	}

	/* spec2 */
	.jsTabs_content .specWrap .spec2 {
		line-height: 1.3;
		font-family: var(--site-font_family-serif);
	}
	.jsTabs_content .specWrap .spec2 .spec-ldk {
		line-height: 1.2;
		font-size: 2.375em;
		letter-spacing: .1em;
		font-family: var(--site-font_family-en_1);
	}
	.jsTabs_content .specWrap .spec2 .spec-ldk .ldkUnit {
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
	}
	.jsTabs_content .specWrap .spec2 .spec-ldk .ldkUnit > b {
		margin-right: 2px;
	}
	.jsTabs_content .specWrap .spec2 .spec-ldk .ldkUnit > .element {
		display: inline-block;
	}
	.jsTabs_content .specWrap .spec2 .spec-ldk .ldkUnit > .element b {
		margin: 0 2px;
	}
	.jsTabs_content .specWrap .spec2 .wrap-spec-building .spec-lot,
	.jsTabs_content .specWrap .spec2 .wrap-spec-building  .spec-balcony{
		display: block;
		/*font-size: 0.875em;*/
	}
	.jsTabs_content .specWrap .spec2 .spec-lot,
	.jsTabs_content .specWrap .spec2 .spec-balcony{
		padding: .15em .8em 0 0;
	}
	.jsTabs_content .specWrap .spec2 .tsubo {
		display: inline-block;
		letter-spacing: .02em;
	}

	/* symList-kome */
	.jsTabs_content .symList-kome {
		padding-top: 1.5em;
	}

@media screen and (min-width: 600.02px) {
	/* specWrap */
	.jsTabs_content .specWrap {
		display: flex;
		justify-content: space-between;
	}

	/* spec1 */
	.jsTabs_content .specWrap .spec1 {
		flex: 0 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		min-width: 170px;
	}
	.jsTabs_content .specWrap .spec1 .spec1_inner{
		width: 100%;
	}
	
	/* spec2 */
	.jsTabs_content .specWrap .spec2 {
		flex: 1 1;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		padding: 5px 20px 5px 30px;
	}
	.jsTabs_content .specWrap .spec2 .spec-ldk {
		display: block;
		width: 100%;
		padding-bottom: .3em;
	}
}
@media screen and (max-width: 900px) {
	/* spec1 */
	  .jsTabs_content .specWrap .spec1 {
		min-width: 140px;
	  }
	.jsTabs_content .specWrap .spec1 .value {
		font-size: 2.2em;
		letter-spacing: .03em;
	}
	/* spec2 */
	.jsTabs_content .specWrap .spec2 {
		padding: 5px 10px 5px 20px;
	}
	.jsTabs_content .specWrap .spec2 .spec-ldk {
		font-size: 2.2em;
		letter-spacing: .05em;
	}
	.jsTabs_content .specWrap .spec2 .wrap-spec-building{
		font-size: 1.3rem;
	}
}
@media screen and (max-width: 600px) {
	.jsTabs_content .specWrap{
		width: 90%;
	}
	/* spec1 */
	.jsTabs_content .specWrap .spec1 .spec-type {
		margin-top: -.3em;
	}
	
	/* spec2 */
	.jsTabs_content .specWrap .spec2 {
		padding: 0 ;
	}
	.jsTabs_content .specWrap .spec2 .spec-ldk .ldkUnit {
	  justify-content: center;
	}
	.jsTabs_content .specWrap .spec2 .wrap-spec-building {
		text-align: center;
	  }
	.jsTabs_content .specWrap .spec2 .spec-ldk,
	.jsTabs_content .specWrap .spec2 .spec-lot,
	.jsTabs_content .specWrap .spec2 .spec-balcony{
		padding: .4em .5em 0 0;
	}
}


	/* planWrapperBox
	-------------------------------------------------------*/
	.planWrapperBox{
		padding: 0 clamp(30px, (30 / 600 * 100vw), 80px) clamp(20px, (20 / 900 * 100vw), 30px) ;
	}

	/* planMerit
	------------------ */
	.jsTabs_content .planMeritWrap {
		max-width:800px;
		text-align: center;
		margin: 30px auto 60px;
		border:0 solid #999;
		border-width:1px 0;
	}
	.jsTabs_content .planMerit {
		--M-fluidFontSize-max-fontsize: 18;
		--M-fluidFontSize-min-fontsize: 16;
		--M-fluidFontSize-max-viewport: 1200;
		--M-fluidFontSize-min-viewport: 600;
		min-height: 0.001vw; /* for safari | font-sizeにclamp()使用時必須 */
		font-size: clamp(
			calc(var(--M-fluidFontSize-min-fontsize) * .1rem),
			calc(calc(var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - calc(var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport)))),
			calc(var(--M-fluidFontSize-max-fontsize) * .1rem)
		);
		display: inline-block;
		text-align: left;
		padding: 1em 0.5em;
		letter-spacing: 0.12em;
	}
	.jsTabs_content .planMerit li {
		position: relative;
		line-height: 1.55;
		margin: .4em 0;
		padding-left: 1.5em;
	}
	.jsTabs_content .planMerit li:before {
		content: "─";
		position: absolute;
		top: 0;
		left: 0;
		color: inherit;
	}
	.jsTabs_content .planMerit li .kana {
		letter-spacing: -0.06em;
	}


	/* planPic
	------------------ */
	.jsTabs_content .planPic {
		text-align: center;
		margin: 0 auto 60px;
	}
@media screen and (max-width: 1050px) {
	.jsTabs_content .planPic {
		margin: 0 auto 30px;
	}
}
@media screen and (max-width: 600px) {
	.planWrapperBox small{
		font-size: 0.95rem;
	}
	.jsTabs_content .planMeritWrap {
		margin: clamp(20px, (20 / 480 * 100vw), 30px) auto ;
	}

	.jsTabs_content .planMerit {
		letter-spacing: 0.01em;
		padding: 1em 0.3em;
		--M-fluidFontSize-max-fontsize: 16;
		--M-fluidFontSize-min-fontsize: 13.5;
		--M-fluidFontSize-max-viewport: 600;
		--M-fluidFontSize-min-viewport: 480;
	}
	
	.jsTabs_content .planPic {
		margin: 0 auto 20px;
	}
}





/* ---------------------------------------------------------------
equSection
--------------------------------------------------------------- */
	.mainPicWrap{
		margin-bottom:var(--site-marpad-L);
		position: relative;
	}


	/* 共通 */
	.equWrap [class*="equ-area0"] {
		margin-bottom:var(--site-marpad-L);
	}
	.equWrap [class*="equ-area0"]:last-child {
		margin-bottom:0;
	}
	.equWrap [class*="equ-area0"]  .ttl{
		border: 0 solid #999;
		border-width: 1px 0;
		padding: .5em 0;
		line-height: 1.3;
	}
	.equWrap [class*="equ-area0"]  .pic{
		position: relative;
	}
	.equWrap .equ-area01 .equItem03 .ttl br {display: none;}

@media screen and (min-width: 600.02px)  {
	.equWrap .equ-area01 .equItem01 { grid-area: aaa; }
	.equWrap .equ-area01 .equItem02 { grid-area: bbb; }
	.equWrap .equ-area01 .equItem03 { grid-area: ccc; }
}
@media screen and (min-width: 900.02px) {
	.equWrap .equ-area01 {
	  display: grid;
	  grid-template-columns: 47.5% 47.5%;
	  grid-template-rows: 1fr 1fr;
	  gap: 40px 60px;
	  grid-template-areas:
		"aaa ccc" 
		"bbb ccc";
	}
}
@media screen and (max-width: 900px) {
	.equWrap [class*="equ-area0"] {
		margin-bottom:3em;
	}
}
@media screen and (max-width: 600px) {
	.equWrap [class*="equ-area0"] {
		margin-bottom:var(--site-marpad-S);
	}
	.equWrap [class*="equ-area0"]  .ttl{
		text-align: center;
	}
}
@media screen and (max-width: 480px) {
	.equWrap .equ-area01 .equItem03 .ttl br {display: block!important;}
}

/* equ-area01
-----------------------------------------*/
	.equWrap .equ-area01{
		margin-top:var(--site-marpad-XL);
	}
@media screen and (min-width: 480.02px) {
	.equWrap .equ-area01 .col2 {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.equWrap .equ-area01 .col2 .txt {
		width: 48%;
	}
	.equWrap .equ-area01 .col2 .pic {
		width: 50%;
	}
	.equWrap .equ-area01 .equItem03 .pic {
		margin-top: 2em;
	}
}
@media screen and (min-width: 480.02px) and (max-width: 900px) {
	.equWrap .equ-area01{
		margin-top:var(--site-marpad-M);
	}
	.equWrap .equ-area01 .col2 {
		align-items: center;
	}
	.equWrap .equ-area01 [class*="equItem0"]  {
		margin-top: 3em;
	}
}
@media screen and (max-width: 480px) {
	.equWrap .equ-area01{
		margin-top:var(--site-marpad-M);
	}
	.equWrap .equ-area01 [class*="equItem0"]  {
		margin-top: 3em;
	}
	.equWrap .equ-area01 [class*="equItem0"] .pic {
		margin-top: 2em;
	}
}




/* equ-area02
-----------------------------------------*/
	.equWrap .equ-area02 .generalColBox {
		 /* --base-generalColBox-margin-row: 60px;*/
		  --base-generalColBox-margin-column: 30px;
	}
	.equWrap .equ-area02 [class*="equItem0"]  {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		align-content: flex-start;
	}
	.equWrap .equ-area02 [class*="equItem0"] .pic {
		order: -1;
		margin-bottom: 1em;
	}



/* qualityBtn
-----------------------------------------*/
.qualityBtn {
	margin-top:var(--site-marpad-XL);
}
.qualityBtn [class*="generalBtnUnit"] {
  font-family: var(--site-font_family-en_1);
  background: #775D42;
}
@media (hover: hover) and (pointer: fine) {
 .qualityBtn p a[href]:where(:hover) {
    background: #A27D57;
  }
}




/* labelBox
-----------------------------------------*/
.labelBox .label{
	max-width: 500px;
}



