@charset "utf-8";
:root {
	--textShadow:0 0.2em 0.5em rgba(100,78,35,0.5);
}

@media only screen and (max-width:560px) {
	body.fromHvn main {
		font-size:2.7vw;
	}
}

.btn_hvnNav {
	display:flex;
	justify-content:space-between;
	box-sizing:border-box;
	width:100%;
	padding:0 8%;
}
	.btn_hvnNav a {
		width:48%;
	}

.fromHvn_concept {
	color:#715d2e;
	font-family:'Zen Old Mincho', serif;
}

.fromHvn_concept .fv {
	position:relative;
	background-size:100% auto;
	box-sizing:border-box;
	aspect-ratio:750/1159;
	width:100%;
	margin-bottom:3em;
	overflow:hidden;
	z-index:10;
}
.fromHvn_concept .fv .bg { /* 動画のマスク */
	position:relative;
	mask-image:url(../img/concept_fv_mask.png);
	mask-repeat:no-repeat;
	mask-position:0 0;
	mask-size:100%;

	/* Chrome, Safari用 */
	-webkit-mask-image:url(../img/concept_fv_mask.png);
	-webkit-mask-repeat:no-repeat;
	-webkit-mask-position:0 0;
	-webkit-mask-size:100%;
}
	.fromHvn_concept .fv .bg::after {
		content:"";
		position:absolute;
		top:0; left0;
		background:url(../img/concept_fv_drop.png) center top no-repeat;
		background-size:100% auto;
		width:100%;
		height:100%;
		margin:auto;
		z-index:1;
	}
	.fromHvn_concept .fv .bg .object4 {
		mix-blend-mode: screen;
		position:absolute;
		bottom:-1em; right:0;
		width:64.8%;
		margin:auto;
		z-index:1;
	}

.fromHvn_concept .fvContents {
	position:absolute;
	top:9.22%; left0; right:0;
	width:100%;
	height:100%;
	margin:auto;
	color:#ffffff;
	z-index:2;
}

.fromHvn_concept .fvContents .object1 {
	width:23.46%;
	margin-left:auto;
	margin-right:1.5em;
	margin-bottom:9em;
}

.fromHvn_concept .fvContents .object2 {
	width:65.86%;
	margin-left:auto;
	margin-right:auto;
}

.fromHvn_concept .fv .object3 {
	position:absolute;
	bottom:2em; left:0; right:0;
	width:20.8%;
	margin:auto;
}


.fromHvn_concept .contentsFrame {
	position:relative;
}
.fromHvn_concept h2 {
	font-size:2.6em;
	text-align:center;
	font-style:italic;
	letter-spacing:0.1em;
	text-shadow:var(--textShadow);
}
.fromHvn_concept .contentsFrame .contents {
	overflow-x:hidden;
}

.gohoubi1 h2 {
	margin-bottom:0.5em;
}
.gohoubi1 .contents {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
}
.gohoubi1 .ttlEn {
	position:absolute;
	top:1em; left:0;
	width:41%;
}
.gohoubi1 .video1 {
	position:absolute;
	top:16.22%; left:0; right:0;
	width:95%;
	border:solid 0.5em #fff;
	box-sizing:border-box;
	border-radius:1.5em;
	margin:auto;
	overflow:hidden;
}
.gohoubi1 .video2 {
	position:absolute;
	top:61.58%; left:0; right:0;
	width:95%;
	border:solid 0.5em #fff;
	box-sizing:border-box;
	border-radius:1.5em;
	margin:auto;
	overflow:hidden;
}
.gohoubi1 .object1 {
	position:absolute;
	top:7.69%; right:9.2%;
	width:34.93%;
}
.gohoubi1 .object2 {
	position:absolute;
	top:37.98%; left:10.4%;
	width:32.26%;
}
.gohoubi1 .object3 {
	position:absolute;
	top:51.25%; right:3.73%;
	width:41.33%;
}

.gohoubi2 h2 {
	font-size:2.4em;
	margin-bottom:1.3em;
}
.gohoubi2 .ttlEn {
	position:absolute;
	top:1em; left:0;
	width:57.06%;
}
.gohoubi2 .contentsFrame {
	aspect-ratio:750/1159;
	width:100%;
	height:100%;
}
	.gohoubi2 .contentsFrame::after {
		content:"";
		position:absolute;
		top:0; left0;
		background:url(../img/concept_gohoubi2_water.png) center top no-repeat;
		background-size:100% auto;
		width:100%;
		height:100%;
		margin:auto;
		z-index:1;
	}

