@charset "utf-8";

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,p,blockquote,th,td,main,figure{margin:0;padding:0}table{font-size:100%;font-family:inherit}fieldset,img{border:0}img,svg,video{vertical-align:middle}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%}q:before,q:after{content:''}abbr,acronym{border:0}select,input,textarea{font-size:100%}header,footer,nav,main,section,article,figure,aside,picture{display:block}.clearfix:after,.row:after{content:"";display:table;clear:both}._fl{float:left}._fr{float:right}@media screen and (min-width: 744px),print{._pc_fl{float:left}._pc_fr{float:right}}@media screen and (max-width: 743px){._sp_fl{float:left}._sp_fr{float:right}}._tal{text-align:left!important}._tac{text-align:center!important}._tar{text-align:right!important}@media screen and (min-width: 744px),print{._pc_tal{text-align:left!important}._pc_tac{text-align:center!important}._pc_tar{text-align:right!important}}@media screen and (max-width: 743px){._sp_tal{text-align:left!important}._sp_tac{text-align:center!important}._sp_tar{text-align:right!important}}


/* 変数
====================================================================== */
:root {
	/* --color-base: #221815;
	--color-gold: #D6A36F;
	--bg-gold: #b98445; */
	--color-base: #161522;
	--color-theme-dark: #111989;
	--color-theme: #4057a2;

	--base-max-width: 132rem;
	--base-width: 110rem;
	--base-min-width: 1100px;
	--pc-base-padding: 3rem;
	--sp-base-padding: calc(20 / 375 * 100vw);
	--font-family-serif: 'Noto Serif JP', serif;
	--font-family-gothic: 'Noto Sans JP', sans-serif;
	--font-family-shippori: 'Shippori Mincho B1', serif;
	--font-family-en: 'Cinzel', serif;
	--font-weight: 400;
	--font-weight-bold: 700;
	--transition-duration: .3s;
	--transition: var(--transition-duration) ease-in-out;
}


/* ========================================================
	template.css => テンプレート用CSS
======================================================== */
html {
	font-size: 62.5%;
	scroll-behavior: smooth;
}
html.no-scroll-behavior {
	scroll-behavior: auto;
}
@media screen and (min-width: 744px), print {
	html {
		font-size: clamp(calc(10px * .7), calc((10px * .7) + (100vw - 1000px) * (1 / 500) * (10 * .3)), 10px);
	}
	html.-dv-tab {
		font-size: clamp(1px, calc((10px * .7) + (100vw - 1000px) * (1 / 500) * (10 * .3)), 10px);
	}
}
body {
/*	overflow-y: scroll;*/
	background-color: #fff;
	font-size: 1.6rem;
	line-height: calc(36 / 16);
	color: var(--color-base);
	word-wrap: break-word;
	overflow-wrap: break-word;
	letter-spacing: .1em;

	font-family: var(--font-family-serif);
	font-weight: var(--font-weight);
	font-feature-settings: "palt";
	font-style: normal;
	-webkit-text-size-adjust: none;
	text-size-adjust: none;
}
body:not(.-page--roomplan){
	overflow-y: scroll;
}

@media screen and (max-width: 743px) {
	body {
		font-size: 1.3rem;
		line-height: 2;
	}
}

*,
*::before,
*::after {
	box-sizing: border-box;
}
:where(address,caption,cite,code,dfn,em,th,var) {
	font-style: normal;
	font-weight: var(--font-weight);
}
:where(h1,h2,h3,h4,h5,h6) {
	font-weight: var(--font-weight);
}
:where(img) {
	max-width: 100%;
	height: auto;
}
:where(iframe) {
	max-width: 100%;
	vertical-align: middle;
}
:where(sup) {
	vertical-align: super;
	font-size: 60%;
}
:where(table) {
	border-collapse: collapse;
	border-spacing: 0;
	line-height: inherit;
}
:where(a[href], a[data-modal], a[data-webcamera]) {
	color: var(--color-base);
	text-decoration: underline;
	text-underline-offset: .2em;
	outline: none;
	cursor: pointer;
}
:where(a[href]._a_reverse,._a_reverse a[href]) {
	text-decoration: none;
}
@media (hover) {
	:where(a[href]:hover, a[data-modal]:hover) {
		text-decoration: none;
	}
	:where(a[href]._a_reverse, a[data-modal]._a_reverse, ._a_reverse a[href], ._a_reverse a[data-modal]):hover {
		text-decoration: underline;
	}
}

:where(label) {
	cursor: pointer;
}
:where(input, select, textarea, button) {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	max-width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	border-radius: 0;
	vertical-align: middle;
	color: var(--color-base);
	font-family: inherit;
	font-weight: inherit;
	font-feature-settings: inherit;
	outline: none;
	font-size: 100%;
}
::placeholder {
	color: #ccc;
}
:where(button) {
	cursor: pointer;
}

.hidden {
	display: none;
}
.slick-slider * {
	outline: none;
}

#top {
	display: block;
}

/* slick
====================================================================== */
.slick-list,.slick-slider,.slick-track{position:relative;display:block}.slick-slider{box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{top:0;left:0;margin-left:auto;margin-right:auto}.slick-track:after,.slick-track:before{display:table;content:''}.slick-track:after{clear:both}.slick-loading .slick-slide,.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir=rtl] .slick-slide{float:right}.slick-initialized .slick-slide,.slick-slide img{display:block}.slick-arrow.slick-hidden,.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}

/* pc / sp
====================================================================== */
@media screen and (min-width: 744px), print {
	._sp {
		display: none !important;
	}
	._pc_break {
		position: relative;
		display: block;
		height: 0;
		overflow: hidden;
	}
	._pc_hidden {
		position: relative;
		overflow: hidden;
		display: block;
		height: 0;
	}
}
@media screen and (max-width: 743px) {
	._pc {
		display: none !important;
	}
	._sp_break {
		position: relative;
		display: block;
		height: 0;
		overflow: hidden;
	}
}

/* transition
====================================================================== */
@media (hover) {
	:where(body.init) :where(a,button,._basic_trs,._hl),
	:where(body.init) :where(a,button,._basic_trs,._hl)::before,
	:where(body.init) :where(a,button,._basic_trs,._hl)::after {
		transition: color var(--transition), background var(--transition), border var(--transition), opacity var(--transition), text-decoration-color .2s ease-in-out;
	}
	:where(body.init a svg) {
		transition: fill var(--transition);
	}
}

/* color
====================================================================== */
._c_base {
	color: var(--color-base) !important;
}
._c_gold {
	color: var(--color-theme-dark) !important;
}
._c_theme {
	color: var(--color-theme) !important;
}
._c_white {
	color: #fff !important;
}
._bg_white {
	background-color: #fff !important;
}
/*
._bg_light {
	background-color: var(--bg-light) !important;
}
*/

/* font
====================================================================== */
._ff_gothic {
	font-family: var(--font-family-gothic);
}
._ff_shippori {
	font-family: var(--font-family-shippori);
	font-weight: 600;
}
._fwn {
	font-weight: var(--font-weight);
}
._fwr {
	font-weight: 400;
}
._fwm {
	font-weight: 500;
}
._fwb {
	font-weight: var(--font-weight);
}
._wsnw {
	white-space: nowrap;
}
@media screen and (min-width: 744px), print {
	._pc_wsnw {
		white-space: nowrap;
	}
}
@media screen and (max-width: 743px) {
	._sp_wsnw {
		white-space: nowrap;
	}
}
._fz_l {
	font-size: 1.8rem;
	line-height: calc(34 / 18);
}
@media screen and (max-width: 743px) {
	._fz_l {
		line-height: calc(32 / 18);
	}
}

/* display
====================================================================== */
._db {
	display: block;
}
._dib {
	display: inline-block;
}
._dfcc {
	display: flex !important;
	justify-content: center;
	align-items: center;
}
@media screen and (min-width: 744px), print {
	._pc_dib {
		display: inline-block;
	}
	._pc_dfcc {
		display: flex !important;
		justify-content: center;
		align-items: center;
	}
}
@media screen and (max-width: 743px) {
	._sp_dib {
		display: inline-block;
	}
	._sp_dfcc {
		display: flex !important;
		justify-content: center;
		align-items: center;
	}
}

