@charset "utf-8";
/*free*/
/*google fonts*/
@font-face {
	font-family: Noto Sans JP;
	font-weight: 300;
	src: url(fonts/NotoSansJP-Light.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Noto Sans JP;
	font-weight: 400;
	src: url(fonts/NotoSansJP-Regular.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Noto Sans JP;
	font-weight: 500;
	src: url(fonts/NotoSansJP-Medium.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Noto Sans JP;
	font-weight: 700;
	src: url(fonts/NotoSansJP-Bold.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: DMSerifDisplay;
	font-weight: 400;
	src: url(fonts/DMSerifDisplay-Regular.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Montserrat;
	font-weight: 400;
	src: url(fonts/Montserrat-Regular.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Montserrat;
	font-weight: 600;
	src: url(fonts/Montserrat-SemiBold.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: Jaapokkisubtract;
	font-weight: 500;
	src: url(fonts/Jaapokkisubtract-Regular.otf) format('opentype');
	font-display: swap
}
@font-face {
	font-family: Bebas Neue;
	font-weight: 400;
	src: url(fonts/BebasNeue-Regular.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: BodoniModa;
	font-weight: 600;
	src: url(fonts/BodoniModa_9pt-Bold.ttf) format('truetype');
	font-display: swap
}

#share_v2-btn div.share_v2-link,
.floatingbtn_item a.btn-contact {
	background-color: #898989;
	font-family: 'Noto Sans JP', serif ;
}
#share_v2-btn div.share_v2-link .btn-area a {
	color: #898989;
	font-family: 'Noto Sans JP', serif ;
}

/*paid no use but img*/
/*****************/
/*Adobe Fonts*
@font-face {
	font-family: MenoBanner;
	font-weight: 400;
	src: url(fonts/meno-banner-bold.otf) format('opentype');
	font-display: swap
}
/*fontworks*
@font-face {
	font-family: Impact;
	font-weight: 500;
	src: url(fonts/Impact.ttf) format('truetype');
	font-display: swap
}
/*loremipsum*
@font-face {
	font-family: Post Scriptum;
	font-weight: 400;
	src: url(fonts/PostScriptum_Light.ttf) format('truetype');
	font-display: swap
}
/*Lineto*
@font-face {
	font-family: Akkurat;
	font-weight: 600;
	src: url(fonts/Akkurat-Bold.ttf) format('truetype');
	font-display: swap
}

/*unknown*/
/*****************
@font-face {
	font-family: MonaLisaSolidITCTT;
	font-weight: 400;
	src: url(fonts/Mona_Lisa_ITC_TT.ttf) format('truetype');
	font-display: swap
}
@font-face {
	font-family: RunicMT;
	font-weight: 400;
	src: url(fonts/runiccn.ttf) format('truetype');
	font-display: swap
}
/*
@font-face {
	font-family: ;
	font-weight: ;
	src: url(fonts/.ttf) format('truetype');
	font-display: swap
}
*/
article img, section img, img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
}
.flex {
	display: flex;
}
.flex_cnt {
	display: flex;
	justify-content: center;
}
header,
.fixed header{transition:all 0.4s;}
.fixed header {
	top: -60px;
}

@media screen and (min-width:641px) {
	.sp,
	img.sp {
		display: none;
	}
	.fixed header {
		transition-delay: .3s;
	}
}
@media screen and (max-width:640px) {
	.pc,
	img.pc {
		display: none;
	}
	#mainWrap {
		padding-top: 54px;
	}
}

/*cnt navi*/
@media screen and (min-width: 1081px) {
}

.hqnv_ul {
	display: flex;
}
.hqnv_ul a {
	font-family: 'Montserrat', serif;
	font-weight: 400;
	text-align: center;
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all .3s;
}
.hqnv_ul li.nav_hq a {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	width: 100%;
}
.fixed #hq_nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 10;
}
@media screen and (min-width:641px) {
	#HQnav .menuBtn,
	.logo_hq_sp,
	.nav_sp {display: none;}

	#hq_nav {
		display: flex;
		align-items: stretch;
		border-bottom: 1px solid #898989;
		background-color: #fff;
	}
	#hq_nav .h1_nav_hq {
		width: min(3.472222222222222vw, 100px);
	}
	#hq_nav .h1_nav_hq .logo_pth {
		width: min(2.152777777777778vw, 62px);
		height: auto;
		fill:#898989;
	}
	#hq_nav .h1_nav_hq a {
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #fff;
		height: 100%;
		width: 100%;
		position: relative;
	}
	main[data-active="hq"] #hq_nav .h1_nav_hq a,
	#hq_nav .h1_nav_hq a:hover {
		background-color: #898989;
	}
	#hq_nav .h1_nav_hq a:hover .logo_pth,
	main[data-active="hq"] #hq_nav .h1_nav_hq .logo_pth {
		fill:#fff;
	}

	.hqnv_ul {
		justify-content: space-between;
		align-items: stretch;
		width: calc(100% - min(3.472222222222222vw, 100px));
	}
	.hqnv_ul li {
		width: calc(100% / 9);
		height: min(3.472222222222222vw, 100px);
	}

	.hqnv_ul a {
		color: #898989;
		font-size: clamp(0.65rem, 1.328vw, 1.3rem);
		background-color: #fff;
		/*padding: min(0.5vw, 16px) 0;*/
		height: 100%;
		position: relative;
	}
	#hq_nav .h1_nav_hq a::after,
	.hqnv_ul a::before,
	.hqnv_ul a::after {
		content: '';
		width: 1px;
		height: 100%;
		background-color: #898989;
		position: absolute;
		top: 0;
		bottom: 0;
	}
	.hqnv_ul a::before {
		left: 0;
		z-index: 1;
	}
	#hq_nav .h1_nav_hq a::after,
	.hqnv_ul a::after {
		right: -1px;
	}
	.hqnv_ul a:hover,
	.hqnv_ul .active a {
		color: #fff;
		background-color: #898989;
	}
	.hqnv_ul a:hover::before,
	.hqnv_ul .active a::before,
	.hqnv_ul a:hover::after,
	.hqnv_ul .active a::after {
		background-color: #fff;
		z-index: 2;
	}
	.hqnv_ul li.nav_contact a::after,
	.hqnv_ul li.nav_hq a::before {display: none;}
	
	main[data-active="share"] .nav_share a,
	main[data-active="cowork"] .nav_cowork a,
	main[data-active="cafe"] .nav_cafe a,
	main[data-active="space"] .nav_space a,
	main[data-active="rentalroom"] .nav_rentalr a,
	main[data-active="shelf"] .nav_shelf a,
	main[data-active="access"] .nav_access a {
		color: #fff;
		background-color: #898989;
	}
	.hqnv_ul li.nav_myroom a {
		color: #fff;
		background-color: #3c3c3c;
	}
	.hqnv_ul li.nav_contact a {
		color: #fff;
		background-color: #005c72;
	}
	.hqnv_ul li.nav_myroom a:hover,
	.hqnv_ul li.nav_contact a:hover {
		opacity: .8;
	}
}
@media screen and (max-width:640px) {
	#mainWrap {
		margin: 0;
	}
	#hq_nav {
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: #898989;
		height: min(13.6vw, 100px);
		padding: 0 min(4vw, 30px);
		position: relative;
		z-index: 10;
		overflow: hidden;
		transition: all .4s;
	}
	#hq_nav.on {
		overflow: visible;
		background-color: #3c3c3c;
	}
	#menuBtn {
		width: min(6vw, 45px);
		height: min(6vw, 45px);
		position: relative;
		z-index: 9;
		cursor: pointer;
	}
	#menuBtn::before,
	#menuBtn::after {
		content: '';
		display: block;
		width: 2px;
		height: min(4vw, 30px);
		background-color: #fff;
		position: absolute;
		top: calc(50% - min(1vw, 7.5px));
		transition: all .3s;
	}
	#menuBtn::before {
		left: 0;
		transform: rotate(-45deg);
		transform-origin: left top;
	}
	#menuBtn::after {
		right: 0;
		transform: rotate(45deg);
		transform-origin: right top;
	}
	#menuBtn.active::before {
		transform: rotate(-135deg);
		top: calc(50% + min(1vw, 7.5px));
		left: 2px;
	}
	#menuBtn.active::after {
		transform: rotate(135deg);
		top: calc(50% + min(1vw, 7.5px));
		right: 2px;
	}

	#hq_nav .h1_nav_hq {
		width: min(8.4vw, 63px);
		height: auto;
		position: absolute;
		left: calc(50% - (min(8.4vw, 63px) / 2));
	}
	#hq_nav .h1_nav_hq .logo_pth {
		fill:#fff;
	}

	#hq_nav .nav_sp_li {
		margin-left: min(4vw, 30px);
		width: min(5.6vw, 42px);
	}

	.nav_sp {
		display: flex;
		justify-content: center;
		align-items: center;
		left: 0;
	}
	#hq_nav .hqnv_ul {
		flex-direction: column;
		width: 100%;
		z-index: 8;
		position: absolute;
		top: min(13.6vw, 100px);
		left: 0;
		right: 0;
		border-top: 1px solid #898989;
		opacity: 0;
		visibility: hidden;
		transition: all .4s;
	}
	#hq_nav .hqnv_ul.open {
		opacity: 1;
		visibility: visible;
	}
	#hq_nav .hqnv_ul a {
		color: #fff;
		font-size: clamp(2rem, 5.21vw, 4rem);
		display: block;
		padding: min(2.8vw, 21px) 0;
		background-color: #3c3c3c;
		border-bottom: 1px solid #898989;
	}
	main[data-active="share"] .nav_share a,
	main[data-active="cowork"] .nav_cowork a,
	main[data-active="cafe"] .nav_cafe a,
	main[data-active="space"] .nav_space a,
	main[data-active="rentalroom"] .nav_rentalr a,
	main[data-active="shelf"] .nav_shelf a,
	main[data-active="access"] .nav_access a {
		background-color: #898989;
	}
}