.gohoubi2 .contentsFrame .mask { /* 動画のマスク */
	position:absolute;
	top:0; left:0; right:0; bottom:0;
	margin:auto;
	overflow:hidden;
	will-change: transform;/* iosで角丸が効かない対応 */
	z-index:1;

	mask-image:url(../img/concept_gohoubi2_mask.png);
	mask-repeat:no-repeat;
	mask-position:0 0;
	mask-size:100%;

	/* Chrome, Safari用 */
	-webkit-mask-image:url(../img/concept_gohoubi2_mask.png);
	-webkit-mask-repeat:no-repeat;
	-webkit-mask-position:0 0;
	-webkit-mask-size:100%;
}
	
	.gohoubi2 .contentsFrame .mask .object1 {
		mix-blend-mode: screen;
		position:absolute;
		top:2.5em; right:0;
		width:78%;
		margin:auto;
		z-index:1;
	}
	.gohoubi2 .contentsFrame .mask .object2 {
		mix-blend-mode: screen;
		position:absolute;
		bottom:5em; left:0;
		width:38.93%;
		margin:auto;
		z-index:1;
	}

.gohoubi2 .contentsFrame .contents {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	z-index:2;
}
	.gohoubi2 .contentsFrame .contents .vText1 {
		font-size:1.4em;
		writing-mode:vertical-rl;
		position:absolute;
		top:6em; right:1em;
		background:rgba(208,171,39,0.8);
		padding:1.2em 0.9em;
		color:#fff;
	}
	.gohoubi2 .contentsFrame .contents .vText2 {
		font-size:1.4em;
		writing-mode:vertical-rl;
		position:absolute;
		bottom:9em; left:1em;
		background:rgba(208,171,39,0.8);
		padding:1.5em 1em;
		color:#fff;
	}

.gohoubi3 h2 {
	font-size:2.4em;
}
.gohoubi3 .ttlEn {
	position:absolute;
	top:2.6em; right:0;
	width:51.73%;
}
.gohoubi3 .contentsFrame {
	/*aspect-ratio:750/1159;*/
	aspect-ratio:750/1118;
	width:100%;
	height:100%;
}
	.gohoubi3 .contentsFrame::after {
		content:"";
		position:absolute;
		top:0; left0;
		background:url(../img/concept_gohoubi3_water.png) center top no-repeat;
		background-size:100% auto;
		width:100%;
		height:100%;
		margin:auto;
		z-index:1;
	}

.gohoubi3 .contentsFrame .mask { /* 動画のマスク */
	position:absolute;
	top:0; left:0; right:0; bottom:0;
	margin:auto;
	overflow:hidden;
	will-change: transform;/* iosで角丸が効かない対応 */
	z-index:1;

	display:flex;
	align-items:center;
	padding:2.5em 0;

	mask-image:url(../img/concept_gohoubi3_mask.png);
	mask-repeat:no-repeat;
	mask-position:0 0;
	mask-size:100%;

	/* Chrome, Safari用 */
	-webkit-mask-image:url(../img/concept_gohoubi3_mask.png);
	-webkit-mask-repeat:no-repeat;
	-webkit-mask-position:0 0;
	-webkit-mask-size:100%;
}
	
	.gohoubi3 .contentsFrame .mask .object1 {
		mix-blend-mode: screen;
		position:absolute;
		top:3.5em; left:0;
		width:49%;
		margin:auto;
		z-index:1;
	}
	.gohoubi3 .contentsFrame .mask .object2 {
		mix-blend-mode: screen;
		position:absolute;
		bottom:7em; right:0;
		width:55%;
		margin:auto;
		z-index:1;
	}

.gohoubi4 {
	margin-bottom:3.5em;
}
.gohoubi4 h2 {
	font-size:2.4em;
	padding-left:1.5em;
	margin-bottom:1.8em;
	text-align:left;
}
	.gohoubi4 h2 em {
		font-size:1.8em;
		line-height:1;
		font-style:italic;
	}