/* object-fit
====================================================================== */
img._of {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
img._of.-abs {
	position: absolute;
	top: 0;
	left: 0;
}
img._of.-bg {
	pointer-events: none;
	user-select: none;
	z-index: -1;
}
img._of.-top {
	object-position: 50% 0;
}
img._of.-bottom {
	object-position: 50% 100%;
}
@media screen and (min-width: 744px), print {
	img._of.-pc_none {
		object-fit: none;
	}
	img._of.-pc_top {
		object-position: 50% 0 ;
	}
	img._of.-pc_bottom {
		object-position: 50% 100%;
	}
	img._pc_of {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	img._pc_of.-abs {
		position: absolute;
		top: 0;
		left: 0;
	}
	img._pc_of.-bg {
		pointer-events: none;
		user-select: none;
		z-index: -1;
	}
	img._pc_of.-top {
		object-position: 50% 0 ;
	}
	img._pc_of.-none {
		object-fit: none;
	}
}
@media screen and (max-width: 743px) {
	img._of.-sp_top {
		object-position: 50% 0 ;
	}
	img._of.-sp_bottom {
		object-position: 50% 100%;
	}
	img._sp_of {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	img._sp_of.-abs {
		position: absolute;
		top: 0;
		left: 0;
	}
	img._sp_of.-bg {
		pointer-events: none;
		user-select: none;
		z-index: -1;
	}
	img._sp_of.-top {
		object-position: 50% 0 ;
	}
}
figure._of {
	width: 100%;
	height: 100%;
}
figure._of.-abs {
	position: absolute;
	top: 0;
	left: 0;
}
figure._of.-bg {
	pointer-events: none;
	user-select: none;
	z-index: -1;
}
figure._of img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
figure figcaption {
	position: absolute;
	font-size: 0.9rem;
	bottom: 2rem;
	right: 3rem;
	color: #fff;
	z-index: 2;
}
figure figcaption.-black {
	color: #6A6A6A;
}
figure figcaption.-black.-shadow {
	text-shadow: 0 0 1px #fff, 0 0 1px #fff, 0 0 1px #fff, 0 0 1px #fff;
}
@media screen and (max-width: 743px) {
	figure figcaption {
		bottom: 1rem;
		right: 1rem;
		font-size: 0.8rem;
	}
}


/* hover
====================================================================== */
@media (hover) {
	body.init a[href] ._hv_op {
		transition: opacity var(--transition);
	}
	a:is([href], [data-modal])._hv_op:hover,
	a[href]:hover ._hv_op,
	button._hv_op:hover,
	._hv_op a[href]:hover {
		opacity: 0.7;
	}
	a[href]._hv_op.-a20:hover,
	a[href]:hover ._hv_op.-a20,
	._hv_op.-a20 a[href]:hover {
		opacity: 0.8;
	}
	a[href]._hv_op.-a10:hover,
	a[href]:hover ._hv_op.-a10,
	._hv_op.-a10 a[href]:hover {
		opacity: 0.9;
	}
	a[href]._hv_op.-a50:hover,
	a[href]:hover ._hv_op.-a50,
	._hv_op.-a50 a[href]:hover {
		opacity: 0.5;
	}
}

._hv_zoom {
	position: relative;
	display: block;
	overflow: hidden;
}
._hv_zoom > * {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	background-repeat: no-repeat;
	background-position: 50%;
	background-size: cover;
}
._hv_zoom.-static > * {
	position: relative;
}
@media (hover) {
	body.init a[href]._hv_zoom > *,
	body.init a[href] ._hv_zoom > * {
		transition: transform 0.5s, opacity .3s;
	}
	a[href]:hover ._hv_zoom.-s > * {
		transform: scale(1.03);
	}
	a[href]:hover ._hv_zoom.-l > * {
		transform: scale(1.1);
	}
	a[href]:hover._hv_zoom > *,
	a[href]:hover ._hv_zoom > * {
		transform: scale(1.05);
	}
}

/* target
====================================================================== */
a._target {
	display: block;
	position: relative;
	width: 1px;
	top: -6rem;
}
a._target.-pt {
	top: -10rem;
}
a._target.-abs {
	position: absolute;
}
@media screen and (max-width: 743px) {
	a._target {
		top: -5rem;
	}
	a._target.-pt {
		top: -9rem;
	}
}


/* w
====================================================================== */
._w, ._xw {
	position: relative;
}
@media screen and (min-width: 744px), print {
	._w {
		width: var(--base-width);
		max-width: calc(100% - var(--pc-base-padding));
		margin-inline: auto;
	}
	._xw {
		width: var(--base-max-width);
		max-width: calc(100% - var(--pc-base-padding));
		margin-inline: auto;
	}
	._mw {
		min-width: var(--base-min-width);
	}
	html.-dv-tab ._mw {
		min-width: 0;
	}
}
@media screen and (max-width: 743px) {
}


/* spパディング
====================================================================== */
@media screen and (max-width: 743px) {
	._sp_pd {
		padding-inline: var(--sp-base-padding) !important;
	}
	._sp_mg {
		margin-inline: var(--sp-base-padding) !important;
	}
	._sp_full {
		margin-inline: calc(var(--sp-base-padding) * -1) !important;
	}
	._sp_full_l {
		margin-left: calc(var(--sp-base-padding) * -1) !important;
	}
	._sp_full_r {
		margin-right: calc(var(--sp-base-padding) * -1) !important;
	}
}


/* header
====================================================================== */
#header {
	z-index: 1000;
}
#header::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	background-color: var(--color-base);
	opacity: 0.3;
	z-index: -1;
}
#header .gnav {
	line-height: 1;
}
#header .gnav a {
	text-decoration: none;
	font-size: 1.6rem;
	color: #fff;
}
#header .gnav svg {
	width: auto;
	height: 2rem;
	fill: #fff;
}
#header .gnav .concept svg {
	width: 7.8rem;
}
#header .gnav .location svg {
	width: 8.7rem;
}
#header .gnav .plan svg {
	width: 14.6rem;
}
#header .gnav .life-information svg {
	width: 16.1rem;
}
#header .gnav .quality svg {
	width: 7.6rem;
}
#header .gnav .request {
	position: relative;
	background-color: var(--color-theme);
	z-index: 2;
}
#header .gnav .request svg {
	width: 7.7rem;
}
#header .gnav .new{
  position: relative;
}
#header .gnav .new::after{
  position: absolute;
  content:"NEW";
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-family-en);
  font-optical-sizing: auto;
  letter-spacing: 0.1em;
  width: 15rem;
  height: 27px;
  top: 5.0rem;
  right: 0;
  left: 0;
  margin-right:auto;
  margin-left: auto;
  color: var(--color-theme);
  background-color: #fff;
  z-index: -1;
}

@media print {
	#header {
		position: absolute;
	}
  #header .gnav .new::after{
    display: none;
  }
}
@media screen and (min-width: 744px), print {
	#header {
		position: sticky;
		top: 0;
		display: flex;
		justify-content: space-between;
		height: 6rem;
		margin-bottom: -6rem;
		padding-left: max(var(--pc-base-padding), calc((100% - 140rem) / 2));
		padding-right: max(0px, calc((100% - 140rem) / 2));
	}
	#header .logo {
		display: flex;
		align-items: center;
		height: 7rem;
		height: 6rem;
		width: 21.8rem;
	}
	#header .gnav {
		display: flex;
	}
	#header .gnav a {
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 6rem;
		padding-inline: 1.8rem;
	}
	#header .gnav .request {
		width: 26rem;
		margin-left: 4rem;
	}
	@media (hover) {
		#header .gnav a:not(.request)::after {
			content: "";
			position: absolute;
			top: calc(50% + 1.6rem);
			right: 1.8rem;
			left: 1.8rem;
			border-top: .1rem solid;
			transform: scaleX(0);
			transition: transform var(--transition);
		}
		#header .gnav a:not(.request):hover::after {
			transform: scaleX(1);
		}
		#header .gnav a.request::after {
			content: "";
			position: absolute;
			top: 0;
			right: 0;
			left: 0;
			bottom: 0;
			background-color: #fff;
			opacity: 0;
			z-index: -1;
		}
		#header .gnav a.request:hover::after {
			opacity: 0.3;
		}
	}
	.-page--index:not(.head-bg) #header .gnav a:not(.request) {
		color: var(--color-theme-dark);
	}
	.-page--index:not(.head-bg) #header .gnav a:not(.request) svg {
		fill: var(--color-theme-dark);
	}
}
@media screen and (max-width: 743px) {
	#header {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		display: flex;
		align-items: center;
		height: 5rem;
	}
	#header .logo {
		position: relative;
		z-index: 600;
	}
	#header .logo a {
		display: block;
		padding: 0 var(--sp-base-padding);
	}
	#header .logo img {
		width: 20rem;
	}
	.-page--index #header .logo {
		opacity: 0;
		pointer-events: none;
	}
	.-page--index.init #header .logo {
		transition: opacity var(--transition);
	}
	.-page--index.head-bg #header .logo,
	.-page--index #header.open .logo {
		opacity: 1;
		pointer-events: auto;
	}

	/* nav_btn */
	#header .nav_btn {
		position: absolute;
		right: 0;
		top: 0;
		width: 5rem;
		height: 5rem;
		z-index: 600;
	}
	#header .nav_btn a {
		overflow: hidden;
		position: relative;
		display: block;
		height: 100%;
		color: rgba(255,255,255,0);
		font-size: 1rem;
		text-decoration-line: none;
	}
	#header .nav_btn::before,
	#header .nav_btn a::before,
	#header .nav_btn a::after {
		content: "";
		position: absolute;
		left: 50%;
		top: 50%;
		width: 2.4rem;
		margin-top: -1px;
		margin-left: -1.2rem;
		border-top: 2px solid #fff;
		pointer-events: none;
	}
	#header .nav_btn a::before {
		transform: translateY(-.8rem);
	}
	#header .nav_btn a::after {
		transform: translateY(.8rem);
	}
	body.init #header .nav_btn::before,
	body.init #header .nav_btn a::before,
	body.init #header .nav_btn a::after {
		transition: transform var(--transition), opacity var(--transition), border var(--transition);
	}
	/* nav_btn open */
	#header.open .nav_btn::before {
		opacity: 0;
	}
	#header.open .nav_btn a::before {
		transform: translate(0) rotate(45deg);
	}
	#header.open .nav_btn a::after {
		transform: translate(0) rotate(-45deg);
	}

	#header nav {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		height: 100vh;
		height: 100lvh;
		display: flex;
		align-items: center;
		background-color: var(--color-base);
		transform: translateX(110%);
		z-index: 500;
	}
	#header.trs nav {
		transition: transform var(--transition);
	}
	/* open */
	#header.open nav {
		transform: translateX(0);
	}

	#header .gnav {
		width: 100%;
	}
	#header .gnav a {
		display: block;
		padding: 2rem;
		text-align: center;
	}
	#header .gnav a svg {
		transform: scale(1.3);
	}
	#header .gnav a.request {
		margin-top: 3rem;
		font-size: 1.8rem;
	}
  #header .gnav .new::after{
    width: 49px;
    height: 18px;
    top: 5px;
    right: inherit;
    left: 72%;
    transform: inherit;
  }
}
.-page--index #header::before {
	opacity: 0;
}
@media screen {
	.-page--index.init #header::before {
		transition: opacity var(--transition);
	}
	.-page--index.head-bg #header::before {
		opacity: 0.3;
	}
}


/* footer
====================================================================== */
#footer {
	position: relative;
	padding: 9.5rem 0 2rem;
	background-color: var(--color-base);
	color: #fff;
	text-align: center;
	z-index: 2;
}
#footer .logo img {
	width: 22rem;
}
#footer .requerst_btn {
	margin-top: 5rem;
}
#footer .requerst_btn a {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 50.5rem;
	height: 10rem;
	margin-inline: auto;
	color: #fff;
	font-size: 2.4rem;
	line-height: 1.5;
	font-weight: 600;
	text-decoration: none;
	/* background: linear-gradient(133.76deg, #DD8620 30.79%, #DD8620 30.79%, #E69433 33.38%, #F19D3A 36.9%, #FBBB72 43.01%, #FABC73 46.29%, #F0B46D 48.76%, #F5A445 51.61%, #F5A445 51.95%, #F3A03E 52.73%, #F3A03E 53.64%, #F29A33 54.69%, #F69E35 58.76%, #F69C30 61.62%, #F5B262 65.8%, #F5A84C 73.33%); */
	background: var(--color-theme);
	z-index: 3;
}
#footer .requerst_btn a::before {
	/* content: ""; */
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--color-theme);
	opacity: 0.4;
	z-index: -1;
}
@media (hover) {
	#footer .requerst_btn a::after {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		background-color: #fff;
		opacity: 0;
		z-index: -1;
	}
	#footer .requerst_btn a:hover::after {
		opacity: 0.3;
	}
}
#footer .lead {
	margin-top: 4rem;
	font-size: 3rem;
	line-height: calc(50 / 30);
	font-weight: 600;
	letter-spacing: 0.15em;
}
#footer .info {
	margin-top: 6rem;
}
#footer .info dt {
	font-size: 1.6rem;
	font-weight: 500;
}
#footer .info .tel {
	display: block;
	width: fit-content;
	margin: 1.5rem auto 2rem;
	padding-left: 4.2rem;
	background: url(../img/ico-freedial.svg) no-repeat 0 60%;
	background-size: 3.2rem;
	font-size: 3.7rem;
	line-height: 1;
	font-weight: 600;
	color: #d9ddec;
	text-decoration: none;
}
#footer .info .time {
	display: block;
	font-size: 1.4rem;
	font-weight: 500;
}
#footer small {
	display: block;
	margin-top: 5rem;
	font-size: 1.4rem;
	letter-spacing: 0.02em;
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (min-width: 744px), print {
	#footer .img {
		overflow: hidden;
		position: absolute;
		bottom: 0;
		right: 0;
		left: calc(50% + 30rem);
		pointer-events: none;
		user-select: none;
		z-index: -1;
	}
	#footer .img img {
		width: 44rem;
		max-width: none;
	}
}
@media screen and (max-width: 743px) {
	#footer {
		padding: 7rem var(--sp-base-padding) 0;
	}
	#footer .logo img {
		width: 18rem;
	}
	#footer .requerst_btn {
		margin-top: 4rem;
	}
	#footer .requerst_btn a {
		width: 100%;
		height: 6rem;
		font-size: 1.8rem;
	}
	#footer .lead {
		margin-top: 3rem;
		font-size: 2rem;
		line-height: 1.7;
	}
	#footer .info {
		margin-top: 5rem;
	}
	#footer .info dt {
		font-size: 1.3rem;
	}
	#footer .info .tel {
		margin: 1rem auto 1rem;
		font-size: 3.2rem;
	}
	#footer .info .time {
		font-size: 1.2rem;
	}
	#footer small {
		margin-top: 3rem;
		font-size: 1.1rem;
	}
	#footer .img {
		width: 22rem;
		margin: 2rem auto 0;
	}
}