/*share*/
.section._w100:not(.mw) {
	width: 100%;
	margin-right: 0;
	margin-left: 0;
}

/*h2*/
.wp_h2HQ {
	display: flex;
	border-bottom: 1px solid #898989;
}
section .h2_hq {
	color: #898989;
	font-family: 'DMSerifDisplay', serif !important;
	font-weight: 400;
}

/*h3*/
.h3_hq {
	color: #fff;
	font-family: 'Noto Sans JP', serif ;
	font-weight: 400;
	font-size: clamp(1rem, 2.042vw, 2rem);
	background-color: #595757;
	padding: min(.7vw, 21px) min(2.43vw, 70px);
}

/*txt*/
.txt,
.txt_m,
.txt_ss {
	color: #898989;
	font-family: 'Noto Sans JP', serif;
	font-weight: 400;
}
.txt {
	font-size: clamp(0.7rem, 1.43vw, 1.4rem);
}
.txt_m {
	font-size: clamp(0.65rem, 1.328vw, 1.3rem);
}
.txt_ss {
	font-size: clamp(0.5rem, 1.022vw, 1rem);
}

.right {
	text-align: right;
}
.center {
	text-align: center;
}

/*txt color*/
.red_ch {
	color: #955629;
}
.red {
	color: #e11413;
}

