@charset "utf-8";

:root {
	--vw: 100vw / 128;.house_option li p {
	font-size: 1.6rem;

}
}

/* !HTML5 elements
---------------------------------------------------------- */
header, footer, nav, section, aside, article
{ display: block;}

/* !Reseting
---------------------------------------------------------- */

body, div, pre, p, blockquote, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, th, td
{ margin: 0; padding: 0;}
input, textarea
{ margin: 0; font-size: 100%;}
label
{ cursor: pointer;}
table
{ border-collapse: collapse; border-spacing: 0; font-size: 100%;}
fieldset, img
{ border: 0;}
img
{ vertical-align: top; max-width: 100%;}
address, caption, cite, code, dfn, em, th, var
{ font-style: normal; font-weight: normal;}
ol, ul
{ list-style: none;}
caption, th
{ text-align: left;}
h1, h2, h3, h4, h5, h6
{ font-size: 100%; font-weight: normal;}
q:after, q:before
{ content:'';}
a, input,select,textarea,button
{ outline: none; }
abbr, acronym
{ border: 0;}



/* !Clearfix
---------------------------------------------------------- */
.clearfix {
	display: block;
	min-height: 1%;
}
.clearfix:after {
	clear: both;
	content:".";
	display: block;
	height: 0;
	visibility: hidden;
}
* html .clearfix {
	height: 1%;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}

/* !Inline Align ------------------------------------------------------------ */
.taL { text-align: left   !important;}
.taC { text-align: center !important;}
.taR { text-align: right  !important;}

/*common*/
a{
	color: inherit;
	text-decoration: none;
	transition: all 0.5s !important;
	-moz-transition: all 0.5s !important; /* Firefox */
	-webkit-transition: all 0.5s !important; /* Chrome&Safari */
}
.op img {
	transition: all 0.5s !important;
	-moz-transition: all 0.5s !important; /* Firefox */
	-webkit-transition: all 0.5s !important; /* Chrome&Safari */
}
.op:hover img {
	opacity: .7;
	-webkit-opacity: .7;
	-moz-opacity: .7;
}

* { 
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

/* !Layout
---------------------------------------------------------- */
html { 
	overflow-y: scroll;
	font-size: 62.5%;
	margin: 0 !important;
}

@media screen and (min-width: 768px) and (max-width: 1280px) {
	html { 
		font-size: calc(var(--vw));
	}
}

/*** sp ***/
@media screen and (max-width: 374px) {
	html {
		font-size: 2.6667vw;
	}
}

body {
	background: #F1F2F1;
	line-height: 2;
	letter-spacing: 0.1em;
	color: #2E312B;
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
	font-size: 1.6rem;
	-webkit-text-size-adjust: none;
}

body.unLoad .wow {
	opacity: 0 !important;
} 

.font_zen_old {
	font-family: "Zen Old Mincho", serif;
}

/*** pc ***/
@media screen and (min-width: 768px) {
	.sp {
		display: none;
	}
}
/*** sp ***/
@media screen and (max-width: 767px) {
	body {
		font-size: 1.4rem;
	}
	
	.pc {
		display: none;
	}
}


#loading {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 3;
	width: 100%;
	height: 100vh;
	background: #fff;
}
.unLoad {
	overflow: hidden;
	height: 100vh;
}


/* !wrapper
---------------------------------------------------------- */
#wrapper {
	position: relative;
	z-index: 2;
	padding: 0 0 55rem;
}


/* !header
---------------------------------------------------------- */
#header {
	display: flex;
	justify-content: space-between;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 99;
	padding: 0 2rem;
	width: 100%;
}

.overlay {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	background: none;
	z-index: 988;
	text-indent: -9999px;
	pointer-events: none;
}

/*** pc ***/
@media screen and (min-width: 768px) {

#headerLinks {
	position: fixed;
	right: 2rem;
	left: 2rem;
	top: 6rem;
	z-index: 9999;
	pointer-events: none;
}


body:not(.menuOpen) #headerLinks {
	mix-blend-mode: difference;
}

#headerLinks .inner {
	display: flex;
	justify-content: flex-end;
	pointer-events: none;
	padding: 0;
	max-width: 128rem;
}

.btnMenu {
	cursor: pointer;
	pointer-events: auto;
	width: 9.2rem;
	height: 9.2rem;
	background: url(../image/icon_menu.svg)no-repeat center;
	background-size: 100%;
}
.btnMenu.active {
	background: url(../image/common/menu_close.svg)no-repeat;
	background-size: 100% auto;
	transition: background-image .1s ease .3s;
}

#gNavi {
	position: fixed;
	top: 0px;
	right: 0;
	width: 100%;
	height: 100vh;
	background: #fff;
	/*background:url(../image/common/bg_nav.jpg)no-repeat right center #fff;
  background-size:cover;*/
	z-index: 9;
	box-sizing: border-box;
	padding: 20rem 0 7rem;
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s, right .3s;
	-ms-overflow-style: none;
	/* IE, Edge 対応 */
	scrollbar-width: none;
	font-family: fot-tsukuardgothic-std, sans-serif;
	letter-spacing: 0;
	font-weight: bold;
	color: #000;
}

#gNavi::-webkit-scrollbar {
	/* Chrome, Safari 対応 */
	display: none;
}

#gNavi.active {
	opacity: 1;
	pointer-events: auto;
	right: 0;
}