/* ===================================================================================================================

	パーツ

============================================================================= */
.request_fix_nav {
	position: fixed;
	position: absolute;
	right: 0;
	top: calc(50% - 10.9rem);
	z-index: 900;
}
.request_fix_nav a {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 5.8rem;
	height: 21.8rem;
	/* background: linear-gradient(133.76deg, #DD8620 29.56%, #DD8620 29.56%, #E69433 32.48%, #F19D3A 36.46%, #FBBB72 43.37%, #FABC73 47.07%, #FFC786 49.87%, #F5A445 53.08%, #F5A445 53.47%, #F3A03E 54.35%, #F3A03E 55.38%, #F29A33 56.57%, #EA942E 61.17%, #E99837 64.4%, #F69F36 69.12%, #F5A84C 77.63%); */
	background-color: var(--color-theme);
	color: #fff;
	text-decoration: none;
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: 0.3em;
	writing-mode: vertical-rl;
	font-feature-settings: normal;
	z-index: 3;
}
.request_fix_nav a::before {
	/* content: ""; */
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--color-theme);
	opacity: 0.4;
	z-index: -1;
}
@media (hover) {
	.request_fix_nav a::after {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		background-color: #fff;
		opacity: 0;
		z-index: -1;
	}
	.request_fix_nav a:hover::after {
		opacity: 0.3;
	}
}
@media screen and (max-width: 743px) {
	.request_fix_nav a {
		transform-origin: 100%;
		transform: scale(.7);
	}
}

/* ===================================================================================================================

	トップページ

============================================================================= */
:where(.ph:has(.caption)) {
	position: relative;
}
.caption {
	position: absolute;
	right: 1em;
	color: #fff;
	font-size: 0.9rem;
	line-height: 1.3;
	font-family: var(--font-family-gothic);
	letter-spacing: .1em;
	z-index: 2;
}
@media screen and (max-width: 743px) {
	.caption {
		font-size: 0.8rem;
	}
}


/* index-main
====================================================================== */
.index-main {
	position: relative;
	height: 100vh;
	font-size: 1.8rem;
	line-height: calc(32.4 / 18);
	font-weight: 500;
	color: var(--color-theme);
}
.index-main .btn {
  margin: 4rem auto -10rem;
  width: 80%;
  max-width: 300px;
}

.index-main .btn-fit {
  position: fixed;
  z-index: 3;
  right: 1.5rem;
  bottom: 0.5rem;
  width: 60%;
  max-width: 300px;
}
.index-main .btn-fit a{
  display:block;
  box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.75);
}

.index-main .btn-fit .btn-close::before {
	position: absolute;
  content: "";
  top: -8px;
	left: -6px;
  width: 19px;
  height: 19px;
	background:  url(../img/index/ico_close.svg) no-repeat;
	background-size: cover;
  cursor: pointer;
  border-radius: 50%;
  box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.75);
}
.non_opening .index-main .btn-fit {
  opacity: 0;
  transform: translateY(.5rem);
}
.non_opening.show_main .index-main .btn-fit {
  transition: opacity .6s .5s ease, transform .6s .5s ease;
  transform: translateY(0);
  opacity: 1;  
}