/*kome*/
.kome {
	/*color: #898989;
	font-family: 'Noto Sans JP', serif;
	font-weight: 400;*/
	/*font-size: clamp(0.5rem, 1.022vw, 1rem);*/
	text-indent: -1em;
	padding-left: 1em;
}

.mb10 {
	margin-bottom: 10px;
}

/* list ul */
.list_ul {
	margin-left: 1em;
}
.list_ul .list_li{
	list-style: disc;
	line-height: 1.9;
}

@media screen and (min-width:641px) {
	.section:not(.mv) {
		margin-right: min(3.472222222222222vw, 100px);
		margin-left: min(3.472222222222222vw, 100px);
		margin-bottom: min(9.722222222222222vw, 280px);
	}

	.section .sec + .sec {
		margin-top: min(9.722222222222222vw, 280px);
	}
	.wp_h2HQ {
		padding-bottom: min(1.5625vw, 45px);
		margin-bottom: min(0.6770833333333333vw, 19.5px);
	}
	section .h2_hq {
		font-size: clamp(1rem, 2.042vw, 2rem) !important;
		margin-right: min(2.5vw, 72px);
	}
	.wp_h2HQ .wp_txt {
		display: flex;
		flex-wrap: wrap;
	}
}
@media screen and (max-width:640px) {
	.section:not(.mv) {
		margin-right: min(12vw, 90px);
		margin-left: min(12vw, 90px);
		margin-bottom: min(26vw,195px);
	}
	.section._m10lr:not(.mw) {
		margin-right: 10px;
		margin-left: 10px;
	}
	.section .sec + .sec {
		margin-top: min(24.8vw, 185px);
	}
	.wp_h2HQ {
		flex-direction: column;
		align-items: center;
		padding-bottom: min(6.4vw,48px);
		margin-bottom: min(5.2vw, 39px);
		border-bottom: 1px solid #d0d0d0;
	}
	section .h2_hq {
		font-size: clamp(3.6rem, 9.374vw, 7.2rem) !important;
		text-align: center;
		margin-bottom: min(3.6vw, 27px);
		border-bottom: none;
	}
	.wp_h2HQ .wp_txt {
		width: min(55.6vw, 417px);
	}
	.h3_hq {
		font-size: clamp(1.6rem, 4.168vw, 3.2rem);
		text-align: center;
		padding: .25em 0 .35em;
		margin-bottom: min(8.8vw, 66px);
	}
	.txt {
		font-size: clamp(1.4rem, 3.646vw, 2.8rem);
	}
	.txt_m {
		font-size: clamp(1.25rem, 3.256vw, 2.5rem);
	}
	.txt_ss,
	.kome {
		font-size: clamp(1rem, 2.606vw, 2rem);
	}
}