#gNavi:before {
	content: '';
	position: fixed;
	left: 0;
	top: 0;
	/*top: 50%;
	transform: translateY(-50%);*/
	width: calc(50% - 66rem + 40rem - 4rem);
	max-width: calc(100% - 88rem - 8rem);
	height: 100vh;
	background: url(../image/common/bg_nav.jpg)no-repeat right center;
	background-size: cover;
}

#gNavi .inner {
	padding: 0 4rem;
	max-width: 132rem;
}

.naviLogo {
	position: absolute;
	left: 0;
	top: 6rem;
	z-index: 999;
	width: 100%;
}

.naviLogo p {
	max-width: 132rem;
	margin: 0 auto;
	padding: 0 2rem;
	width: 80%;
	position: relative;
}

.naviLogo a {
	position: absolute;
	left: 2rem;
	top: 0;
	z-index: 999;
	display: block;
}

.naviLogo img {
	height: 9.2rem;
}

.navRotated {
	/*overflow: hidden;*/
	pointer-events: none;
	position: fixed;
	left: calc(50% + 66rem);
	left: calc(50% + 63rem);
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
	height: 100vh;
	display: flex;
	align-items: center;
}

.navRotated img {
	height: 136rem;
	max-width: none;
	animation: circle 35s linear infinite;
}

@keyframes circle {
	0% {
		transform: rotateX(0deg) rotateZ(0);
	}

	100% {
		transform: rotateX(0deg) rotateZ(360deg);
	}
}

.navCont {
	position: relative;
	z-index: 2;
	float: right;
	width: 100%;
	max-width: 88rem;
	display: flex;
	justify-content: space-between;
}

.navLeft {
	width: calc(50% - 2rem);
}

.navRight {
	width: calc(50% - 2rem);
}

.navUl01 {
	margin-bottom: 1.5rem;
}

.navLeft .navUl02 {
	width: 72%;
}

.navUl01 a {
	display: flex;
	align-items: center;
	height: 6rem;
	font-size: 2rem;
	background: #fff url(../image/common/arrow_nav.svg)no-repeat right 5px center;
	background-size: auto;
	transition: all .2s;
	padding: 0 1.3em;
	border-radius: 6rem;
	color: #000;
}
.navUl01 li+li a {
	border-top: 1px solid #EFEFEF;
}
.navUl01 a:hover {
	background: url(../image/common/arrow_nav_hover.svg)no-repeat right center #fff;
	background-size: auto;
}

.navUl02 a {
	display: block;
	line-height: 1.85;
	padding: 0.5em 1em;
	margin: 0.3em 0;
}

.navUl03 {
	margin-bottom: 1.5rem;
}

.navUl03 li+li {
	border-top: 1px solid #EFEFEF;
}

.navUl03 a {
	display: flex;
	align-items: center;
	height: 6rem;
	font-size: 2rem;
	background: url(../image/common/arrow_nav.svg)no-repeat right 0.5rem center;
	background-size: auto;
}

.navUl03 a:hover {
	background: url(../image/common/arrow_nav_hover.svg)no-repeat right center;
	background-size: auto;
}

.navUl03 a span {
	background-image: -webkit-linear-gradient(right, #E299DE, #A581DD, #4D9AD6, #3CBBD6);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.navTel {
	border: 1px solid #DEE7ED;
	background: #FAFDFF;
	border-radius: 1rem;
	padding: 3rem;
	line-height: 1.5;
}

.navTelHd {
	display: flex;
	justify-content: space-between;
	font-size: 1.2rem;
	line-height: 1.33;
	margin-bottom: 1.2rem;
}

.navTelHd span {
	font-size: 2.2rem;
}

.navTelHd font {
	padding-top: 0.5rem;
}

.navUl04 li+li {
	padding-top: 1.3rem;
	margin-top: 1.3rem;
	border-top: 1px solid #DEE7ED;
}

.navUl04 li a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 1.8rem;
	word-break: keep-all;
	white-space: nowrap;
}
.navUl04 li:nth-child(2) a {
	font-size: 1.6rem;
}
.navUl04 li font {
	display: flex;
	font-size: 2.4rem;
	line-height: 1.33;
	letter-spacing: -0.1em;
	color: #1563AE;
	padding-left: 2.8rem;
	background: url(../image/common/icon_tel02.svg)no-repeat left center;
	background-size: auto;
	word-break: keep-all;
	white-space: nowrap;
}

.navSns {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	margin-top: 3rem;
	font-size: 1.4rem;
	margin-right: -0.5rem;
}

.navSns dt {
	margin-right: 1.5rem;
}

.navSns dd {
	display: flex;
}

.navSns dd a {
	margin: 0 0.5rem;
}

.navSns dd a img {
	width: 3.2rem;
}

}
@media screen and (max-width: 1680px) {
	.navCont {
		max-width: 100%;
		padding-left: calc(80vw - 86rem);
	}
}
/*** sp ***/
@media screen and (max-width: 767px) {
#headerLinks {
    position: fixed;
    right: 2rem;
    top: 1.3rem;
    z-index: 9999;
    pointer-events: none;
}
body:not(.menuOpen) #headerLinks {
	mix-blend-mode: difference;
}
#headerLinks .inner {
    padding: 0;
}

.btnMenu {
    pointer-events: auto;
	cursor: pointer;
	width: 5.5rem;
	height: 5.5rem;
	background: url(../image/icon_menu.svg)no-repeat center;
	background-size: 100%;
}
.btnMenu.active {
	top: 1rem;
	background: url(../image/common/menu_close_sp.svg) center top no-repeat;
	background-size: 100% auto;
	transition: background-image .1s ease .3s;
}