.index-main .btn-fit02 {
	position: fixed;
	z-index: 3;
	right: 2.5rem;
    bottom: 17.5rem;
	width: 60%;
	max-width: 300px;
  }
  .index-main .btn-fit02 a{
	display:block;
	box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.75);
  }
  
  .index-main .btn-fit02 .btn-close::before {
	  position: absolute;
	content: "";
	top: -8px;
	  left: -6px;
	width: 19px;
	height: 19px;
	  background:  url(../img/index/ico_close.svg) no-repeat;
	  background-size: cover;
	cursor: pointer;
	border-radius: 50%;
	box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.75);
  }
  .non_opening .index-main .btn-fit02 {
	opacity: 0;
	transform: translateY(.5rem);
  }
  .non_opening.show_main .index-main .btn-fit02 {
	transition: opacity .6s .5s ease, transform .6s .5s ease;
	transform: translateY(0);
	opacity: 1;  
  }

  .index-main .btn-fit-sp {
	display: none;
  }

  @media screen and (max-width: 743px) {
	.index-main .btn-fit02, .index-main .btn-fit {
		display: none;
	}
	.index-main .btn-fit-sp {
		display: block;
		position: fixed;
		z-index: 3;
		right: 0;
		bottom: 0;
		width: 100%;
		height: 60px;
		opacity: 0;
		transform: translateY(.5rem);
	  }
	  .non_opening.show_main .index-main .btn-fit-sp {
		transition: opacity .6s .5s ease, transform .6s .5s ease;
		transform: translateY(0);
		opacity: 1;  
	  } 
	  .index-main .btn-fit-sp .items {
		display: flex;
		height: 100%;
	  }
	  .index-main .btn-fit-sp .item {
		width: 50%;
		height: 100%;
	  }
	  .index-main .btn-fit-sp .item a {
		text-decoration: none;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 100%;
	}

		.index-main .btn-fit-sp .item:nth-child(1) {
			background-color: rgba(0, 0, 0, 0.8);
		}
		.index-main .btn-fit-sp .item:nth-child(2) {
			background-color: rgba(117, 76, 36, 0.8);
		}
	
	.index-main .btn-fit-sp .item a.--request {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		position: relative;
		background: linear-gradient(to right, #d0a900, #fff9e6);
		text-align: center;
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		font-size: 1.6rem;
		z-index: 1;
	  }

	  .index-main .btn-fit-sp .item a.--request span {
		font-size: 1.1rem;
		display: block;
	  }

	  .index-main .btn-fit-sp .item a.--sauna {
		color: #fff;
		text-align: center;
		font-size: 1rem;
	  }
	  .index-main .btn-fit-sp .item a.--sauna span {
		font-size: 1.4rem;
	  }
	  
  }

@media (hover) {
  .index-main .btn a:hover{
    opacity: 0.75;
  }
}
@media screen and (min-width: 744px), print {
	.index-main {
		display: flex;
		align-items: center;
	}
	.index-main .content {
		margin-right: calc(50% + 6rem);
		margin-left: auto;
	}
	.index-main .logo {
		width: 45rem;
		margin-bottom: 4rem;
  /*  margin-right: auto;
    margin-left: auto;
    max-width: 240px; */
	}
  .index-main .btn-fit {
    right: 2.5rem;
    bottom: 1.0rem;	
  }
}
@media screen and (max-width: 743px) {
	.index-main {
		display: flex;
		justify-content: center;
		align-items: end;
		height: 100vh;
		height: 100svh;
		font-size: 1.3rem;
		text-align: center;
		padding-bottom: 120vw;
	}
	.index-main .logo {
		width: 24rem;
		margin: 0 auto 3rem;
	}
	.index-main ._of.-bg {
		object-position: 50% 100%;
	}
	@media screen and (max-height: 780px) {
		.index-main {
			align-items: center;
			padding-bottom: 40vh;
			padding-bottom: 40svh;
		}
		.index-main .logo {
			width: calc(200 / 720 * 100vh);
			width: calc(200 / 720 * 100svh);
			margin: 0 auto 2rem;
		}
		.index-main ._of.-bg {
			object-position: 50% 70%;
		}
	}
}
@media screen and (orientation: portrait) {
	.-dv-tab .index-main {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100svh;
		font-size: 1.3rem;
		text-align: center;
		padding-bottom: 50vh;
		padding-bottom: 50svh;
	}
	.-dv-tab .index-main .content {
		margin-right: auto;
		margin-left: auto;
	}
	.-dv-tab .index-main .logo {
		width: calc(200 / 720 * 100vh);
		width: calc(200 / 720 * 100svh);
		margin: 0 auto 2rem;
	}
	.-dv-tab .index-main ._of.-bg {
		background: url(../img/index/main-img_sp.jpg) no-repeat 50% 70%;
		background-size: cover;
	}
	.-dv-tab .index-main ._of.-bg img {
		display: none;
	}
}

/* youtube-section
====================================================================== */
.youtube-section {
  position: relative;
  padding: 7rem 0 7rem;
  background-color: #fff;
  line-height: calc(40 / 16);
  z-index: 2;

}

.youtube-section h2 {
	margin-bottom: 5rem;
	text-align: center;
	line-height: 1;
	font-size: 2.4rem;
}

.youtube-section .youtube-container {
  width: 100%;
  height: 100%;
  margin: 0 auto;
}

.youtube-section iframe {
	width: 100%;
	height: 100%;
	aspect-ratio: 16 / 9;
}

@media screen and (max-width: 743px) {
	.youtube-section h2 {
		font-size: 1.8rem;
	}
	.youtube-section iframe {
		width: 100%;
		height: 100%;
		aspect-ratio: 9 / 16;
	}
}

/* benefits
====================================================================== */
.benefits {
	position: relative;
	background-color: var(--color-theme);
	width: 100%;
}

.benefits-inner {
	background-color: #fff;
	padding: 3rem;
	width: 45%;
	margin-inline: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.benefits-left {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 18%;
	aspect-ratio: 1/1;
	font-size: 2.7rem;
	font-weight: 700;
	border-radius: 50%;
	background: linear-gradient(140deg, #e0e0e0 0%, #adadad 100%);
	color: var(--color-theme);
	text-align: center;
	line-height: 1.2;
}

.benefits-right {
	text-align: center;
	font-weight: 600;
	width: 75%;
	font-size: 1.8rem;
	color: var(--color-theme);
	line-height: 1.8;
}

.benefits-right p {
	text-align: left;
}

.benefits-right a {
	width: fit-content;
	display: inline-block;
	padding: 1rem 6rem;
	text-decoration: none;
	background-color: var(--color-theme);
	color: #fff;
	margin-inline: auto;
	margin-top: 2rem;
}

.benefits-right a:hover {
	opacity: 0.75;
}

@media screen and (max-width: 743px) {
	.benefits {
		position: relative;
		background-color: var(--color-theme);
		width: 100%;
		padding-inline: 30px;
	}
	
	.benefits-inner {
		background-color: #fff;
		padding: 2rem;
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-direction: column;
		gap: 2rem;
	}
	
	.benefits-left {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 40%;
		aspect-ratio: 1/1;
		font-size: 2.7rem;
		font-weight: 700;
		border-radius: 50%;
		background: linear-gradient(140deg, #e0e0e0 0%, #adadad 100%);
		color: var(--color-theme);
		text-align: center;
		line-height: 1.2;
	}
	
	.benefits-right {
		text-align: center;
		font-weight: 600;
		width: 100%;
		font-size: 1.7rem;
		color: var(--color-theme);
		line-height: 1.8;
	}
	
	.benefits-right p {
		text-align: left;
	}
	
	.benefits-right a {
		width: fit-content;
		display: inline-block;
		padding: 1rem 6rem;
		text-decoration: none;
		background-color: var(--color-theme);
		color: #fff;
		margin-inline: auto;
		margin-top: 2rem;
	}
	
	.benefits-right a:hover {
		opacity: 0.75;
	}
}



/* concept-section
====================================================================== */
.concept-section {
	position: relative;
	padding: 7rem 0 10rem;
	background-color: #fff;
	line-height: calc(40 / 16);
	z-index: 2;
}
.concept-section h2 {
	margin-bottom: 5rem;
	text-align: center;
	line-height: 1;
}
.concept-section h2 img {
	width: 14.5rem;
}
.concept-section .main {
	margin-bottom: 31rem;
}
.concept-section .main h3 {
	margin-bottom: 5rem;
}
.concept-section .main h3 img {
	width: 43.2rem;
}
.concept-section .main p {
	font-weight: 600;
}
@media screen and (min-width: 744px), print {
	.concept-section .main {
		padding-left: 5rem;
	}
	.concept-section .main .img {
		position: absolute;
		right: -8em;
		bottom: -16rem;
		width: 40rem;
	}
	.concept-section .main p {
		width: 54rem;
		margin-left: 1rem;
	}
	.-dv-tab .concept-section .main .img {
		right: 0;
	}
}
@media screen and (max-width: 743px) {
	.concept-section {
		overflow: hidden;
		padding: 7rem 0 6rem;
		line-height: calc(40 / 16);
	}
	.concept-section h2 {
		margin-bottom: 5rem;
	}
	.concept-section h2 img {
		width: calc(14.5rem * .75);
	}
	.concept-section .main {
		margin-bottom: 8rem;
	}
	.concept-section .main h3 {
		margin-bottom: 3rem;
	}
	.concept-section .main h3 img {
		width: 100%;
	}
	.concept-section .main .img {
		width: 26rem;
		margin: 3rem auto 0;
	}
}

.concept-section .front {
	margin-bottom: 16rem;
	font-size: 3rem;
	line-height: 2;
	font-weight: 600;
}
@media screen and (min-width: 744px), print {
	.concept-section .front > * {
		margin-left: calc(50% + 10rem);
	}
	.concept-section .front h3 {
		width: 43.2rem;
		margin-bottom: 3rem;
	}
/*
	.concept-section .front h3 img {
		max-width: none;
	}
*/
	.concept-section .front .img {
		position: absolute;
		left: calc(50% - 90.5rem);
		top: -51.5rem;
		width: 112rem;
		height: 112rem;
		margin: 0;
		z-index: -1;
	}
}
@media screen and (max-width: 743px) {
	.concept-section .front {
		position: relative;
		padding-bottom: 38rem;
		margin-bottom: 6rem;
		font-size: 2.2rem;
	}
	.concept-section .front .img {
		position: absolute;
		bottom: -3rem;
		right: -18rem;
		left: -12rem;
		z-index: -1;
	}
	.concept-section .front h3 {
		margin-bottom: 2rem;
	}
	.concept-section .front h3 img {
		width: 100%;
	}
}

.concept-section .contents {
	position: relative;
	overflow: hidden;
}
.concept-section .contents section + section {
	margin-top: 6rem;
}
.concept-section .contents .ph {
	position: relative;
}
.concept-section .contents .ph .light {
	display: block;
}
/* .concept-section .contents .ph .light::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: calc(170 / 497 * 100%);
	background: linear-gradient(180deg, rgba(240, 172, 104, 0.4) 0%, rgba(248, 237, 220, 0) 60.55%);
} */
.concept-section .contents .-sec1 .ph {
	clip-path: polygon(0 calc(58 / 497 * 100%), 100% 0, 100% 100%, 0 calc(100% - (30 / 497 * 100%)));
}
.concept-section .contents .-sec2 .ph {
	clip-path: polygon(0 0, 100% calc(56 / 497 * 100%), 100% calc(100% - (32 / 497 * 100%)), 0 100%);
}
.concept-section .contents .ph .light::after {
	content: "";
	position: absolute;
	top: 0;
	width: calc(720 / 658 * 100%);
	aspect-ratio: 1;
	background: radial-gradient(40.32% 40.32% at 50% 50%, rgba(244, 131, 18, 0.86) 0%, rgba(238, 128, 19, 0.27) 47.5%, rgba(242, 147, 52, 0) 100%);
	mix-blend-mode: screen;
}
.concept-section .contents .-sec1 .ph .light::after {
	right: 0;
	transform: translate(50%, -50%);
}
.concept-section .contents .-sec2 .ph .light::after {
	left: 0;
	transform: translate(-50%, -50%);
}
.concept-section .contents .ph .caption {
	bottom: 2rem;
}
.concept-section .contents .-sec2 .ph .caption {
	bottom: 8%;
}


.concept-section .contents h3 {
	margin-bottom: 4rem;
}
.concept-section .contents h3 span {
	display: block;
	margin-top: 2rem;
	font-size: 1.6rem;
	line-height: 1.5;
	font-weight: 500;
}
.concept-section .contents .lead {
	margin-bottom: 4rem;
	font-size: 2.4rem;
	line-height: calc(40 / 24);
	font-weight: 600;
}
@media screen and (min-width: 744px), print {
	.concept-section .contents .ph {
		width: 65.8rem;
	}
	.concept-section .contents .-sec1 {
		padding-left: 10rem;
	}
	.concept-section .contents .-sec1 .ph {
		float: right;
		/* margin-left: 7rem; */
	}
	.concept-section .contents .-sec1 h3 {
		padding-top: 9.5rem;
	}
	.concept-section .contents .-sec1 h3 img {
		width: 35rem;
	}
	.concept-section .contents .-sec1 .lead ~ p {
		width: 46rem;
	}
	.concept-section .contents .-sec2 .ph {
		float: left;
		margin-right: 7rem;
	}
	.concept-section .contents .-sec2 h3 {
		padding-top: 14.5rem;
	}
	.concept-section .contents .-sec2 h3 img {
		width: 20rem;
	}
	.concept-section .contents .-sec2 .lead ~ p {
		margin-right: 18rem;
		margin-left: 33rem;
	}
}
@media screen and (max-width: 743px) {
	.concept-section .contents section + section {
		margin-top: 3rem;
	}
	.concept-section .contents h3 {
		margin-bottom: 2rem;
		margin-top: 1rem;
	}
	.concept-section .contents h3 img {
		width: auto;
		height: 3.6rem;
	}
	.concept-section .contents h3 span {
		margin-top: 1rem;
		font-size: 1.3rem;
	}
	.concept-section .contents .lead {
		margin-bottom: 2rem;
		font-size: 1.8rem;
	}
	.concept-section .contents .-sec1 .ph {
		margin-left: var(--sp-base-padding);
	}
	.concept-section .contents .-sec2 .ph {
		margin-right: var(--sp-base-padding);
	}
	.concept-section .contents .-sec2 h3 {
		width: fit-content;
		margin-left: auto;
	}
	.concept-section .contents .-sec2 .lead {
		text-align: right;
	}
	.concept-section .contents .-sec2 .ph .caption {
		bottom: 10%;
	}
}


/* location-section
====================================================================== */
.location-section {
	position: relative;
	color: #fff;
	padding-bottom: 4rem;
	z-index: 2;
}
.location-section .main {
	position: relative;
	padding-top: 11.5rem;
	text-align: center;
}
.location-section .main h2 {
	margin-bottom: 7rem;
	line-height: 1;
}
.location-section .main h2 img {
	width: 16rem;
}
.location-section .main .experiences {
	margin-bottom: 3rem;
}
.location-section .main .experiences img {
	width: 45rem;
}
.location-section .main .lead {
	font-size: 3rem;
	line-height: calc(50 / 30);
}
.location-section .main .img {
	margin-top: 5rem;
}
.location-section .main .img img {
	width: 94rem;
}
.location-section .main .access {
	margin-top: 5rem;
	font-size: 1.6rem;
	line-height: 1.5;
}
.location-section .main .access dl {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	text-align: left;
	margin-bottom: 0.5rem;
}
.location-section .main .access dt {
	position: relative;
	overflow: hidden;
	width: calc(100% - 11rem);
	font-size: 2rem;
}
.location-section .main .access dt > span {
	display: inline-block;
	position: relative;
	padding-right: 2rem;
}
.location-section .main .access dt > span::after {
	content: "";
	position: absolute;
	left: 100%;
	width: 100rem;
	bottom: 0.7em;
	border-top: 1px solid;
	opacity: 0.5;
}
.location-section .main .access .time {
	display: flex;
	align-items: end;
	width: 11rem;
	white-space: nowrap;
	letter-spacing: 0;
}
.location-section .main .access .time .num {
	flex-shrink: 0;
	width: 8rem;
	text-align: center;
	font-size: 4rem;
	line-height: 1;
}
.location-section .main .access .use {
	width: 100%;
	margin-top: 0.5rem;
	padding-top: 0.8rem;
	font-size: 1.5rem;
	border-top: 1px solid rgba(255, 255, 255, 0.5);
	font-weight: 400;
}
.location-section .main .phs {
	overflow: hidden;
	position: absolute;
	right: 0;
	left: 0;
	bottom: 0;
	top: 0;
	pointer-events: none;
}
.location-section .main .phs p {
	position: absolute;
	pointer-events: auto;
	z-index: 3;
}
.location-section .main .phs .ph01 img {
	clip-path: polygon(0 0, 100% calc(40 / 212 * 100%), 100% 100%, 0 calc(100% - (10 / 212 * 100%)));
}
.location-section .main .phs .ph02 img {
	clip-path: polygon(0 0, 100% calc(20 / 206 * 100%), 100% calc(100% - (20 / 206 * 100%)), 0 100%);
}
.location-section .main .phs .ph03 img {
	clip-path: polygon(0 calc(32 / 386 * 100%), 100% 0, 100% calc(100% - (80 / 386 * 100%)), 0 100%);
}
.location-section .main .phs .ph04 img {
	clip-path: polygon(0 calc(76 / 346 * 100%), 100% 0, 100% calc(100% - (40 / 346 * 100%)), 0 100%);
}
.location-section .main .phs .ph05 img {
	clip-path: polygon(0 calc(24 / 228 * 100%), 100% 0, 100% 100%, 0 calc(100% - (14 / 228 * 100%)));
}
.location-section .main .phs .ph01 .caption {
	bottom: 5%;
}
.location-section .main .phs .ph02 .caption {
	bottom: 12%;
}
.location-section .main .phs .ph03 .caption {
	bottom: 22%;
}
.location-section .main .phs .ph04 .caption {
	right: auto;
	left: 1em;
	/* bottom: 14%; */
	bottom: 6%;
}
.location-section .main .phs .ph05 .caption {
	right: auto;
	left: 1em;
	/* bottom: 4%; */
	bottom: 9%;
}
@media screen and (min-width: 744px), print {
	.location-section .main .access {
		padding: 0 6.5rem;
	}
	.location-section .main .access .item {
		position: relative;
		left: 19rem;
		display: flex;
		flex-wrap: wrap;
		gap: 1rem 4rem;
	}
	@media screen and (min-width: 1000px) {
		.location-section .main .access .item {
			left: 20rem;
			gap: 1rem 5rem;
		}
	}
	.location-section .main .access dl {
		width: 29rem;
	}
	.location-section .main .phs {
		top: -4rem;
		bottom: -10rem;
	}
	.location-section .main .phs .ph01 {
		top: 12.5rem;
		left: calc(50% - 60rem);
		width: 28.4rem;
	}
	.location-section .main .phs .ph02 {
		top: 36rem;
		left: calc(50% - 75rem);
		width: 29rem;
	}
	.location-section .main .phs .ph03 {
		top: 62.5rem;
		left: calc(50% - 85.4rem);
		width: 47rem;
	}
	.location-section .main .phs .ph04 {
		top: 0;
		right: calc(50% - 82.4rem);
		width: 44rem;
	}
	.location-section .main .phs .ph05 {
		top: 40rem;
		right: calc(50% - 80rem);
		width: 32rem;
	}
}
@media screen and (max-width: 743px) {
	.location-section {
		padding-bottom: 2rem;
	}
	.location-section .main {
		padding-top: 6rem;
		padding-bottom: 6rem;
	}
	.location-section .main h2 {
		margin-bottom: 4rem;
	}
	.location-section .main h2 img {
		width: calc(16rem * .75);
	}
	.location-section .main .experiences img {
		width: calc(45rem * .7);
	}
	.location-section .main .lead {
		font-size: 1.8rem;
	}
	.location-section .main .img {
		overflow: hidden;
		margin-top: 3rem;
	}
	.location-section .main .img img {
		display: block;
		width: 120vw;
		max-width: none;
		margin-left: -22vw;
	}
	.location-section .main .access {
		width: 22rem;
		margin: 3rem auto 0;
		font-size: 1.3rem;
	}
	.location-section .main .access dt {
		width: calc(100% - 10rem);
		font-size: 1.3rem;
	}
	.location-section .main .access dt > span {
		padding-right: 1rem;
	}
	.location-section .main .access .time {
		width: 10rem;
	}
	.location-section .main .access .time .num {
		width: 6rem;
		font-size: 3rem;
	}
	.location-section .main .access .use {
		margin-top: 0.3rem;
		padding-top: 0.5rem;
		font-size: 1rem;
	}
	.location-section .main .phs {
		top: -4rem;
		bottom: -15rem;
	}
	.location-section .main .phs .ph01 {
		top: 5rem;
		left: calc(50% - 18rem);
		width: calc(28.4rem / 3);
	}
	.location-section .main .phs .ph02 {
		bottom: 14rem;
		left: calc(50% - 19rem);
		width: calc(29rem / 3);
	}
	.location-section .main .phs .ph03 {
		bottom: 0;
		left: calc(50% - 19rem);
		width: calc(47rem / 3);
	}
	.location-section .main .phs .ph04 {
		top: 0;
		right: calc(50% - 24rem);
		width: calc(44rem / 3);
	}
	.location-section .main .phs .ph05 {
		bottom: 12rem;
		right: calc(50% - 18rem);
		width: calc(32rem / 3);
	}
	.location-section .main .phs .caption {
		right: 0.5em;
		transform-origin: 100% 0;
		transform: scale(.8);
	}
	.location-section .main .phs .ph04 .caption,
	.location-section .main .phs .ph05 .caption {
		transform-origin: 0 0;
		left: 0.5em;
	}
}

.location-section .contents {
	margin-top: 11rem;
	line-height: calc(40 / 16);
}
.location-section .contents h3 {
	margin-bottom: 4rem;
	font-size: 2.4rem;
	line-height: calc(40 / 24);
	font-weight: 500;
}
.location-section .contents .ph img {
	clip-path: polygon(0 calc(42 / 415 * 100%), 100% 0, 100% 100%, 0 calc(100% - (42 / 415 * 100%)));
}
.location-section .contents .ph .caption {
	bottom: 4%;
}
@media screen and (min-width: 744px), print {
	.location-section .contents {
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;
	}
	.location-section .contents .ph {
		width: 58rem;
		margin-right: -5rem;
		padding-top: 3rem;
	}
	.location-section .contents .txt {
		width: calc(100% - 58rem + 5rem - 3rem);
	}
}
@media screen and (max-width: 743px) {
	.location-section .contents {
		margin-top: 8rem;
		line-height: calc(40 / 16);
	}
	.location-section .contents .ph {
		margin-left: calc(var(--sp-base-padding) * 2);
	}
	.location-section .contents h3 {
		margin-bottom: 2rem;
		font-size: 1.8rem;
		line-height: 1.8;
	}
	.location-section .contents .txt {
		padding: 0 var(--sp-base-padding);
	}
}
.location-section .bottom-image {
	position: relative;
	overflow: hidden;
}
.location-section .bottom-image .ph {
	clip-path: polygon(0 0, 100% calc(27 / 271 * 100%), 100% calc(100% - (27 / 271 * 100%)), 0 100%);
}
.location-section .bottom-image .ph .caption {
	bottom: 13%;
}
.location-section .bottom-image .img .caption {
	position: static;
	display: block;
	margin-top: 1em;
	text-align: right;
}
@media screen and (min-width: 744px), print {
	.location-section .bottom-image ._w {
		display: flex;
		align-items: start;
	}
	.location-section .bottom-image .ph {
		width: 38rem;
		margin-left: -16rem;
	}
	.location-section .bottom-image .img {
		width: 98.4rem;
		margin-right: -10.4rem;
		padding-top: 7rem;
	}
}
@media screen and (max-width: 743px) {
	.location-section .bottom-image {
		margin-top: 2rem;
	}
	.location-section .bottom-image .ph {
		margin-right: calc(var(--sp-base-padding) * 4);
	}
	.location-section .bottom-image .img img {
		width: 120%;
		max-width: none;
	}
	.location-section .bottom-image .img .caption {
		margin-top: 0;
		padding-right: 1em;
	}
}

/* gradient-bg
====================================================================== */
.gradient-bg {
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--color-theme);
	pointer-events: none;
	user-select: none;
	z-index: -1;
}
.gradient-bg::before,
.gradient-bg::after {
	content: "";
	position: absolute;
	width: 135.4rem;
	height: 135.4rem;
	background: radial-gradient(40.32% 40.32% at 50% 50%, rgba(245, 245, 245, 0.86) 0%, rgba(249, 249, 249, 0.27) 47.5%, rgba(255, 255, 255, 0) 100%);
	opacity: 0.4;
	mix-blend-mode: screen;
}
.gradient-bg::before {
	left: -59.6rem;
	top: -59.6rem;
}
.gradient-bg::after {
	left: -47.8rem;
	bottom: -47.8rem;
}
@media screen and (max-width: 743px) {
	.gradient-bg::before,
	.gradient-bg::after {
		width: 50rem;
		height: 50rem;
	}
	.gradient-bg::before {
		left: -20rem;
		top: -20rem;
	}
	.gradient-bg::after {
		left: -25rem;
		bottom: -25rem;
	}
}


/* break-image
====================================================================== */
.break-image {
	position: relative;
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
.break-image .bg {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	user-select: none;
	z-index: -1;
}
.break-image.-break1 {
	height: 98rem;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 3rem;
	line-height: calc(50 / 30);
	font-weight: 500;
	color: #fff;
	letter-spacing: 0.15em;
}
.break-image.-break2 {
	height: 52rem;
}
.break-image .caption {
	right: 3em;
	bottom: 2em;
}
@media screen and (min-width: 744px), print {
	.break-image.-break1 dl {
		width: 90rem;
	}
	.break-image.-break1 dt {
		width: 30.2rem;
	}
	.break-image.-break1 dd {
		margin-top: 4rem;
		margin-left: 0.5rem;
	}
}
@media screen and (max-width: 743px) {
	.break-image.-break1 {
		height: 100vh;
		height: 100svh;
		font-size: 2rem;
	}
	.break-image.-break1 dt {
		width: calc(30.2rem * .75);
	}
	.break-image.-break1 dd {
		margin-top: 3rem;
		margin-left: 0.5rem;
	}
	.break-image.-break2 {
		position: relative;
		height: 80vw;
		clip-path: none;
	}
	.break-image.-break2 .bg {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		user-select: none;
		z-index: -1;
	}
	.break-image .caption {
		right: 1em;
		bottom: 1em;
	}
}

/* plan-section
====================================================================== */
.plan-section {
	position: relative;
	z-index: 2;
}
.plan-section .main {
	position: relative;
	padding-top: 7rem;
	text-align: center;
}
.plan-section .main h2 {
	line-height: 1;
}
.plan-section .main h2 img {
	width: 28.4rem;
}
.plan-section .main .lead {
	margin: 7rem 0 3rem;
	font-size: 2.4rem;
	line-height: calc(40 / 24);
	font-weight: 600;
}
.plan-section .main .imgs {
	position: relative;
	display: flex;
	justify-content: space-between;
	margin-top: 4rem;
}
.plan-section .main .imgs li:not(.caption) {
	position: relative;
	width: 26rem;
}
.plan-section .main .imgs li .txt {
	position: absolute;
	right: 1.4rem;
	top: 2rem;
	width: 1.8rem;
}
.plan-section .main .imgs .img-caption {
	right: 0;
	top: calc(100% + .7em);
}
.plan-section .main .bg {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 9rem;
	pointer-events: none;
	user-select: none;
	z-index: -1;
}
.plan-section .main .bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
@media screen and (max-width: 743px) {
	.plan-section .main h2 img {
		width: calc(28.4rem * .75);
	}
	.plan-section .main .lead {
		margin: 4rem 0 2rem;
		font-size: 1.6rem;
	}
	.plan-section .main .imgs {
		display: flex;
		flex-wrap: wrap;
		padding: 0 var(--sp-base-padding);
		gap: 1rem;
		margin-top: 4rem;
	}
	.plan-section .main .imgs li:not(.caption) {
		width: calc((100% - 1rem) / 2);
	}
	.plan-section .main .imgs li .txt {
		right: .8rem;
		top: 1.2rem;
		width: 1.2rem;
	}
	.plan-section .main .imgs .img-caption {
		right: var(--sp-base-padding);
	}
}
.plan-section .floor {
	position: relative;
	padding: 10rem 0;
	color: #fff;
}
.plan-section .floor dl {
	display: flex;
	line-height: 1.6;
}
.plan-section .floor dl + dl {
	margin-top: 5rem;
}
.plan-section .floor dt {
	width: 6rem;
	flex-shrink: 0;
}
.plan-section .floor dt img {
	width: 3.8rem;
}
.plan-section .floor dd .ph {
	position: relative;
}
.plan-section .floor dd .caption {
	bottom: 1em;
}
.plan-section .floor dd .comment {
	display: block;
	margin-top: 1.5rem;
	letter-spacing: 0.15em;
}
.plan-section .floor .gradient-bg {
	top: -9rem;
}
@media screen and (min-width: 744px), print {
	.plan-section .floor ._w {
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;
	}
	.plan-section .floor .map {
		width: 39.9rem;
		padding-top: 5rem;
	}
	.plan-section .floor .contents {
		width: 60rem;
	}
}
@media screen and (max-width: 743px) {
	.plan-section .floor {
		padding: 5rem var(--sp-base-padding);
	}
	.plan-section .floor .map {
		width: 24rem;
		margin: 0 auto 4rem;
	}
	.plan-section .floor dl + dl {
		margin-top: 4rem;
	}
	.plan-section .floor dt {
		width: 4rem;
	}
	.plan-section .floor dt img {
		width: 2.5rem;
	}
	.plan-section .floor dd .comment {
		margin-top: 1.5rem;
	}
}

/* roomplan_btn === */
.roomplan_btn {
  margin-bottom: 10rem;
}
.roomplan_btn a {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 50.5rem;
	height: 10rem;
	margin-inline: auto;
	font-size: 2.4rem;
	line-height: 1.5;
	font-weight: 600;
	text-decoration: none;
	color:  var(--color-theme);  
	background:#fff;
	z-index: 3;
}
@media (hover) {
  .roomplan_btn a:hover{
    opacity: 0.3;
  }
}
@media screen and (max-width: 743px) {
.roomplan_btn{
    margin-bottom: 4rem;
  }  
.roomplan_btn a {
		width: 100%;
    max-width: 26rem;
		height: 6rem;
		font-size: 1.8rem;
	}
}

/* life-information-section
====================================================================== */
.life-information-section {
	position: relative;
	padding: 13.5rem 0 7rem;
	background-color: #a6eaef;
	font-size: 1.4rem;
	line-height: calc(32 / 14);
	letter-spacing: 0.05em;
	z-index: 2;
}
.life-information-section h2 {
	margin-bottom: 6rem;
	line-height: 1;
	text-align: right;
}
.life-information-section h2 img {
	width: 29.2rem;
}
.life-information-section .txt1 p {
	margin-bottom: 2em;
}
.life-information-section dl {
	overflow: hidden;
	position: relative;
	display: flex;
	justify-content: space-between;
	padding-left: 1.2em;
}
.life-information-section dl::before {
	content: "●";
	position: absolute;
	top: 0;
	left: 0;
	color: var(--color-theme-dark);
}
.life-information-section dt {
	position: relative;
	overflow: hidden;
	flex-grow: 1;
}
.life-information-section dt span {
	position: relative;
	display: inline-block;
}
.life-information-section dt span::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 42rem;
	left: calc(100% + .3em);
	background-image : linear-gradient(to right, #759c9f 2px, transparent 2px, transparent 4px);
	background-size: 4px 2px;
	background-position: 0;
	background-repeat: repeat-x;
}
.life-information-section dd {
	position: relative;
	padding-left: 0.3em;
	letter-spacing: 0;
	z-index: 2;
}
.life-information-section .map {
	margin-top: 4rem;
	background-color: #fff;
}
.life-information-section .map a {
	position: relative;
	display: block;
}
.life-information-section .map a span {
	position: absolute;
	right: 1.5em;
	bottom: 1em;
	padding-left: 1em;
	line-height: 1.6;
	border-bottom: 1px solid;
}
.life-information-section .map a span::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: .6rem;
	height: .6rem;
	border-top: 1px solid;
	border-right: 1px solid;
	transform-origin: 100% 0;
	transform: rotate(45deg);
}
@media (hover) {
	.life-information-section .map a:hover span {
		border-bottom-color: rgba(0,0,0,0);
	}
	.life-information-section .map a img {
		transition: opacity var(--transition);
	}
	.life-information-section .map a:hover img {
		opacity: 0.5;
	}
}
@media screen and (min-width: 744px), print {
	.life-information-section .contents {
		display: flex;
		flex-wrap: wrap;
		flex-direction: row-reverse;
		justify-content: space-between;
		width: 85.8rem;
		margin-left: auto;
	}
	.life-information-section h2,
	.life-information-section .map {
		width: 100%;
	}
	.life-information-section .txt1 {
		width: 40rem;
	}
	.life-information-section .txt2 {
		width: 42rem;
	}
	.life-information-section .bg {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: -1;
	}
	.life-information-section .bg img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		pointer-events: none;
		user-select: none;
	}
	.life-information-section .bg .caption {
		right: 3em;
		bottom: 2em;
		line-height: 1.6;
	}
}
@media screen and (max-width: 743px) {
	.life-information-section {
		padding: 7rem 0 0;
		font-size: 1.2rem;
	}
	.life-information-section ._w {
		padding: 0 var(--sp-base-padding);
		z-index: 2;
	}
	.life-information-section h2 {
		margin-bottom: 4rem;
		text-align: center;
	}
	.life-information-section h2 img {
		width: calc(29.2rem * .75);
	}
	.life-information-section dt {
		letter-spacing: 0;
	}
	.life-information-section .map {
		margin-top: 2rem;
	}
	.life-information-section .map a span {
		right: 0;
		bottom: auto;
		top: calc(100% + 1rem);
		line-height: 1.6;
		font-size: 1.1rem;
	}
	.life-information-section .bg {
		position: relative;
		overflow: hidden;
		margin-top: -4rem;
	}
	.life-information-section .bg img {
		max-width: none;
		width: 125%;
	}
	.life-information-section .bg .caption {
		right: 1em;
		bottom: 1em;
		line-height: 1.6;
	}
}

/* quality-section
====================================================================== */
.quality-section {
	position: relative;
	padding-top: 12.5rem;
	background-color: var(--color-theme);
	color: #fff;
}
.quality-section h2 {
	width: 31rem;
}
.quality-section header p {
	margin-block: 4rem 2rem;
	font-size: 3rem;
	line-height: calc(50 / 30);
	letter-spacing: 0.1em;
	font-weight: 500;
}
.quality-section .phs dl {
	position: relative;
}
.quality-section .phs dt {
	position: absolute;
	top: 0.8em;
	left: 1.5em;
	font-size: 1.4rem;
	line-height: 1.5;
}
.quality-section .phs ul {
	display: flex;
	flex-wrap: wrap;
}
.quality-section .phs li {
	width: 50%;
}
.quality-section .phs img {
	width: 100%;
}
@media screen and (min-width: 744px), print {
	.quality-section .contents {
		margin-bottom: 7.5rem;
		padding-bottom: 3rem;
	}
	.quality-section .contents > p {
		width: 62rem;
	}
	.quality-section .logo {
		position: absolute;
		right: 0;
		bottom: 0;
		width: 8.8rem;
	}
	.quality-section .phs {
		display: flex;
	}
	.quality-section .phs > * {
		width: 50%;
	}
}
@media screen and (max-width: 743px) {
	.quality-section {
		padding-top: 7rem;
	}
	.quality-section .contents {
		padding: 0 var(--sp-base-padding) 3rem;
	}
	.quality-section h2 {
		width: calc(31rem * .75);
	}
	.quality-section header p {
		margin-block: 4rem 2rem;
		font-size: 2.2rem;
	}
	.quality-section .logo {
		width: 6rem;
		margin: 2rem 0 0 auto;
	}
	.quality-section .phs dt {
		left: 1em;
		font-size: 1.1rem;
	}
}

/* preview-ad
====================================================================== */
.preview-ad {
	padding: 7rem 0 6rem;
	background-color: var(--color-theme);
	color: #fff;
	text-align: center;
}
.preview-ad h2 {
	margin-bottom: 1em;
	font-size: 2.4rem;
	line-height: 1.5;
}
@media screen and (max-width: 743px) {
	.preview-ad {
		padding: 5rem 0 3rem;
	}
	.preview-ad h2 {
		font-size: 2rem;
	}
}

/* information
====================================================================== */
.information {
	padding-top: 10rem;
  padding-bottom: 5rem;
	background-color: var(--color-theme);
	color: #fff;
	text-align: center;
}
.information h2 {
	margin-bottom: 1.5em;
	font-size: 3.6rem;
}
.information h2 small{
	margin-bottom: 1.5em;  
	font-size: 2.4rem;
}
.information h3 {
  position: relative;
  padding-bottom: 2rem;
  margin-bottom: 5rem;
}
.information h3 img {
  width: 90%;
  max-width: 55.1rem;
  margin-right: auto;
  margin-left: auto;
}
.information h3::after{
  position: absolute;
  content:"";
  left: 0;
  right: 0;
  bottom: -2rem;
  margin: 0 auto;
  height: 1px;
  width: 80%;
  max-width: 619px;
  background-color: #fff;
}
.information p{
  font-size: 1.8rem;
  line-height: 1.8333;
	letter-spacing: 0.2em;  
}

@media screen and (max-width: 743px) {
	.information {
		padding-top: 5rem;
    padding-bottom: 3rem;
	}
	.information h2 {
		font-size: 3rem;
	}
	.information h2 small {
		font-size: 2rem;
	} 
  .information h3 {
    padding-bottom: 1rem;
  }
  .information p{
    font-size: 1.7rem;
    letter-spacing: 0.1em;  
  }
  
}

/* property-outline
====================================================================== */
.property-outline {
	padding: 7rem 0 15rem;
	background-color: var(--color-theme);
	color: #fff;
	text-align: center;
}
.property-outline h2 {
	margin-bottom: 2em;
	font-size: 2.4rem;
	line-height: 1.5;
}
.property-outline table {
	width: 100%;
	margin: 0 auto;
}
.property-outline table th,
.property-outline table td {
	padding-block: 1.2rem;
	background-color: #fff;
	border: 1px solid var(--color-theme);
	color: var(--color-theme);
	line-height: 2;
	vertical-align: top;
}
.property-outline table th {
	width: 20.8rem;
	text-align: center;
}
.property-outline table td {
	padding-inline: 4rem;
	text-align: left;
}
.property-outline .notes {
	text-align: left;
	margin-top: 2em;
	font-size: 1.2rem;
	line-height: calc(22 / 12);
}
@media screen and (max-width: 743px) {
	.property-outline {
		padding: 5rem 0 6rem;
	}
	.property-outline h2 {
		margin-bottom: 1.5em;
		font-size: 2rem;
	}
	.property-outline table {
		width: 100%;
		margin: 0 auto;
	}
	.property-outline table th,
	.property-outline table td {
		padding-block: 1rem;
	}
	.property-outline table th {
		width: 33%;
	}
	.property-outline table td {
		padding-inline: 1rem;
	}
	.property-outline .notes {
		margin-top: 1em;
		font-size: 1rem;
	}
}

/* opening
====================================================================== */
@media screen {
	.view_opening #header {
		transform: translateY(-110%);
	}
  .view_opening #header .gnav .new::after {
		transform: translateY(-110%);
	}
	.view_opening #footer {
		display: none;
	}
	.view_opening #container {
		position: absolute;
		width: 100%;
		left: -9999em;
		top: -9999em;
		opacity: 0;
	}
	.view_opening .index-main .content {
		opacity: 0;
		transform: translateY(.5rem);
	}
	.view_opening .index-main .btn-fit {
		opacity: 0;
		transform: translateY(.5rem);
	}  
	.view_opening .index-main figure {
		opacity: 0;
	}

	#opening {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: var(--color-theme);
		pointer-events: none;
		z-index: -1;
	}
	#opening > * {
		opacity: 0;
	}
	#opening .logo_fujii {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#opening .logo_fujii > div {
		width: 21rem;
	}
	#opening .circle {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 140rem;
		height: 140rem;
		transform: translate(-50%, -50%);
		mix-blend-mode: screen;
		opacity: 0.5;
		z-index: 1;
	}
	#opening .circle::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: radial-gradient(40.32% 40.32% at 50% 50%, rgba(245, 245, 245, 0.86) 0%, rgba(249, 249, 249, 0.27) 47.5%, rgba(255, 255, 255, 0) 100%);
		opacity: 0;
	}
	#opening .square {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 72rem;
		height: 72rem;
		transform: translate(-50%, -50%);
		z-index: 2;
	}
	#opening .square::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: var(--color-theme);
		transform: rotate(45deg);
	}
	#opening .map {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 219.8rem;
		transform: translate(-50%, -55%);
		z-index: 3;
	}
	#opening .circle.c2 {
		width: 80rem;
		height: 80rem;
		opacity: 1;
		z-index: 4;
	}
	#opening .circle.c2.-d1 {
		transform: translate(-60%, -50%);
	}
	#opening .circle.c2.-d2 {
		transform: translate(-40%, -50%);
	}
	#opening .circle.c2.-d3 {
		transform: translate(-50%, -60%);
	}
	#opening .circle.c2.-d4 {
		transform: translate(-50%, -40%);
	}
	#opening .logo1 {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 28.4rem;
		transform: translate(-50%, -60%);
		z-index: 7;
	}
	#opening .wbox {
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		background-color: #fff;
		opacity: 0;
		z-index: 6;
	}
	#opening .imgs {
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		opacity: 1;
		z-index: 6;
	}
	#opening .imgs > * {
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		opacity: 0;
	}
	#opening .imgs > * > * {
		position: absolute;
	}
	#opening .imgs .caption {
		right: 1em;
		bottom: 1em;
	}
	@media (max-width: 743px) {
		#opening .imgs .caption {
			font-size: 0.3rem;
		}
	}
	#opening .imgs .img1 > * {
		width: calc(468 / 1900 * 100%);
		left: calc(970 / 1900 * 100%);
		bottom: calc(800 / 1000 * 100%);
	}
	#opening .imgs .img2 > * {
		width: calc(206 / 1900 * 100%);
		left: calc(1550 / 1900 * 100%);
		bottom: calc(820 / 1000 * 100%);
	}
	#opening .imgs .img3 > * {
		width: calc(420 / 1900 * 100%);
		left: calc(1430 / 1900 * 100%);
		bottom: calc(530 / 1000 * 100%);
	}
	#opening .imgs .img4 > * {
		width: calc(288 / 1900 * 100%);
		left: calc(1400 / 1900 * 100%);
		top: calc(624 / 1000 * 100%);
	}
	#opening .imgs .img5 > * {
		width: calc(424 / 1900 * 100%);
		left: calc(875 / 1900 * 100%);
		top: calc(722 / 1000 * 100%);
	}
	#opening .imgs .img6 > * {
		width: calc(668 / 1900 * 100%);
		right: calc(1310 / 1900 * 100%);
		top: calc(280 / 1000 * 100%);
	}
	#opening .imgs .img7 > * {
		width: calc(350 / 1900 * 100%);
		right: calc(1472 / 1900 * 100%);
		top: calc(770 / 1000 * 100%);
	}
	#opening .imgs .img8 > * {
		width: calc(280 / 1900 * 100%);
		right: calc(1560 / 1900 * 100%);
		bottom: calc(780 / 1000 * 100%);
	}
	#opening .ph {
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 7;
	}
	#opening .ph .logo {
		width: 39.2rem;
		filter: brightness(0) invert(1);
	}
	#opening .ph .caption {
		right: 1rem;
		bottom: 1rem;
		line-height: 1.6;
	}
	.-dv-tab #opening .ph4 img {
		object-position: 35%;
	}
	@media (max-width: 743px) {
		#opening .logo_fujii > div {
			width: 11rem;
		}
		#opening .circle {
			width: 70rem;
			height: 70rem;
		}
		#opening .square {
			width: 30rem;
			height: 30rem;
		}
		#opening .map {
			width: 120rem;
		}
		#opening .circle.c2 {
			width: 55rem;
			height: 55rem;
			opacity: .7;
		}
		#opening .logo1 {
			width: 18rem;
		}
		#opening .ph .logo {
			width: 20rem;
		}
		#opening .ph3 img {
			object-position: 50% 100%;
		}
	}

	#opening.logo_show .logo_fujii {
		transition: opacity .3s linear;
		opacity: 1;
	}
	#opening.opening_start .logo_fujii {
		transition: opacity 1s linear;
		opacity: 0;
	}
	#opening .circle.c1::before {
		transform: scale(.8);
	}
	#opening.opening_start .circle.c1::before {
		transition: opacity 1s linear, transform 5s linear;
		transform: scale(2);
		opacity: 1;
	}
	#opening .square::before {
		transform: scale(.5) rotate(45deg);
	}
	#opening.opening_start .square {
		transition: opacity 1s linear;
		opacity: 1;
	}
	#opening.opening_start .square::before {
		transition: transform 5s linear;
		transform: scale(2) rotate(130deg);
	}
	#opening .map > * {
		transform: scale(.8);
	}
	#opening.opening_start .map {
		transition: opacity 2s .2s linear;
		opacity: 1;
	}
	#opening.opening_start .map > * {
		transition: transform 5s cubic-bezier(0.11, 0, 0.5, 0);
		transform: scale(2);
	}
	#opening.opening_start .map img {
		transition: transform 1.5s 2.5s cubic-bezier(0.32, 0, 0.67, 0);
		transform: scale(1.2);
	}
	#opening.opening_start .circle.c2::before {
		transition: opacity 2s .2s linear;
		opacity: 1;
	}
	#opening.opening_start .logo1 {
		transition: opacity 1s .4s linear;
		opacity: 1;
	}

	#opening .imgs > * {
		transform: scale(.2);
	}
	#opening.opening_start .imgs > * {
		transition: opacity 1s 1.5s linear, transform 4.5s 1.5s cubic-bezier(0.33, 1, 0.68, 1);
		transform: scale(1);
		opacity: 1;
	}
	#opening.opening_start .imgs .img2 {
		transition-delay: 1.6s;
	}
	#opening.opening_start .imgs .img5 {
		transition-delay: 1.7s;
	}
	#opening.opening_start .imgs .img8 {
		transition-delay: 1.8s;
	}
	#opening.opening_start .imgs .img7 {
		transition-delay: 1.9s;
	}
	#opening.opening_start .imgs .img3 {
		transition-delay: 2s;
	}
	#opening.opening_start .imgs .img6 {
		transition-delay: 2.1s;
	}
	#opening.opening_start .imgs .img4 {
		transition-delay: 2.2s;
	}
	#opening.opening_start .wbox {
		transition: opacity 1s 3s linear;
		opacity: 1;
	}
	#opening.opening_start .imgs {
		transition: transform 1s 3.5s cubic-bezier(0.5, 0, 0.75, 0), opacity .5s 4s linear;
		transform: scale(2);
		opacity: 0;
	}
	#opening.opening_start .logo1 > * {
		transition: opacity .5s 4s linear;
		opacity: 0;
	}
	#opening.opening_start .ph1 {
		transition: opacity 1s 4.5s ease;
		opacity: 1;
	}
	#opening.opening_start .ph2 {
		transition: opacity 1s 6.2s ease;
		opacity: 1;
	}
	#opening.opening_start .ph3 {
		transition: opacity 1s 7.3s ease;
		opacity: 1;
	}
	#opening.opening_start .ph4 {
		transition: opacity 1s 8.4s ease;
		opacity: 1;
	}
	@media (max-width: 743px) {
		#opening .imgs > * {
			transform: scale(.5);
		}
		#opening.opening_start .imgs > * {
			transform: scale(1.5);
		}
	}

	.hide_opening #opening {
		transition: opacity 0.7s ease;
		opacity: 0;
	}
	.hide_opening #footer {
		display: block;
	}
	.hide_opening #container {
		position: relative;
		left: 0;
		top: 0;
		opacity: 1;
	}
	.view_opening .index-main figure {
		filter: brightness(300%);
	}
	.hide_opening .index-main figure {
		transition: opacity 1s .5s ease,  filter 1s .5s ease;
		filter: brightness(100%);
		opacity: 1;
	}
	.hide_opening .index-main .content {
		transition: opacity .5s 1.5s ease, transform .5s 1.5s ease;
		transform: translateY(0);
		opacity: 1;
	}
  .hide_opening .index-main .btn-fit {
		transition: opacity .5s 1.5s ease, transform .5s 1.5s ease;
		transform: translateY(0);
		opacity: 1;
	}
	.hide_opening #header {
		transition:  transform .4s 2s ease-out;
		transform: translateY(0);
	}
  .hide_opening #header .gnav .new::after {
		transition:  transform .4s 2s ease-out;
		transform: translateY(0);
	}
	.non_opening .index-main figure {
		filter: brightness(300%);
		opacity: 0;
	}
	.non_opening.show_main .index-main figure {
		transition: opacity 1s ease,  filter 1s ease;
		filter: brightness(100%);
		opacity: 1;
	}
	.non_opening .index-main .content {
		opacity: 0;
		transform: translateY(.5rem);
	}
	.non_opening.show_main .index-main .content {
		transition: opacity .5s .5s ease, transform .5s .5s ease;
		transform: translateY(0);
		opacity: 1;
	}
	.non_opening .index-main .btn-fit {
		opacity: 0;
		transform: translateY(.5rem);
	}
	.non_opening.show_main .index-main .btn-fit {
		transition: opacity .5s .5s ease, transform .5s .5s ease;
		transform: translateY(0);
		opacity: 1;
	}  
}