/*link / button*/
.txt_more {
	display: flex;
}
.txt_more .link_more {
	color: #898989;
	font-family: 'Montserrat', serif ;
	font-weight: 400;
	font-size: clamp(0.55rem, 1.124vw, 1.1rem);
	text-decoration: none;
	padding-bottom: min(.5vw, 13.4px);
	width: min(14.23611111111111vw, 14em);
	position: relative;
	transition: all .3s;
}
.txt_more .bld {
	font-family: 'Montserrat', serif ;
	font-weight: 600;
	margin-right: .5em;
}
.txt_more .link_more::before,
.txt_more .link_more::after {
	content: '';
	display: block;
	position: absolute;
	background-color: #898989;
}
.txt_more .link_more::before {
	height: 1px;
	width: 100%;
	bottom: 0;
	left: 0;
	right: 0;
}
.txt_more .link_more::after {
	width: 1px;
	height: 100%;
	top: 0;
	bottom: 0;
	right: 0;
	transform: rotate(-45deg);
	transform-origin: right bottom;
}

.wp_mv .txt_more .link_more {
	border: 1px solid #898989;
	display: flex;
	justify-content: center;
	align-items: center;
	padding-bottom: 0;
	width: 100%;
	height: min(3.4375vw, 95px);
}
.wp_mv .txt_more .link_more::before,
.wp_mv .txt_more .link_more::after {display: none;}
.wp_mv .txt_more .link_more .dc {
	width: min(3.4375vw, 97px);
	height: .8em;
	margin-bottom: .6em;
	margin-left: min(4vw, 30px);
	border-bottom: 1px solid #898989;
	position: relative;
	transition: all .4s;
}
.wp_mv .txt_more .link_more .dc::after {
	content: '';
	display: block;
	width: 1px;
	height: 100%;
	background-color: #898989;
	position: absolute;
	right: 0;
	top: 0;
	transform: rotate(-45deg);
	transform-origin: right bottom;
}
.wp_mv .txt_more .link_more:hover {
	color: #fff;
	background-color: #898989;
}
.wp_mv .txt_more .link_more:hover .dc {
	border-color: #fff;
	transform: translateX(1em);
}
.wp_mv .txt_more .link_more:hover .dc::after {
	background-color: #fff;
}

/*contact btn*/
.btn_contact {
	color: #898989;
	display: flex;
	flex-direction: column;
	align-items: center;
	border: 3px solid #898989;
}
.btn_contact:hover {
	color: #fff;
	text-decoration: none;
	background-color: #898989;
}
.btn_contact .btn_ttl {
	font-family: 'DMSerifDisplay', serif;
	letter-spacing: .08em;
}
.btn_contact .btn_txt {
	font-family: 'Noto Sans JP', serif;
	font-weight: 400;
}

/*btn common*/
.btn_wrap {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	text-align: center;
}
.btn_wrap.center {
	justify-content: center;
}
.btn_wrap.left {
	justify-content: flex-start;
}
.btn_cmn {
	color: #fff;
	font-family: 'Noto Sans JP', serif;
	display: flex;
	justify-content: center;
	background-color: #595757;
}
.btn_cmn:hover {
	color: #fff;
	text-decoration: none;
	background-color: #999;
}
.btn_cmn:not(.more)[target="_blank"]::after {
	display: none;
}