#gNavi {
	position: fixed;
	top: 0;
	right: 0;
	width: 100%;
	height: 100vh;
	background: #fff;
	z-index: 9;
	box-sizing: border-box;
	padding: 8rem 0 0;
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s, right .3s;
	font-family: fot-tsukuardgothic-std, sans-serif;
	letter-spacing: 0;
	font-weight: bold;
	color: #000;
}

#gNavi.active {
	opacity: 1;
	pointer-events: auto;
	right: 0;
}

.naviLogo {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	top: 1.3rem;
	z-index: 2;
}

.naviLogo img {
	height: 6.6rem;
}

.navRotated {
	pointer-events: none;
	position: fixed;
	left: calc(100% - 24rem);
	left: calc(50% + 66rem);
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
	height: 100vh;
	display: flex;
	align-items: center;
	display: none !important;
}

.navRotated img {
	height: 136rem;
	max-width: none;
	animation: circle 35s linear infinite;
}

@keyframes circle {
	0% {
		transform: rotateX(0deg) rotateZ(0);
	}

	100% {
		transform: rotateX(0deg) rotateZ(360deg);
	}
}

.navCont {
	position: relative;
	z-index: 2;
}

.navLeft {
	margin-bottom: 2rem;
}

.navRight {
	margin: 0 -2rem;
	padding: 1.5rem 2rem 15rem;
	background-image: linear-gradient(135deg, #E299DE, #A581DD, #4D9AD6, #3CBBD6);
}

.navUl01 {
	margin-bottom: 2rem;
}

.navUl01 li {
	border-bottom: 1px solid #EFEFEF;
}

.navUl01 a {
	display: flex;
	align-items: center;
	height: 5.5rem;
	font-size: 1.8rem;
	background: url(../image/common/arrow_nav.svg)no-repeat right center;
	background-size: 2.2rem auto;
	color: #000;
}

.navUl02 a {
	display: block;
	font-size: 1.4rem;
	line-height: 1.71;
	padding: 0.5em 0;
	color: #000;
}

.navUl03 {}

.navUl03 li {
	margin-bottom: 0.9rem;
}

.navUl03 a {
	display: flex;
	align-items: center;
	height: 5rem;
	font-size: 2rem;
	padding: 0 3rem;
	background: url(../image/common/arrow_nav.svg)no-repeat right 3rem center #fff;
	background-size: 2.2rem auto;
	border-radius: 1rem;
}

.navTel {
	background: #fff;
	border-radius: 1rem;
	padding: 1rem 3rem 1.5rem;
}

.navTelHd {
	display: flex;
	justify-content: space-between;
	font-size: 1.1rem;
	line-height: 1.36;
	margin-bottom: 0.3rem;
}

.navTelHd span {
	font-size: 2rem;
}

.navTelHd font {
	padding-top: 0.5rem;
}

.navUl04 li+li {
	padding-top: 0.6rem;
	margin-top: 0.6rem;
	border-top: 1px solid #000000;
}

.navUl04 li a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 1.5rem;
}

.navUl04 li font {
	display: flex; 
	font-size: 2rem;
	line-height: 1.25;
	letter-spacing: -0.08em;
	color: #1563AE;
	padding-left: 1.9rem;
	background: url(../image/common/icon_tel02.svg)no-repeat left center;
	background-size: 1.65rem auto;
}

.navSns {
	margin: 3.8rem 0 1.9rem;
	font-size: 1.4rem;
}

.navSns dt {
	text-align: center;
	margin-bottom: 0.5rem;
	color: #fff;
}

.navSns dd {
	display: flex;
	justify-content: center;
}

.navSns dd a {
	margin: 0 0.5rem;
}

.navSns dd a img {
	width: 3.2rem;
}

.navClose {
	text-align: center;
}

.navClose img {
	width: 18rem;
	cursor: pointer;
}

#gNavi .clearfix:after {
	content: none;
}

}

.headlinks {
	position: fixed;
	right: 1rem;
	top: 20rem;
	opacity: 0;
}
.headlinks a {
	display: block;
	margin-bottom: 2.5rem;
	padding: 5.4rem 1rem 2.8rem;
	background-position: center 2.4rem;
	background-size: 1.8rem;
	writing-mode: tb-rl;
	writing-mode: vertical-rl; 
	line-height: 3.2rem;
	letter-spacing: 0.3em;
	font-weight: 500;
}

.btn_information {
	display: block;
	position: relative;
	background-repeat: no-repeat;
	border: 1px solid transparent;
	color: #fff;
}
.icon_request {
	background-color: #969F8C;
	background-image: url(../image/icon_book_wh.svg);
	border-color: #969F8C;
}
.icon_product {
	background-color: #7D8B95;
	background-image: url(../image/icon_house_wh.svg);
	border-color: #7D8B95;
}


/*** hover ***/
@media screen and (min-width: 768px) {
	.icon_request:hover {
		background-color: #fff;
		background-image: url(../image/icon_book_graygre.svg);
		color: #969F8C;
	}
	.icon_product:hover {
		background-color: #fff;
		background-image: url(../image/icon_house_grayblue.svg);
		color: #7D8B95;
	}
	
}
/*** sp ***/
@media screen and (max-width: 767px) {
	.headlinks {
		display: flex;
		justify-content: space-between;
		right: 0;
		top: auto;
		bottom: 0;
		padding: 0 1.4rem;
		width: 100%;
	}
	.headlinks a {
	    display: flex;
		align-items: center;
	    margin-bottom: 0;
	    padding: 1rem 3.6rem 1rem 5.8rem;
		height: 5.4rem;
	    background-position: left 3rem center;
	    writing-mode: tb-lr;
	    writing-mode: horizontal-tb; 
	    line-height: 1;
	    letter-spacing: 0.1em;
		font-size: 1.5rem;
	}
}