.gohoubi5 {
	background:url(../img/concept_gohoubi5_bg.png) center top no-repeat;
	background-size:100% auto;
	padding:9em 0 8em;
	margin-bottom:3.5em;
}
.gohoubi5 .ttl {
	margin-bottom:3.5em;
}
.gohoubi5 .video {
	width:95%;
	border:solid 0.5em #fff;
	box-sizing:border-box;
	border-radius:1.5em;
	margin:auto;
	overflow:hidden;
	z-index:1;
}

.gohoubi6 {
	position:relative;
	margin-bottom:8em;
}
.gohoubi6 h2 {
	font-size:2.4em;
	margin-bottom:1.3em;
}
.gohoubi6 .ttlEn {
	position:absolute;
	top:1em; left:0;
	width:46.66%;
}
.gohoubi6 .contentsFrame {
	aspect-ratio:750/1159;
	width:100%;
	height:100%;
}
	.gohoubi6 .contentsFrame::after {
		content:"";
		position:absolute;
		top:0; left0;
		background:url(../img/concept_gohoubi6_water.png) center top no-repeat;
		background-size:100% auto;
		width:100%;
		height:100%;
		margin:auto;
		z-index:1;
	}

.gohoubi6 .contentsFrame .mask { /* 動画のマスク */
	position:absolute;
	top:0; left:0; right:0; bottom:0;
	margin:auto;
	overflow:hidden;
	will-change: transform;/* iosで角丸が効かない対応 */
	z-index:1;

	mask-image:url(../img/concept_gohoubi6_mask.png);
	mask-repeat:no-repeat;
	mask-position:0 0;
	mask-size:100%;

	/* Chrome, Safari用 */
	-webkit-mask-image:url(../img/concept_gohoubi6_mask.png);
	-webkit-mask-repeat:no-repeat;
	-webkit-mask-position:0 0;
	-webkit-mask-size:100%;
}

.gohoubi6 .contentsFrame .mask .object1 {
	mix-blend-mode: screen;
	position:absolute;
	top:-2em; right:-25%;
	width:65%;
	margin:auto;
	z-index:1;
}
.gohoubi6 .contentsFrame .mask .object2 {
	mix-blend-mode: screen;
	position:absolute;
	bottom:5em; left:0;
	width:51%;
	margin:auto;
	z-index:1;
}

.gohoubi6 .contentsFrame .contents {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
	z-index:2;
}
	.gohoubi6 .contentsFrame .contents .vText1 {
		font-size:1.4em;
		writing-mode:vertical-rl;
		position:absolute;
		top:6.5em; right:1em;
		background:rgba(208,171,39,0.8);
		padding:1.2em 0.9em;
		color:#fff;
	}
	.gohoubi6 .contentsFrame .contents .vText2 {
		font-size:1.4em;
		writing-mode:vertical-rl;
		position:absolute;
		bottom:6em; left:1em;
		background:rgba(208,171,39,0.8);
		padding:1.5em 0.9em;
		color:#fff;
	}

.gohoubi6 .btn_hvnNav {
	position:absolute;
	bottom:3em; left:0;
	margin-top:-5em;
	z-index:3;
}

body.play #footer {
	margin-top:0;
}
.fromHvn_play {
	color:#715d2e;
	font-family:'Zen Old Mincho', serif;
	overflow-x:hidden;
}
@media only screen and (max-width:560px) {
	.fromHvn_play {
		font-size:2.7vw;
	}
}

.fromHvn_play h2 {
	font-size:2.3em;
	width:100%;
	margin-bottom:1em;
	text-align:center;
	letter-spacing:0.1em;
	text-shadow:var(--textShadow);
}
.fromHvn_play h2 span {
	position:relative;
	display:inline-block;
	font-style:italic;
}
	.fromHvn_play h2 span::before,
	.fromHvn_play h2 span::after {
		content:"";
		position:absolute;
		top:50%;
		background:#715d2e;
		width:1em;
		height:1px;
		margin:auto;
		box-shadow:var(--textShadow);
	}
	.fromHvn_play h2 span::before {
		left:-2em;
	}
	.fromHvn_play h2 span::after {
		right:-2em;
	}