@media screen and (min-width:641px) {
	.txt_more.sp {display: none;}
	.btn_cmn {
		font-size: clamp(0.85rem, 1.736vw, 1.7rem);
		width: min(20.9375vw, 605px);
		padding: .5em;
	}
	.dtl_dl .dtl_dd .btn_cmn.en,
	.btn_cmn.en {
		font-family: 'Montserrat', serif;
		font-weight: 400;
	}
	.btn_contact {
		padding: min(2vw, 60px) 0 min(2.8125vw, 80px);
	}
	.btn_contact .btn_ttl {
		font-size: clamp(1.5rem, 3.062vw, 3rem);
	}
	.btn_contact .btn_txt {
		font-size: clamp(0.65rem, 1.328vw, 1.3rem);
	}
	.txt_more .link_more:hover {
		width: calc(min(14.23611111111111vw, 14em) + 3em);
	}
	.mv .txt_more .link_more:hover {
		width: 100%;
	}
}
@media screen and (max-width:640px) {
	.txt_more.pc {display: none;}
	.txt_more {
		justify-content: center;
		align-items: center;
	}
	.txt_more .link_more {
		font-size: clamp(1.1rem, 2.865vw, 2.2rem);
		width: min(54.8vw, 410px);
		padding-bottom: min(1.6vw, 12px);
	}
	.list_hq .txt_more .link_more,
	.wp_mv .txt_more .link_more {
		font-size: clamp(1.05rem, 2.736vw, 2.1rem);
		border: 1px solid #898989;
		display: flex;
		justify-content: center;
		align-items: center;
		width: min(76vw, 570px);
		height: min(14vw, 105px);
		padding-bottom: 0;
	}
	.list_hq .txt_more .link_more::before,
	.list_hq .txt_more .link_more::after {display: none;}
	.wp_mv .txt_more .link_more .dc,
	.txt_more .link_more .dc {
		/*width: min(8vw, 60px);*/
		width: min(10vw, 60px);
		height: .8em;
		margin-bottom: .6em;
		margin-left: min(4vw, 30px);
		border-bottom: 1px solid #898989;
		position: relative;
	}
	.txt_more .link_more .dc::after {
		content: '';
		display: block;
		width: 1px;
		height: 100%;
		background-color: #898989;
		position: absolute;
		right: 0;
		top: 0;
		transform: rotate(-45deg);
		transform-origin: right bottom;
	}

	.btn_cmn {
		font-size: clamp(2.2rem, 5.73vw, 4.4rem);
		padding: .2em;
		width: min(76vw, 570px);
	}

	.dtl_dl .dtl_dd .btn_cmn.en,
	.btn_cmn.en {
		font-family: 'DMSerifDisplay', serif;
		font-weight: 400;
	}

	.btn_contact {
		width: 100%;
		height: min(72.8vw, 546px);
		justify-content: center;
	}
	.btn_contact .btn_ttl {
		font-size: clamp(3rem, 7.81vw, 6rem);
	}
	.btn_contact .btn_txt {
		font-size: clamp(1.25rem, 3.256vw, 2.5rem);
	}
}

/*access map*/
.access #map,
.access .frame_map {
	filter: grayscale(100%);
	transition: all .4s;
}
.access #map:hover,
.access .frame_map:hover {
	filter: grayscale(0);
}


/* go to top page*/
.flex_cnt._goback {
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.flex_cnt._goback .link_img {
	color: #898989;
}
.gotop_img {
	fill:#898989;
}
.txt_back {
	display: flex;
	justify-content: center;
	align-items: flex-start;
}
.txt_back {
	color: #898989;
	font-family: 'Montserrat', serif;
	font-weight: 400;
}
.link_img:hover,
.link_img:hover .txt_back {
	text-decoration: none;
}

@media screen and (min-width:641px) {
	.gotop_img {
		width: min(5.3125vw, 152px);
		margin-bottom: min(1.5625vw, 45px);
	}
	.txt_back {
		font-size: clamp(0.55rem, 1.124vw, 1.1rem);
		text-decoration: underline;
		text-underline-offset: 6px;
	}

}
@media screen and (max-width:640px) {
	.gotop_img {
		width: min(20vw, 150px);
		margin-bottom: min(6vw, 45px);
	}
	.txt_back {
		font-size: clamp(1.1rem, 2.865vw, 2.2rem);
	}
}