/* footer
-----------------------------------------------------------*/
.footer {
	overflow: hidden;
	position: fixed;
	left: 0;
    bottom: 0;
    width: 100%;
    z-index: -1;
} 

.footer .footer_container {
	position: relative;
	padding: 15rem 0 5rem;
	background: url(../image/bg_footer.jpg)no-repeat center;
	background-size: cover;
    line-height: 1;
	color: #fff;
}
.footer .foot_info {
	text-align: center;
}
.footer .logo {
	margin: 4.8rem 0;
}
.footer .logo img {
	width: 18.2rem;
}
.footer .head {
    font-size: 2rem;
    font-weight: 600;
}
.footer .head2 {
    letter-spacing: 0.05em;
    font-size: 2.4rem;
    font-weight: 600;
}
#copyright {
	margin-top: 8rem;
	text-align: right;
	font-size: 1.3rem;
    font-weight: 600;
}

/*** sp ***/
@media screen and (max-width: 767px) {
	.footer {
		max-height: 46rem;
	}
	
	.footer .footer_container {
		padding: 12rem 0 16rem;
	}
	.footer .head {
	    font-size: 1.8rem;
	}
	.footer .head2 {
	    font-size: 1.6rem;
	}
	.footer .logo {
		margin: 3.2rem 0;
	}
	.footer .logo img {
	    width: 12.5rem;
	}
	#copyright {
		white-space: nowrap;
		word-wrap: break-word;
		word-break:break-all;
	    text-align: center;
	    font-size: 1.2rem;
	}
	
}


/* !common
---------------------------------------------------------- */
#content {
	position: relative;
	z-index: 2;
	background: #F1F2F1;
}

.mainVisual {
	position: relative;
	background: #fff;
}

.kv_bigimg {
	overflow: hidden;
	position: relative;
	height: 100vh;
}
.kv_bigimg .swiper-slide img {
	object-fit: cover;
	width: 100%;
	height: 100%;
	transition: 1s linear 2s;
}
.kv_bigimg .swiper-slide-active img,
.kv_bigimg .swiper-slide-duplicate-active img {
	transition: 7s linear;
	transform: scale(1.1,1.1);
}	
.kv_swiper .thumb-wrapper {
	display: flex;
	gap: 0 1.6rem;
	position: absolute;
	left: 3rem;
	bottom: 2rem;
	z-index: 9;
}
.kv_swiper .thumb-media {
	cursor: pointer;
	position: relative;
	width: 14rem;
	border: 1px solid transparent;
}
.kv_swiper .thumb-media:before {
	content: "";
	pointer-events: none;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0.3);
}
.kv_swiper .thumb-media-active {
	border-color: #fff;
}
.kv_swiper .thumb-media-active:before {
	background: rgba(255,255,255,0);
}

.mainVisual .main_info {
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 9;
	transform: translate(-50%, -50%);
	text-align: center;
	color: #fff;
}
.mainVisual .main_info .head {
	opacity: 0;
	line-height: 1;
	font-size: 2rem;
	font-weight: 600;
}
.mainVisual .main_info .logo {
	opacity: 0;
	margin: 5.2rem 0;
}
.mainVisual .main_info .logo img {
	width: 19rem;
}
.mainVisual .main_info .head2 {
	opacity: 0;
	line-height: 1;
	letter-spacing: 0.05em;
	font-size: 2.4rem;
	font-weight: 600;
}

.mainVisual .scroll {
	opacity: 0;
	position: absolute;
	left: 50%;
	bottom: -7.3rem;
	z-index: 10;
	border-left: 1px solid;
	writing-mode: tb-rl;
	writing-mode: vertical-rl; 
	line-height: 1;
	color: #fff;
}
.mainVisual .scroll a {
	display: block;
	padding: 1rem 1rem 13.5rem;
}
.mainVisual .scroll:before {
	content: "";
	position: absolute;
	left: -2px;
	top: 0;
    transform-origin: 50% 0;
	animation: scrollmove 2s infinite;
	width: 3px;
	height: 100%;
	background: #fff;
	border-radius: 1rem;
}
@keyframes scrollmove {
  0% {
    transform: scale(1, 0);
  }
  50% {
    transform: scale(1, 1);
  }
  51% {
    transform: scale(1, 1);
  }
  100% {
    transform: scale(1, 1);
  }
}

.inner {
	margin: 0 auto;
	padding: 0 9rem;
	max-width: 162rem;
}

.head_large {
	line-height: 1.9;
	font-size: 2.8rem;
	font-weight: 600;
}
.concept_inner .side .head_large {
	line-height: 2.4;
}
.head_large p + p {
	margin-top: 5rem;
}
.head_large .eng {
	display: flex;
	align-items: center;
	gap: 0 4rem;
}
.head_large .eng:after {
	content: "";
	display: block;
	width: 13.3rem;
	border-top: 1px solid;
}

.mt50 {
	margin-top: 5rem;
}
.mt150 {
	margin-top: 15rem;
}

.smoother_container {
	position: relative;
	overflow: hidden;
}
.smoother_container .container {
	object-fit: cover;
	object-position: center;
	position: absolute;
	top: 0;
	transform: translateY(15%);
	height: 115%;
	width: 100%;
}