.fromHvn_play .pageBG {
	position:fixed;
	top:0; left:50%; 
	transform:translateX(-50%);

	aspect-ratio:750/1737;
	width:100%;
	max-width:560px;
	height:100%;
	/*padding:166% 0 0;*/
	z-index:-1;
	overflow:hidden;
}
.fromHvn_play .introduct {
	position:relative;
	margin-top:10vh;
	color:#ffffff;
	padding-bottom:18em;
}
	.fromHvn_play .introduct::after {
		content:"";
		position:absolute;
		bottom:-1px; left:0;
		background:url(../img/sp_concept_movie_introduct_layer_02.png) center bottom no-repeat;
		background-size:100% auto;
		width:100%;
		height:18em;
	}




.fromHvn_play .introduct .videoContainer {

}
	.fromHvn_play .videoContainer.pageBG  .videoFlame {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
		overflow:hidden;
	}
	.fromHvn_play .videoContainer.pageBG  .videoFlame video {
		position:absolute;
		top:0;
		left:50%;
		transform:translateX(-50%);
		width:auto;
		height:100vh;
		/*height:540px;*/
	}

.fromHvn_play .introduct .content {
	/*position:absolute;
	left:0; right:0; bottom:0;*/
	width:100%;
	/*height:calc(50% + 1em);*/
	margin:auto;
	padding-top: 230px;
	color:#ffffff !important;
}
	.fromHvn_play .introduct .content h2 span::before,
	.fromHvn_play .introduct .content h2 span::after {
		background:rgba(255,255,255,0.5);
	}
	.fromHvn_play .introduct .content h2 span::before {
		left:-1em;
	}
	.fromHvn_play .introduct .content h2 span::after {
		right:-1em;
	}

.fromHvn_play .introduct .content .rollText {
	/*position:absolute;
	bottom:0;*/
	width:100%;
	/*height:calc(100% - 5em);*/
	overflow:hidden;
	text-align:center;
}
.fromHvn_play .introduct .content .rollText p {
	font-size:1.3em;
	line-height:2.3;
	width:100%;
	font-style:italic;
	text-shadow:var(--textShadow);
}

.fromHvn_play .promise {
	background:#fff;
	padding-top:5em;
	padding-bottom:3em;
	text-shadow:var(--textShadow);
	justify-items: center;
}
.fromHvn_play .promise .text1 {
	font-size:1.9em;
	margin-bottom:1.5em;
	text-align:center;
	font-style:italic;
	letter-spacing:0.2em;
}
.fromHvn_play .promise .playPV {
	width:95%;
	border:solid 0.5em #fff;
	box-sizing:border-box;
	border-radius:1.5em;
	margin:0 auto 3em;
	overflow:hidden;
}
.fromHvn_play .promise .text2 {
	font-size:2.1em;
	margin-bottom:1.2em;
	text-align:center;
	font-style:italic;
	letter-spacing:0.2em;
}

.fromHvn_play .promise .promise1 {
	position:relative;
	margin-bottom:3em;
	overflow:hidden;
}
	.fromHvn_play .promise .promise1::after {
		content:"";
		position:absolute;
		top:0; left:0;
		background:url(../img/hvnPlay_promise1_water.png) center top no-repeat;
		background-size:100% auto;
		width:100%;
		height:100%;
		z-index:2;
	}

.fromHvn_play .promise .promise1 .ttlEn {
	position:absolute;
	top:0; right:0;
	width:54.4%;
}
.fromHvn_play .promise .promise1 .img1 {
	position:relative;
}
	.fromHvn_play .promise .promise1 .img1 .object {
		position:absolute;
		top:30.66%; right:8.66%;
		width:50.8%;
		z-index:2;
	}

.fromHvn_play .promise .promise1 .img2 {
	position:relative;
	margin-top:-7.3em;
}
	.fromHvn_play .promise .promise1 .img2 .object {
		position:absolute;
		top:8.97%; left:7.2%;
		width:48.53%;
		z-index:2;
	}

.fromHvn_play .promise .promise1 .img3 {
	position:relative;
	margin-top:-10em;
}
	.fromHvn_play .promise .promise1 .img3 .object {
		position:absolute;
		top:10.66%; right:10.6%;
		width:61.6%;
		z-index:2;
	}