/* mov_show
============================================================================================================ */
@media screen {
	.mov_show.fadeup {
		opacity: 0;
		transform: translateY(50px);
	}
	.mov_show.fadeup.showed {
		transition: transform .6s cubic-bezier(0.5, 1, 0.89, 1), opacity .6s linear;
		opacity: 1;
		transform: translateY(0);
	}

}



/* ==============================================================================

	form

============================================================================== */
.box-page {
	padding: 20rem 0 16rem;
}
.box-page h1 {
	margin-bottom: 5rem;
	text-align: center;
	font-size: 3.3rem;
	line-height: 1.5;
	font-weight: 600;
	color: var(--color-theme);
}
.box-contents {
	padding: 8rem 5rem;
	background-color: #e0e0e0;
	font-size: 1.8rem;
	line-height: 1.5;
}
@media screen and (min-width: 744px), print {
	.box-contents {
		width: 90rem;
	}
}
@media screen and (max-width: 743px) {
	.box-page {
		padding: 10rem 0 8rem;
	}
	.box-page h1 {
		margin-bottom: 3rem;
		font-size: 2.2rem;
	}
	.box-contents {
		margin: 0 var(--sp-base-padding);
		padding: 3rem var(--sp-base-padding) 4rem;
		font-size: 1.6rem;
	}
}