.btn_link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	padding: 0 2.2rem 0 1rem;
	width: 100%;
	color: #fff;
}
.btn_link:after {
	content: "";
	position: absolute;
	right: 4rem;
	top: 50%;
	transform: translateY(-50%);
	transition-duration: 0.3s;
	width: 2.7rem;
	height: 2.7rem;
	background: url(../image/icon_link.svg)no-repeat center #F1F2F1;
	background-size: 1.1rem;
	border-radius: 50%;
}

/*** hover ***/
@media screen and (min-width: 768px) {
	.btn_link:hover:after {
		background-image: url(../image/icon_link_wh.svg);
	}
}
@media screen and (max-width: 1440px) {
	.head_large .tl br {
		display: none;
	}
}
/*** sp ***/
@media screen and (max-width: 767px) {
	.kv_bigimg {
		height: 66.8rem;
	}

	.kv_swiper .thumb-wrapper {
		display: none;
	}
	
	.mainVisual .main_info .head {
		font-size: 1.6rem;
	}
	.mainVisual .main_info .logo {
	    margin: 3.2rem 0;
	}
	.mainVisual .main_info .logo img {
	    width: 23rem;
	}
	.mainVisual .main_info .head2 {
		font-size: 1.6rem;
	}
	.mainVisual .scroll {
	    left: auto;
		right: 0;
	    bottom: 7.7rem;
		font-size: 0;
	}
	.mainVisual .scroll a {
	    padding: 1rem;
		height: 12rem;
	}
	
	.head_large {
		font-size: 2rem !important;
	}
	.head_large p + p {
	    margin-top: 3rem;
	}
	.head_large .eng {
		gap: 0 3.6rem;
	}
	.mt150 {
		margin-top: 8rem;
	}
	
	.btn_link {
		padding: 0 1.4rem 0 1rem;
	}
	.btn_link:after {
	    right: 2.5rem;
	    width: 2.1rem;
	    height: 2.1rem;
	    background-size: 0.9rem;
	}
	
	.inner {
		padding: 0 2rem;
	}
}


/* !page
---------------------------------------------------------- */
.top_concept {
	position: relative;
	z-index: 2;
	padding: 30rem 2rem 48rem;
	color: #fff;
}
.top_concept .bg {
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
}
.concept_inner {
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
	max-width: 126rem;
	padding: 0 9rem;
}
.concept_inner .side {
	width: 50rem;
}
.concept_inner .info {
	margin-top: 12.6rem;
	width: 50rem;
}
.concept_inner .info .head_large {
	margin-bottom: 4.5rem;
}
.concept_inner .info p {
	margin-bottom: 2.4rem;
	line-height: 2.4;
}