.fromHvn_play .promise .text3 {
	font-size:1.4em;
	line-height:2.2;
	margin-bottom:2em;
	text-align:center;
	font-style:italic;
	letter-spacing:0.2em;
}
.fromHvn_play .promise .promise2 {
	position:relative;
	padding-bottom:2em;
}
.fromHvn_play .promise .promise2 .contents {
	position:absolute;
	top:0; left:0;
	width:100%;
	height:100%;
}
	.fromHvn_play .promise .promise2 .contents .vText1 {
		font-size:1.9em;
		writing-mode:vertical-rl;
		position:absolute;
		top:1em; right:0.7em;
		background:rgba(208,171,39,0.8);
		padding:1.2em 0.9em;
		color:#fff;
		letter-spacing:0.1em;
		text-shadow:none;
	}
	.fromHvn_play .promise .promise2 .contents .vText2 {
		font-size:1.9em;
		writing-mode:vertical-rl;
		position:absolute;
		bottom:1em; left:0.7em;
		background:rgba(208,171,39,0.8);
		padding:1.2em 0.9em;
		color:#fff;
		letter-spacing:0.1em;
		text-shadow:none;
	}

.fromHvn_play .promise .text4 {
	font-size:1.86em;
	line-height:2;
	text-align:center;
	font-style:italic;
	letter-spacing:0.05em;
}

.fromHvn_play .kodawari {
	background:#fff;
	padding-bottom:4em;
}
.fromHvn_play .kodawari .videoFlame {
	position:relative;
	aspect-ratio:750/818;
	width:100%;
	height:100%;
}
	.fromHvn_play .kodawari .videoFlame::after {
		content:"";
		position:absolute;
		top:0; left0;
		background:url(../img/hvnPlay_kodawari1_water.png) center top no-repeat;
		background-size:100% auto;
		width:100%;
		height:100%;
		margin:auto;
		z-index:1;
	}
	.fromHvn_play .kodawari2 .videoFlame::after {
		background:url(../img/hvnPlay_kodawari2_water.png) center top no-repeat;
		background-size:100% auto;
	}

.fromHvn_play .kodawari .videoFlame .mask { /* 動画のマスク */
	position:absolute;
	top:0; left:0; right:0; bottom:0;

	display:flex;
	align-items:center;
	padding:2.5em 0;

	margin:auto;
	overflow:hidden;
	will-change: transform;/* iosで角丸が効かない対応 */
	z-index:1;

	mask-image:url(../img/hvnPlay_kodawari1_mask.png);
	mask-repeat:no-repeat;
	mask-position:0 0;
	mask-size:100%;

	/* Chrome, Safari用 */
	-webkit-mask-image:url(../img/hvnPlay_kodawari1_mask.png);
	-webkit-mask-repeat:no-repeat;
	-webkit-mask-position:0 0;
	-webkit-mask-size:100%;
}
.fromHvn_play .kodawari2 .videoFlame .mask { /* 動画のマスク */
	mask-image:url(../img/hvnPlay_kodawari2_mask.png);
	/* Chrome, Safari用 */
	-webkit-mask-image:url(../img/hvnPlay_kodawari2_mask.png);
}

.fromHvn_play .kodawari .videoFlame .mask .object1 {
	mix-blend-mode: screen;
	position:absolute;
	top:0; right:0;
	width:62.1%;
	margin:auto;
	z-index:1;
}
.fromHvn_play .kodawari .videoFlame .mask .object2 {
	mix-blend-mode: screen;
	position:absolute;
	bottom:2em; left:0;
	width:40.53%;
	margin:auto;
	z-index:1;
}
.fromHvn_play .kodawari2 .videoFlame .mask .object1 {
	mix-blend-mode: screen;
	position:absolute;
	top:0; left:0; right:auto;
	width:62.1%;
	margin:auto;
	z-index:1;
}
.fromHvn_play .kodawari2 .videoFlame .mask .object2 {
	mix-blend-mode: screen;
	position:absolute;
	bottom:2em; right:0; left:auto;
	width:40.53%;
	margin:auto;
	z-index:1;
}



.fromHvn_play .kodawari .contents {
	margin-bottom:4em;
	text-align:center;
	text-shadow:var(--textShadow);
}
.fromHvn_play .kodawari .contents dt {
	padding:3em 0;
	text-align:center;
}
.fromHvn_play .kodawari .contents dt span {
	position:relative;
	font-size:2.2em;
	display:inline-block;
	margin-bottom:0.3em;
	font-style:italic;
}
	.fromHvn_play .kodawari .contents dt span::before,
	.fromHvn_play .kodawari .contents dt span::after {
		content:"";
		position:absolute;
		top:50%;
		background:#715d2e;
		width:1em;
		height:1px;
		margin:auto;
	}
	.fromHvn_play .kodawari .contents dt span::before {
		left:-4em;
	}
	.fromHvn_play .kodawari .contents dt span::after {
		right:-4em;
	}