.form_item + .form_item {
	margin-top: 2.6rem;
}
.form_item + .form_item.-mts {
	margin-top: 1rem;
}
.form_item dt .hissu {
	display: inline-block;
	margin-left: 0.8em;
	padding: 0.2em .5em .3em;
	background-color: var(--color-theme);
	font-size: 1.1rem;
	color: #fff;
}
.form_item dt .hissu.-nini {
	background-color: #A9AAAD;
}
.form_item dt .s {
	display: inline-block;
	font-size: 1.1rem;
}
@media screen and (min-width: 744px), print {
	.form_item {
		display: flex;
		align-items: start;
	}
	.form_item > dt {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 5.4rem;
		width: 19rem;
	}
	.form_item dt .s {
		display: block;
	}
	.form_item > dd {
		margin-left: auto;
		width: 56.7rem;
	}
	.-confirm .form_item > dd {
		display: flex;
		align-items: center;
		min-height: 5.4rem;
	}
}
@media screen and (max-width: 743px) {
	.form_item + .form_item {
		margin-top: 4rem;
	}
	.form_item > dt {
		display: flex;
		align-items: center;
		margin-bottom: 0.5em;
	}
}
.form_contents input[type=text],
.form_contents input[type=email],
.form_contents input[type=tel],
.form_contents input[type=number],
.form_contents input[type=date],
.form_contents textarea,
.form_contents select {
	width: 100%;
	height: 5.4rem;
	padding: 0 1em;
	background-color: #fff;
	font-size: 100%;
	font-size: 1.8rem;
}
.form_contents textarea {
	width: 100%;
	height: 170px;
	padding-top: 0.8em;
	padding-bottom: 0.8em;
}
.form_contents #family {
	width: 10rem;
	margin-right: 2rem;
}
.form_contents input[type=text],
.form_contents input[type=email],
.form_contents input[type=tel],
.form_contents input[type=number],
.form_contents input[type=date],
.form_contents select,
.form_contents textarea {
	transition: box-shadow .2s, border .2s;
}
.form_contents input[type=text]:not(:read-only):focus,
.form_contents input[type=email]:focus,
.form_contents input[type=tel]:focus,
.form_contents input[type=number]:focus,
.form_contents input[type=date]:focus,
.form_contents select:focus,
.form_contents textarea:focus {
	border-color: #66afe9;
	outline: 0;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,0.8);
}
.form_contents .select_wrap {
	position: relative;
	display: table;
}
.form_contents .select_wrap ~ .select_wrap {
	margin-top: 2rem;
}
.form_contents .select_wrap::after {
	content: "";
	position: absolute;
	bottom: calc(50% - 6px);
	right: 2.2rem;
	width: 1.2rem;
	height: 1.2rem;
	border-bottom: .2rem solid #000;
	border-right: .2rem solid #000;
	transform-origin: 100% 100%;
	transform: rotate(45deg);
}
.form_contents .select_wrap select {
	padding-right: calc(4.4rem + 1em);
}
@media screen and (max-width: 743px) {
	.form_contents input[type=text],
	.form_contents input[type=email],
	.form_contents input[type=tel],
	.form_contents input[type=number],
	.form_contents input[type=date],
	.form_contents textarea,
	.form_contents select {
		font-size: 1.6rem;
	}
}