.js-image-scroll {
	overflow: hidden;
	display: flex;
}
.js-image-scroll ul {
	display: flex;
}
.js-image-scroll ul:nth-child(odd) {
	animation-name: image-loop-left1;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.js-image-scroll ul:nth-child(even) {
    animation-name: image-loop-left2;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
@keyframes image-loop-left1 {
	0% {
	    transform: translateX(100%);
	}
	100% {
	    transform: translateX(-100%);
	}
}
@keyframes image-loop-left2 {
	0% {
	    transform: translateX(0);
	}
	100% {
	    transform: translateX(-200%);
	}
}
.house_swiper {
	transform: translateY(calc(-50% - 3.35rem));
	margin-bottom: -14.2rem;
}
.house_swiper li {
    overflow: hidden;
    padding-right: 5.4rem;
    width: 41.7rem;
}
.house_swiper li:nth-of-type(even) {
	margin-top: 6.7rem;
}
.house_swiper li img {
	object-fit: cover;
    width: 100%;
    height: 45rem;
}

.design_rules {
	padding: 0 0 15rem;
	position: relative;
	z-index: 3;
}
.design_rules .title {
	margin-bottom: 10rem;
}
.design_rules .title .head_large {
	margin-bottom: 5rem;
}
.design_rules .title .head_small {
	text-align: center;
}
.design_rules .design_rules_anchors .head {
	margin-bottom: 5rem;
	text-align: center;
	font-size: 2.5rem;
	font-weight: 600;
}
.design_rules .design_rules_anchors .head:after {
	content: "";
	display: block;
	margin: 4rem auto 0;
	width: 5.2rem;
	border-bottom: 1px solid #2E312B;
}
.design_rules .design_rules_anchors ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 3.2rem 4rem;
}
.design_rules .design_rules_anchors li {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: 3rem 1rem;
	width: 30%;
	max-width: 40.7rem;
	background: #E6E9E6;
	line-height: 2;
	text-align: center;
	font-size: 1.7rem;
}
.design_rules .design_rules_anchors .step {
	position: relative;
	padding-right: 4.5rem;
	margin-top: 0.6rem;
	letter-spacing: 0;
	line-height: 1;
	font-size: 2.5rem;
	font-weight: 600;
}
.design_rules .design_rules_anchors .step:after {
	content: "";
	position: absolute;
	right: 2.4rem;
	top: 50%;
	transform-origin: 50% 50%;
	transform: skewX(-30deg) translateY(-50%);
	height: 1.8rem;
	border-right: 1px solid;
}

/*@media screen and (min-width: 768px) and (max-width: 1279px) {
	.design_rules .design_rules_anchors ul {
		gap: calc(var(--vw) * 3.2) calc(var(--vw) * 4);
	}
	.design_rules .design_rules_anchors li {
		padding: calc(var(--vw) * 3) calc(var(--vw) * 1);
		max-width: calc(var(--vw) * 40.7);
		font-size: calc(var(--vw) * 2);
	}
	.design_rules .design_rules_anchors .step {
		padding-right: calc(var(--vw) * 4.5);
		margin-top: calc(var(--vw) * .6);
		font-size: calc(var(--vw) * 2.5);
	}
	.design_rules .design_rules_anchors .step:after {
		right: calc(var(--vw) * 2.4);
		height: calc(var(--vw) * 1.8);
	}
}*/

.kv_banner {
	height: 65rem;
	font-size: 0;
}
.kv_banner img {
	object-fit: cover;
	width: 100%;
}

.house_introd {
	padding: 15.04rem 0 22rem;
}
.house_title {
	margin-bottom: 15rem;
}
.house_title .head_large {
	margin-bottom: 2.5rem;
	font-size: 4rem;
}

.house_content {
	display: flex;
	justify-content: space-between;
}
.house_content .side {
	position: relative;
	width: 34%;
	max-width: 45.6rem;
}
.house_content .side_con {
	position: sticky;
	top: 2rem;
}
.house_content .side_con p+p {
	margin: 1em 0;
}
.house_content .main {
	overflow: hidden;
	padding-top: 4.3rem;
	width: 62%;
	max-width: 88.6rem;
}
.house_content .side .head_large {
	margin-bottom: 4.8rem;
}

.toggleBtn {
	cursor: pointer;
}
.toggleBox {
	/*display: none;*/
}

.house_introd_item {
	border-bottom: 1px solid #D1D3CF;
}

.house_introd_btn {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	padding: 5rem 0;
}
.house_introd_btn .display {
	display: flex;
	align-items: center;
	gap: 0 4rem;
}
.house_introd_btn .display .img {
	overflow: hidden;
	width: 18.4rem;
	height: 9.6rem;
}
.house_introd_btn .display .img img {
	object-fit: cover;
	transition-duration: 0.5s;
	width: 100%;
	height: 100%;
}
.house_introd_btn .display .country {
	font-weight: 600;
	font-size: 2rem;
}
.house_introd_btn .display .country .pre {
	margin-right: 2rem;
	font-size: 2.5rem;
}
.house_introd_btn .more {
	padding: 1rem 6rem 1rem 0;
	background: url(../image/icon_plus.svg)no-repeat right center;
	background-size: 4.3rem;
}
.house_introd_btn.open .more {
	background-image: url(../image/icon_minus.svg);
}

.house_introd_detail li {
	padding: 6rem 0;
}
.house_introd_detail li:first-child {
	padding-top: 1rem;
}
.house_introd_detail li + li {
	border-top: 1px dashed #2E312B;
}
.house_introd_detail .head_large {
	margin-bottom: 3rem;
	font-size: 2rem;
}
.house_introd_detail .title {
	display: flex;
	justify-content: space-between;
	margin-bottom: 5rem;
	gap: 2rem;
}
.house_introd_detail .title .head_large {
	word-break: keep-all;
}
.house_introd_detail .title h3 {
	font-size: 2.3rem;
	padding-right: 5%;

}
.house_introd_detail .title .txt {
	/*flex-grow: 1;*/
}
.house_introd_detail .title .txt p + p {
	margin-top: 3.2rem;
}
.house_introd_detail .img {
	aspect-ratio: 443 / 295;
	font-size: 0;
}
.short-image .house_introd_detail .img {
	aspect-ratio: 443 / 249;
}
.house_introd_detail .movie {
	position: relative;
	padding-top: 52.144%;
}
.house_introd_detail .movie iframe {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.house_introd_swiper {
	overflow: hidden;
	position: relative;
	padding-bottom: 2.6rem;
}
.house_introd_swiper .swiper-slide {
	max-width: 48rem;
}
.house_introd_swiper .swiper-button-next:after,
.house_introd_swiper .swiper-button-prev:after {
	display: none;
}
.house_introd_swiper .swiper-button-next,
.house_introd_swiper .swiper-button-prev {
	width: 3rem;
	height: 3rem;
	background: no-repeat center;
	background-size: 100%;
}
.house_introd_swiper .swiper-button-next {
	right: calc(50% - 26rem);
	background-image: url(../image/icon_next.svg);
}
.house_introd_swiper .swiper-button-prev {
	left: calc(50% - 26rem);
	background-image: url(../image/icon_prev.svg);
}
.house_introd_swiper .swiper-pagination {
	bottom: 0;
}
.house_introd_swiper .swiper-pagination-bullet {
	opacity: 1;
	width: 0.6rem;
	height: 0.6rem;
	background: #D9D9D9;
}
.house_introd_swiper .swiper-pagination-bullet-active {
	background: #6E6E6E;
}

.house_introd .floor .data {
	margin-top: 3rem;
	text-align: right;
}
.house_introd .floor .data span br {
	display: none;
}
.house_introd .online_view {
	margin-top: 6rem;
}
.house_introd .online_view .img {
	height: auto;
}
.house_introd .online_view .btn {
	margin-top: 3rem;
	text-align: center;
}
.house_introd .online_view .btn_link {
	max-width: 42rem;
	height: 6.7rem;
	background: #2E312B;
	border: 1px solid #2E312B;
	text-align: center;
}

.house_option {
	padding: 10rem 14rem 14rem;
	background: #E6E9E6;
}

@media screen and (max-width: 1280px) {
	.house_option {
		padding: 10rem 9rem 14rem;
	}
}


.house_option .title {
	display: flex;
	justify-content: space-between;
	margin-bottom: 7rem;
	gap: 2rem;
}
.house_option .title .head_large {
    width: 36%;
}
.house_option .title .txt {
    width: 63%;
}
.house_option ul {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4rem;
}
.house_option li .img {
	margin-bottom: 4rem;
	aspect-ratio: 180 / 237;
}
.house_option li .head_large {
	margin-bottom: 2rem;
	font-size: 2.3rem;
}
.house_option li p {
	font-size: 1.6rem;

}
.founder_wrap {
	position: relative;
	z-index: 2;
	padding: 13rem 9rem;
	color: #fff;
}
.founder_inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 auto;
	max-width: 130.8rem;
}
.founder_wrap .bg {
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
}
.founder_wrap .bg:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
}
.founder_inner {
	display: flex;
	justify-content: space-between;
}
.founder_introd {
	display: flex;
	width: 50%;
	max-width: 64rem;
}
.founder_introd .head {
	margin-right: 1.6rem;
	border: 1px solid;
	writing-mode: tb-rl;
	writing-mode: vertical-rl;
	text-align: center;
	line-height: 3.8rem;
	letter-spacing: 1em;
	font-size: 2.4rem;
	font-weight: 400
}
.founder_introd .name {
	margin-right: 0.5rem;
	writing-mode: tb-lr;
	writing-mode: vertical-lr;
	letter-spacing: 0.3em;
	font-size: 3rem;
	font-weight: 600;
}
.founder_introd .name span + span:before {
	content: "×";
	line-height: 1;
	font-size: 4rem;
	font-weight: 300;
}
.founder_wrap .founder {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 90%;
}
.founder_wrap .founder .tit {
	margin-bottom: 1rem;
}
.founder_info {
	width: 39%;
	max-width: 51rem;
}
.founder_info .head_large {
	margin-bottom: 3rem;
}
.founder_info p + p {
	margin-top: 5.6rem;
}