.fromHvn_play .kodawari .contents dt h3 {
	font-size:2.3em;
	line-height:1.7;
	font-style:italic;
	letter-spacing:0.1em;
}
.fromHvn_play .kodawari .contents dd {
	font-size:1.28em;
	line-height:2;
	font-style:italic;
	letter-spacing:0.1em;
}

.fromHvn_play .serviceFlow {
	background:#ffffff;
	padding-bottom:3em;
}
.fromHvn_play .serviceFlow .bgFrame {
	position:relative;
}
.fromHvn_play .serviceFlow .ttlEn {
	position:absolute;
	top:9em; left:0;
	width:42.13%;
	transform: rotate(-15deg);
}
.fromHvn_play .serviceFlow .contents {
	position:absolute;
	top:9.49%; left:0;
	width:100%;
}
.fromHvn_play .serviceFlow .videoButtons {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	box-sizing:border-box;
	width:100%;
	padding:0 3%;
	text-align:center;
}
.fromHvn_play .serviceFlow .videoButtons li {
	position:relative;
	width:47%;
	height:100%;
	margin-bottom:2em;
}
.fromHvn_play .serviceFlow .videoButtons li .videoArea {
	position:relative;
	border-radius:1.5em;
	background:url(../img/serviceFlow_loading.png) center top no-repeat;
	background-size:100% auto;
	box-shadow:0.1em 0.18em 0 0.1em rgba(110,110,110,0.25);
	width:100%;
	height:100%;
	padding:156% 0 0;
	overflow:hidden;
	z-index:1;/* iosで角丸が効かない対応 */
}
	.fromHvn_play .serviceFlow .videoButtons li .videoArea .videoMask {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
	}
	.fromHvn_play .serviceFlow .videoButtons li .videoArea .videoMask video {
		position:absolute;
		top:50%;
		left:50%;
		transform:translate(-50%, -50%);
		width:auto;
		height:100%;
	}
	.fromHvn_play .serviceFlow .videoButtons li .btn {
		position: absolute;
		top:50%; left:0; right:0;
		transform: translateY(-50%);
		width:14%;
		margin:auto;
	}
	.fromHvn_play .serviceFlow .videoButtons li .btn {
	}
	.fromHvn_play .serviceFlow .videoButtons li.active .btn {
		display:none;
	}

.fromHvn_play .serviceFlow .videoButtons li .videoArea .content {
	position:absolute;
	top:0; left:0; right:0; bottom:0;
	margin:auto;
	color:#ffffff;
}
	.fromHvn_play .serviceFlow .videoButtons li .videoArea .content span {
		font-size:2.2em;
		line-height:1;
		display:block;
		position:absolute;
		top:1em; left:0; right:0;
		margin:auto;
		font-weight:700;
	}
	.fromHvn_play .serviceFlow .videoButtons li .videoArea .content p {
		font-size:1.1em;
		position:absolute;
		bottom:1.5em; left:1em; right:1em;
		background:rgba(208,171,39,0.8);
		border-radius:0;
		padding:1.3em 0;
		margin:auto;
	}

.fromHvn_play .serviceFlow .videoButtons li .exp {
	padding-top:1em;
	color:#d0ab28;
}

.fromHvn_play .equipment {
	background:#ffffff;
	padding-bottom:5em;
}
.fromHvn_play .equipment h2 {
	margin-bottom:0.5em;
}
.fromHvn_play .equipment .bgFrame {
	position:relative
}
.fromHvn_play .equipment .contents {
	position:absolute;
	top:12.59%; left:0; right:0;
	width:88%;
	margin:auto;
	/*z-index:1;*/
}
.fromHvn_play .equipment .equipItem {
	position:relative;
	/*background:rgba(239,249,255,0.8);
	box-shadow:0 1em 1em 0.7em rgba(167,153,105,0.2) inset;*/
	border-radius:2.3em;
	padding:2em 0;
	margin-bottom:6.5em;
	z-index:3;
}
.fromHvn_play .equipment .equipItem:last-of-type {
	margin-bottom:0;
}
	
	
	.fromHvn_play .equipment .equipItem::after {
		content:"";
		position:absolute;
		top:0; left:0;
		width:100%;
		height:100%;
		box-shadow:0 0.8em 0.8em 0.3em rgba(167,153,105,0.2) inset;
		border-radius:2.3em;
		mix-blend-mode:multiply;
		z-index:2;
	}
	.fromHvn_play .equipment .item1::after {
		background:rgba(239,249,255,0.9);
	}
	.fromHvn_play .equipment .item2::after {
		background:rgba(245,255,239,0.9);
	}
	.fromHvn_play .equipment .item3::after {
		background:rgba(255,253,239,0.9);
	}