.form_contents input[type=checkbox],
.form_contents input[type=radio] {
	position: absolute;
	visibility: hidden;
}
.form_contents label {
	position: relative;
	display: flex;
	align-items: center;
	height: 5.4rem;
}
.form_contents label .s {
	display: block;
	font-size: 1.1rem;
}
.form_contents label input[type=radio] + .check {
	position: relative;
	flex-shrink: 0;
	width: 4rem;
	height: 4rem;
	margin-right: 1rem;
	background-color: #fff;
	border: 1px solid #c9c9c9;
	border-radius: 100%;
}
.form_contents label input[type=radio] + .check:after {
	content: "";
	position: absolute;
	top: 3px;
	right: 3px;
	left: 3px;
	bottom: 3px;
	background-color: var(--color-theme);
	opacity: 0;
	border-radius: 100%;
}
.form_contents label input[type=radio]:checked + .check:after {
	opacity: 1;
}
.form_contents label input[type=checkbox] + .check {
	position: relative;
	flex-shrink: 0;
	width: 2rem;
	height: 2rem;
	margin-right: 1.5rem;
	background-color: #fff;
	border: 1px solid var(--color-base);
}
.form_contents label input[type=checkbox] + .check:after {
	content: "";
	position: absolute;
	left: .5rem;
	top: 0;
	width: .9rem;
	height: 1.4rem;
	border-right: .4rem solid var(--color-theme);
	border-bottom: .4rem solid var(--color-theme);
	opacity: 0;
	transition: opacity .1s;
	transform: rotate(45deg);
}
.form_contents label input[type=checkbox]:checked + .check:after {
	opacity: 1;
}
@media screen and (max-width: 743px) {
	.form_contents label {
		height: 4.4rem;
	}
	.form_contents label input[type=checkbox] + .check {
		margin-right: 1rem;
	}
}