.contact_wrap {
	padding: 8rem 0 10rem;
}
.contact_wrap .head_large {
	margin-bottom: 6.8rem;
	text-align: center;
	font-size: 2rem;
}
.contact_wrap .btns {
	display: flex;
	justify-content: center;
	gap: 5rem;
}
.contact_wrap .btn_link {
	justify-content: flex-start;
	padding: 0 8.4rem 0 11.7rem;
	max-width: 58.8rem;
	height: 10.8rem;
	background-position: left 5.7rem center;
	background-size: 2.8rem;
	font-size: 2.2rem;
}
.contact_wrap .btn_link:after {
	right: 5.7rem;
}


/*** hover ***/
@media screen and (min-width: 768px) {
	.house_introd .online_view .btn_link:hover {
		background-color: transparent;
		color: #2E312B;
	}
	.house_introd .online_view .btn_link:hover:after {
		background-color: #2E312B;
	}
	
	.house_introd_btn:after {
		content: "";
		position: absolute;
		left: 0;
		bottom: -1px;
		width: 0%;
		transition-duration: 0.3s;
		border-bottom: 1px solid #2E312B;
	}
	.house_introd_btn:hover:after {
		width: 100%;
	}
	.house_introd_btn.open:hover:after {
		width: 0;
	}
	.house_introd_btn:hover .display .img img {
		transform: scale(1.1,1.1);
	}
	
	.contact_wrap .icon_request:hover:after {
		background-color: #969F8C;
	}
	.contact_wrap .icon_product:hover:after {
		background-color: #7D8B95;
	}
	
}
/*** sp ***/
@media screen and (max-width: 767px) {
	.top_concept {
	    padding: 14rem 3rem 22rem;
	}
	.concept_inner {
	    display: block;
	    padding: 0;
	}
	.concept_inner .side {
	    width: auto;
	}
	.concept_inner .info {
	    margin-top: 10rem;
	    width: auto;
	}
	.concept_inner .info .head_large {
	    margin-bottom: 4rem;
	}
	
	.house_swiper {
	    transform: translateY(calc(-50% - 1.5rem));
	    margin-bottom: -4rem;
	}
	.house_swiper li {
	    padding-right: 1.2rem;
	    width: 13.6rem;
	}
	.house_swiper li:nth-of-type(even) {
	    margin-top: 2.3rem;
	}
	.house_swiper li img {
	    height: 15.4rem;
	}
	
	.design_rules {
	    padding: 0 0 8rem;
	}
	.design_rules .title {
	    margin-bottom: 5rem;
	}
	.design_rules .title .head_large {
	    margin-bottom: 4rem;
	}
	.design_rules .title .head_small {
	    text-align: left;
	}
	.design_rules .design_rules_anchors .head {
	    margin-bottom: 4rem;
	    font-size: 2rem;
	}
	.design_rules .design_rules_anchors .head:after {
	    margin-top: 3rem;
	}
	.design_rules .design_rules_anchors ul {
	    display: flex;
	    flex-wrap: wrap;
	    gap: 2rem 0;
	}
	.design_rules .design_rules_anchors li {
		justify-content: flex-start;
	    padding: 2.6rem 3rem;
	    width: 100%;
	    max-width: 100%;
		text-align: left;
	    font-size: 1.5rem;
	}
	.design_rules .design_rules_anchors .step {
	    padding-right: 4.5rem;
	    margin-top: 0.9rem;
	    font-size: 2rem;
	}
	.design_rules .design_rules_anchors .step:after {
	    right: 2.6rem;
	    height: 1.6rem;
	}
	
	.kv_banner {
		height: 45.8rem;
	}
	
	.house_introd {
	    padding: 8rem 0;
	}
	.house_title {
	    margin-bottom: 6rem;
	}
	.house_title .head_large {
	    margin-bottom: 2rem;
	    font-size: 2.5rem;
	}
	
	.house_content {
	    display: block;
	}
	.house_content .side {
		margin: 0 auto;
	    width: auto;
		max-width: inherit;
	}
	.house_content .main {
	    padding-top: 2.5rem;
	    width: auto;
	}
	
	.house_content .side .head_large {
	    margin-bottom: 3rem;
	}
	.head_large .tl br {
		display: block;
	}
	.house_introd_item {
	    padding: 4rem 0;
	    border-color: #2E312B;
	}

	.house_introd_btn {
		padding: 0;
	}

	.house_introd_btn .display .country .pre {
		display: block;
	    margin-right: 0;
	    font-size: 1.8rem;
	}
	.house_introd_btn .display {
	    gap: 0 2rem;
	}
	.house_introd_btn .display .img {
	    width: 9.9rem;
	    height: 6.6rem;
	}

	.house_introd_btn .display .country {
	    font-size: 1.4rem;
	}
	.house_introd_btn .more {
	    padding: 0;
		width: 2.7rem;
		height: 2.7rem;
	    background-size: 100%;
	    font-size: 0;
	}
	.house_introd_detail li {
	    padding: 3rem 0 !important;
	}
	.house_introd_detail .title {
	    display: block;
	    margin-bottom: 3.2rem;
	}
	.house_introd_detail .title .head_large {
		width: auto;
		font-size: 1.8rem;
	}.house_introd_detail .title h3 {
		font-size: 1.8rem;
		padding-right: 0;
	}
	.house_introd_detail .title .txt {
		width: auto;
	}

	.house_introd_swiper .swiper-slide {
	    max-width: 25rem;
	}
	.house_introd_swiper .swiper-slide img {
		object-fit: cover;
		width: 100%;
		height: 22rem;
	}
	.house_introd_swiper .swiper-button-next, 
	.house_introd_swiper .swiper-button-prev {
	    width: 2.5rem;
	    height: 2.5rem;
	}
	.house_introd_swiper .swiper-button-prev {
	    left: calc(50% - 14.2rem);
	}
	.house_introd_swiper .swiper-button-next {
	    right: calc(50% - 14.2rem);
	}
	.house_introd .floor .data {
	    margin-top: 1.2rem;
	    text-align: center;
	}
	.house_introd .floor .data span {
		display: block;
		margin-bottom: 0.3em;
	}
	.house_introd .floor .data span br {
		display: block;
	}
	.house_introd .online_view .btn_link {
		height: 4.5rem;
	}
	
	.house_option {
	    padding: 6rem 2rem;
		margin-left: -2rem;
		margin-right: -2rem;
	}
	.house_option .title {
	    display: block;
	    margin-bottom: 5rem;
	}
	.house_option .title .head_large {
		margin-bottom: 3rem;
	    width: auto;
	}
	.house_option .title .txt {
		width: auto;
	}
	.house_option ul {
		grid-template-columns: repeat(1, 1fr);
	}
	.house_option li .img {
		max-width: 80%;
	    margin: 0 auto 3rem;
	}
	.house_option li .head_large {
	    font-size: 1.8rem !important;
	    margin-bottom: 1rem;
	}
	.house_option li p {
		font-size: 1rem;
	}
	.founder_wrap {
	    padding: 9rem 2rem;
	}
	.founder_inner {
	    display: block;
	}
	.founder_introd {
	    display: block;
	    width: auto;
	    max-width: 100%;
	}
	.founder_info {
	    width: auto;
	    max-width: 100%;
	}
	.founder_introd .head {
	    margin: 0 auto 2.2rem;
		padding: 0.6rem;
		max-width: 25rem;    
		writing-mode: horizontal-tb; 
	    line-height: 1;
	    letter-spacing: 0.2em;
	    font-size: 1.8rem;
	}
	.founder_introd .name {
		display: flex;
		align-items: center;
		justify-content: center;
	    margin: 0 0 4rem;
		writing-mode: horizontal-tb; 
	    letter-spacing: 0.1em;
		text-align: center;
	    font-size: 2.4rem;
	}
	.founder_introd .name span {
		display: inline-flex;
		align-items: center;
	}
	.founder_introd .name span + span:before {
		margin: 0 1.8rem;
	    font-size: 4rem;
	}
	.founder_info .head_large {
	    margin-bottom: 2rem;
		text-align: center;
	}
	.founder_info .head_small {
		text-align: center;
	}
	.founder_info p + p {
	    margin-top: 4rem;
	}
	.founder_wrap .founder {
		gap: 4rem 0;
		margin-top: 5rem;
		padding: 4rem 2.4rem;
		border: 1px solid;
	}
	
	.contact_wrap {
	    padding: 4rem 0;
	}
	.contact_wrap .head_large {
	    margin-bottom: 4rem;
	    text-align: left;
	    font-size: 1.4rem !important;
	}
	.contact_wrap .btns {
	    display: flex;
		flex-direction: column;
	    gap: 3rem;
	}
	.contact_wrap .btn_link {
	    padding: 0 6.6rem;
	    max-width: 100%;
	    height: 8.5rem;
	    background-position: left 3rem center;
	    background-size: 2.6rem;
	    font-size: 1.5rem;
	}
	.contact_wrap .btn_link:after {
		right: 3rem;
		width: 2.6rem;
		height: 2.6rem;
	}
	.house_introd_detail .head_large.mb {
		margin-bottom: 1.3rem;
	}
	
	
	
	
	
}