.fromHvn_play .equipment .equipItem figure {
	position:absolute;
	top:-4.5em; left:-1.5em;
	aspect-ratio:1/1;
	border:solid 0.2em #fff;
	border-radius:50%;
	box-shadow:0.1em 0.1em 0 0.1em rgba(110,110,110,0.2);
	width:28%;
	overflow:hidden;
	z-index:4;
}
.fromHvn_play .equipment .equipItem dl {
	text-align:center;
	text-shadow:var(--textShadow);
}
	.fromHvn_play .equipment .equipItem dl dt {
		margin-bottom:1em;
	}
	.fromHvn_play .equipment .equipItem dl dt span {
		font-size:2.2em;
		line-height:1;
		display:block;
		margin-bottom:0.2em;
		font-style:italic;
	}
	.fromHvn_play .equipment .equipItem dl dt h3 {
		font-size:1.8em;
		line-height:1.7;
		letter-spacing:0.05em;
		font-style:italic;
	}

.fromHvn_play .equipment .equipItem dl dd p {
	font-size:1.2em;
	line-height:2.2;
	font-style:italic;
}
.fromHvn_play .equipment .item2 dl dd p,
.fromHvn_play .equipment .item3 dl dd p {
	padding:1em 0;
}

.btn_hvnNav {
	margin-top:3em;
}

.footerText{
	text-align: center;
	color:#715d2e;
	font-size: 0.8em;
}

.btmMenuBtn {
	position: fixed;
	bottom: 20px;
	left: 20px;
	z-index: 1000;
}

.topTitle {
    width: 250px;
    height: 125px;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
	padding-top: 200px;
}



.shopConceptText{
    text-align: center;
    margin-top: -660px;
    font-size: 1.3em;
    line-height: 2.3;
	text-shadow: #ffffff 1px 0 0px;
	position: absolute;
}

.footerMenu {
    position: fixed;
    bottom: 0;
    width: 560px;
    height: 80px;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: space-around; /* 等間隔に配置 */
    align-items: center; /* 縦方向中央揃え */
	margin: 0 auto; /* 中央に配置 */
    left: 0;
    right: 0;
}

.icon-link {
    display: flex;
    flex-direction: column; /* 縦方向に並べる */
    align-items: center; /* 中央揃え */
    text-decoration: none; /* リンクの下線を削除 */
    color: white; /* テキストの色 */
}

.icon-link img {
    width: 30px; /* アイコンの大きさを調整 */
    height: 30px;
}

.icon-link span {
    margin-top: 5px; /* アイコンとテキストの間隔 */
    font-size: 12px; /* テキストのサイズ調整 */
}

@media (max-width: 560px) {
    .footerMenu {
        width: 100%; /* 画面幅が560px以下の場合は幅を100%に */
        height: 70px; /* 高さも調整可能 */
    }

    .icon-link img {
        width: 30px; /* アイコンのサイズを縮小 */
        height: 30px;
    }

    .icon-link span {
        font-size: 10px; /* テキストサイズを調整 */
    }
}

.rollUp{
	position:absolute;
	bottom: 100px; /* 上から10pxの位置 */
    right: 20px; /* 右から10pxの位置 */
	width: 40px;
	height: 40px;
	display: none;
}


.tel-button {
    width: 180px;
    height: auto;
}

.water{
	margin-top:-230px;
}

@media (max-width: 768px) {
    .shopConceptText {
        padding-top: 230px;
		margin-top: -660px;
    }

	.water{
		margin-top: -125px;
	}
}

.videoTitle{
	font-family: 'Noto Sans', sans-serif;
	padding-top: 50px;
}