.form_contents .-privacy dt {
	display: none;
}
.form_contents .-privacy p {
	margin-bottom: 1rem;
	font-size: 1.5rem;
}
.form_contents .form_btn {
	text-align: center;
	margin-top: 5rem;
}
.form_contents button {
	width: 33rem;
	height: 7.6rem;
	margin: 0 2rem;
	background-color: var(--color-theme);
	color: #fff;
	font-size: 1.8rem;
	font-weight: 600;
	letter-spacing: 0.1em;
}
.form_contents button.back_btn {
	background-color: #999;
}
@media screen and (max-width: 743px) {
	.form_contents .-privacy p {
		font-size: 1.3rem;
	}
	.form_contents button {
		width: 100%;
		height: 7rem;
		font-size: 1.8rem;
	}
	.form_contents .submit .box_btn > * {
		text-align: left;
		font-size: 1.4rem;
	}
	.form_contents button {
		width: 100%;
		margin: 0.7rem 0;
	}
}

.form_contents .form_error {
 	margin-bottom: 5rem;
	color: #eb3737;
	font-weight: bold;
	text-align: center;
	font-size: 1.6rem;
}
.form_contents .form_error ul {
	margin-top: 1em;
}
.form_contents .err,
.form_error_contents .err {
	margin-top: 5px;
}
.form_contents .err strong,
.form_error_contents .err strong {
	display: inline-block;
	padding: 4px 10px;
	background-color: #eb3737;
	border-radius: 4px;
	color: #fff;
	font-weight: bold;
	font-size: 1.4rem;
	line-height: 1.4;
}
.form_error_contents {
	text-align: center;
}
.point_title + .form_error_contents {
	margin-top: -15px;
}
.form_contents .zip_err {
	display: none;
}
.form_contents .zip_err.show {
	display: block;
}
@media screen and (max-width: 743px) {
	.form_contents .form_error {
		font-size: 1.4rem;
	}
	.form_contents .err strong,
	.form_error_contents .err strong {
		font-size: 1.3rem;
	}
	.point_title + .form_error_contents {
		margin-top: -10px;
	}
}

.form_fin_box {
	text-align: center;
}
.form_fin_box .lead_title {
	margin-bottom: 3rem;
	font-weight: 700;
	font-size: 2.4rem;
}
.form_back_btn {
	margin-top: 6rem;
}
.form_back_btn a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 33rem;
	height: 7.6rem;
	margin: 0 auto;
	background-color: var(--color-theme);
	color: #fff;
	text-decoration: none;
	font-size: 1.8rem;
	font-weight: 600;
	letter-spacing: 0.1em;
}
@media screen and (max-width: 743px) {
	.form_fin_box p {
		margin-top: 1em;
	}
	.form_fin_box .lead_title {
		margin-bottom: 2rem;
		font-size: 2rem;
	}
	.form_back_btn {
		margin-top: 3rem;
	}
	.form_back_btn a {
		width: 100%;
	}
}



/* ==============================================================================

	404

============================================================================== */
.page-404 {
	padding: 20rem 0 16rem;
	text-align: center;
}
.page-404 header {
	margin-bottom: 3rem;
	color: var(--color-theme);
	font-size: 3rem;
	line-height: 1.5;
	font-weight: 600;
}
.page-404 header p {
	font-size: 6.4rem;
	letter-spacing: 0.1em;
}
.page-404 header h1 {
	font-weight: 600;
}
.page-404 .btn {
	margin-top: 4rem;
}
.page-404 .btn a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 50rem;
	height: 10rem;
	margin-inline: auto;
	text-decoration: none;
	font-size: 2.4rem;
	font-weight: 600;
	color: var(--color-theme);
	border: 1px solid;
}
@media (hover) {
	.page-404 .btn a:hover {
		background-color: var(--color-theme);
		color: #fff;
	}
}
@media screen and (max-width: 743px) {
	.page-404 {
		padding: 10rem 0 8rem;
	}
	.page-404 header {
		margin-bottom: 3rem;
		color: var(--color-theme);
		font-size: 1.8rem;
	}
	.page-404 header p {
		font-size: 3.4rem;
		letter-spacing: 0.1em;
	}
	.page-404 .btn a {
		width: 100%;
		height: 6rem;
		font-size: 1.6rem;
	}
}

