 /*----------------------------------------------------------------------------*/
/*  株式会社 実正 LP Key Visual							  CSS    */
/*----------------------------------------------------------------------------*/

	/* ☆ KeyVisual Image Area --------------*/
	#fview {	
		display:block;
		margin: 0  auto 0 auto;
		width: 100%;
		background-color: #FFF;
		border-bottom:none;
		border:none;
		padding-top:60px;
		padding-top:0px;
	}
	.viewer{

		margin: 0  auto 0 auto;
	}
	#viewerSP {
		display:block;
		margin: 0  auto 40px auto;
		width:100%;
		height:700px;
		padding-top:60px;
		background-color:#FFF;
		border:none;
	}
	#viewerPC {
		display:none;
	}

	/* ☆ KeyVisual Image Block ------------*/

	.viewer ul#guide01 {		/* ■ PC  -----------------*/
		width:100%;
		height:800px;
		height:100vh;
		background-image:url("../images/fview/fvbg01.jpg");
		background-size:	cover;
		background-position:center top 0;
		background-repeat:no-repeat;
	}
	.viewer #guide01 li {		/* ■ PC  -----------------*/
		display:block;
		margin: 0  auto 0 auto;
		width:100%;
		height:800px;
		height:100vh;
		position:relative;
	}
	.viewer dl,dt,dd {
		display:block;
	}

	.viewer #guide01 li.fview01 {		/* ■ PC FView #01 */
		margin: 0  auto 0 auto;
		width:100%;
		height:100vh;
		background-image:url("../images/fview/mv01_pc.png");
		background-size:859px 469px;
		background-size:799px 439px;
		background-position: left 73% top 33%;
		background-repeat:no-repeat;
	}
	.viewer #guide01 li.fview01 .vox01 {		/* PC VOX01 ◆  */
		position:absolute;
		top:20%;
		left:16%;
		right:0;
		width:65%;
		height: 450px;
		z-index:1;
	}
	.viewer #guide01 li.fview01 .vox02 {		/* PC VOX02 ◆  */
		display:block;
		position:absolute;
		bottom:15%;
		left:0;
		right:0;
		margin: 14px auto 0;
		width:50%;
		width:62%;
		height: 150px;
		z-index:1;
	}
	.viewer #guide01 li.fview01 .vox02 ul {
		margin: 0  auto 0 auto;
		width:100%;
		display: flex;
		justify-content:space-between;
		flex-wrap: wrap;
	}
	.viewer #guide01 li.fview01 .vox02 li {
		width:25%;
		height: 150px;
	}
	.viewer #guide01 li.fview01 .vox02 li img {
		display:block;
		margin: 10px auto 0 auto;
		width:93%;
		width:90%;
	}
	.viewer #guide01 li.fview01 #fvcontact {		/* CONTACT e-mail ◆ */
		position:absolute;
		bottom:0px;
		left:0;
		right:0;
		margin:auto;
		width:600px;
		height:0px;
		z-index:9;
	}
	.viewer #guide01 li.fview01 #fvcontact a {
		display:block;
		width:600px;
		height:100px;
		text-align:center;
		font-size:40px;
		line-height:1.0em;
		font-family: "Noto Serif JP", serif;
		font-optical-sizing: auto;
		font-weight: 500;
		font-style: normal;
		font-display: swap;
		letter-spacing:1px;
		color: #fff;
		padding:30px 0 0 0;
		background-color:#48B6BC;	/* misho-green */
		border-radius:100px;
	}
	.viewer #guide01 li.fview01 #fvcontact a:hover {
		display:block;
		width:600px;
		height:100px;
		background-color:#BDC3C7;	/* Siver */
		border-radius:100px;
	}
/*
	.viewer #guide01 li .vox02 {
		position:absolute;
		top:18%;
		right:0;
		width:981px;
		height:521px;
		z-index:0;
	}
	.viewer #guide01 li .vox02 img {
		display:block;
		width:981px;
		height:521px;
	}
*/
	.viewer #guide01 li.fview01 .scbox {	/* ScroollDown BOX */
		display:block;
		position:absolute;
		top:90%;
		left:3%;
		width:150px;
		height: 70px;
		z-index:99;
		position:relative;
	}
	.viewer #guide01 li.fview02 {		/* ■ PC FView #02 */
		margin: 0  auto 0 auto;
		width:100%;
		height:100vh;
		background-image:url("../images/fview/mv02_pc.png");
		background-size:841px 451px;
		background-position: left 82% top 60%;
		background-repeat:no-repeat;
	}
	.viewer #guide01  li.fview02 .vox01 {		/* PC VOX01 ◆  */
		position:absolute;
		top:27%;
		left:23%;
		right:0;
		width:65%;
		height: 450px;
		z-index:1;
	}
	.viewer #guide01 li.fview02 .scbox {	/* ScroollDown BOX */
		display:block;
		position:absolute;
		top:87%;
		left:5%;
		width:150px;
		height: 70px;
		z-index:99;
		position:relative;
	}
	.viewer #guide01 li.fview03 {		/* ■ PC FView #03 */
		margin: 0  auto 0 auto;
		width:100%;
		height:100vh;
		background-image:url("../images/fview/mv03_pc.png");
		background-size:841px 451px;
		background-position: left 82% top 60%;
		background-repeat:no-repeat;
	}
	.viewer #guide01  li.fview03 .vox01 {		/* PC VOX01 ◆  */
		position:absolute;
		top:32%;
		left:20%;
		width:70%;
		height: 450px;
		z-index:1;
	}
	.viewer #guide01 li.fview03 .scbox {		/* ScroollDown BOX */
		display:block;
		position:absolute;
		top:87%;
		left:5%;
		width:150px;
		height: 70px;
		z-index:99;
		position:relative;
	}
	.viewer #guide01 .vox01 .ensc {
		margin: 0 auto 120px auto;
		margin: 30px auto 0 auto;
		font-size:44px;
		font-weight:bold;
		font-family: "Antro_Vectra";
		font-display: swap;
		color: #688b8d;		/* misho-green02 */
		transform: rotate(-7deg);	/*◇斜体 */
	}
	.viewer #guide01 .vox01 .txt01 {
		margin: 0 auto 0 auto;
		width:100%;
		font-size:60px;
		letter-spacing :1.8px;
		line-height:1.5em;
		font-family: "Noto Serif JP", serif;
		font-optical-sizing: auto;
		font-weight:700;
		font-style: normal;
		font-display: swap;
		color: #555;
		padding-left:0;
		z-index:2;
	}
	.viewer #guide01 .vox01 .txt02 {
		margin: 0 auto 0 auto;
		width:90%;
		text-align:center;
		font-size:50px;
		letter-spacing :2px;
		line-height:1.8em;
		font-family: "Noto Serif JP", serif;
		font-optical-sizing: auto;
		font-weight:700;
		font-style: normal;
		font-display: swap;
		color: #FFF;
		padding-left:0;
	}
	.viewer #guide01 .vox01 .txt02 .ensc {
		font-size:30px;
		font-weight:bold;
		font-family: "Antro_Vectra";
		font-display: swap;
		color: #222;
		padding-top:30px;
		transform: rotate(-7deg);	/*◇斜体 */
	}
	.viewer #guide01 .vox01 .txt04 {
		margin: 0 auto 0 auto;
		width:90%;
		font-size:40px;
		letter-spacing :1px;
		line-height:2.2em;
		font-family: "Noto Sans JP", serif;
		font-optical-sizing: auto;
		font-weight:700;
		font-style: normal;
		font-display: swap;
		color: #333;
		padding-left:0;
	}
	.viewer #guide01 .vox01 .txt03 {
		margin: 30px auto 0 auto;
		width:100%;
		font-size:30px;
		line-height:1.8em;
		font-family: "Noto Serif JP", serif;
		font-optical-sizing: auto;
		font-weight:700;
		font-style: normal;
		font-display: swap;
		color: #555;
		padding-left:0;
		z-index:2;
	}
	 .viewer #guide01 .vox01 .fv-hline  {	/* FV H-line */
		display:block;
		position:absolute;
		top:50%;
		left:0%;
		width:60%;
		height: 5px;
		padding-top:0; 
		border-top:1px solid #FFF;
		transform: scaleX(0);		/* 縦 borderline 伸縮 animation　★ */
		transform: scaleX(1);		/* 縦 borderline 伸縮 animation　★ 停止 */
		transform-origin:left;
/*	 	animation : extend-x 2.8s linear 0.0s infinite normal none running;	*/
	 	animation : extend-x 2.8s linear 0.0s ;
	}
	@keyframes extend-x{
		0%{
			transform: scaleX(0);
		}
		 100%{
			  transform: scaleX(1);
		 }
	}
	.viewer #guide01 li .scbox {	/* ScroollDown BOX */
		display:block;
		position:absolute;
		top:97%;
		left:15%;
		width:130px;
		height: 70px;
		z-index:99;
		position:relative;
	}
	.viewer #guide01 li .scbox a {
		display:block;
		margin:0 auto 0 auto;
		width:130px;
		height: 70px;
	}
	.viewer #guide01 li .scbox .scrolldown {		/* ScroolDown */
		display:block;
		position:absolute;
		bottom:0;
		right:10px;
		width:130px;
		height: 70px;
		color: #FFF; 
		font-size:13px;
		text-align:center;
		padding-top:0px; 
		border-left:1px solid #FFF;
		z-index:99;
		transform: scaleY(0);			/* 縦 borderline 伸縮 animation　★ */
		transform-origin: top;
	 	animation : extend-y 0.8s linear 0.0s infinite alternate none running;
	 	animation : extend-y 1.5s linear 0.0s infinite normal none running;
	}
	@keyframes extend-y{
		0%{
			transform: scaleY(0);
		}
		 100%{
			  transform: scaleY(1);
		 }
	}
	.viewer #guide01 li .scbox .scd02 {
		color: #555; 
		border-left:1px solid #777;
	}
	.viewer #guide01 li .scbox .sdtxt {
		position:absolute;
		top:0;
		right:0;
		width:100%;
		font-size:13px;
		text-align:center;
		font-family: "NotoSansCJKjp-Regular";
		font-display: swap;
		color: #FFF;
		letter-spacing:1px;
		padding-top:0px; 
	}
	.viewer #guide01 li .scbox .sdtxt02 {
		color: #555; 
	}
	.viewer #guide01 .txt01 .lighttxt {
		font-size:41px;
		letter-spacing :2px;
		font-family: "NotoSansCJKjp-Light";
		font-display: swap;
		color: #FFF;
		opacity:0.8
	}
	@media only screen and (min-width: 1400px) and (max-width: 1600px) {	/*◇ PC-S */

		.viewer #guide01 li.fview01 .vox01 {		/* PC VOX01 ◆  */
			position:absolute;
			top:21%;
			left:16%;
			right:0;
			width:65%;
			height: 450px;
		}
		.viewer #guide01 .vox01 .txt01 {
			font-size:55px;
		}
		.viewer #guide01 li.fview01 .vox02 {		/* PC VOX02 ◆  */
			display:block;
			position:absolute;
			bottom:15%;
			left:0;
			right:0;
			margin: 14px auto 0;
			width:62%;
			height: 130px;
		}
		.viewer #guide01 .vox01 .txt01 {
			font-size:56px;
			letter-spacing :1.5px;
		}
		.viewer #guide01 .vox01 .txt03 {
			margin: 20px auto 0 auto;
			font-size:28px;
		}
	}
	@media only screen and (min-width: 768px) and (max-width: 1400px) {	/*◇ PC-S */

		.viewer #guide01 li.fview01 .vox01 {		/* PC VOX01 ◆  */
			position:absolute;
			top:22%;
			left:16%;
			right:0;
			width:65%;
			height: 450px;
		}
		.viewer #guide01 .vox01 .txt01 {
			font-size:55px;
		}
		.viewer #guide01 li.fview01 .vox02 {		/* PC VOX02 ◆  */
			display:block;
			position:absolute;
			bottom:15%;
			left:0;
			right:0;
			margin:auto;
			width:62%;
			height: 120px;
		}
		.viewer #guide01 .vox01 .txt01 {
			font-size:52px;
			letter-spacing :1.5px;
		}
		.viewer #guide01 .vox01 .txt03 {
			font-size:25px;
		}
	}

	.viewer #guide02 li {		/* ■ SP  ----------------------------*/
		display:block;
		margin: 0 auto 0 auto;
		width:100%;
		height:435px;
		height:650px;
		position:relative;
	}
	.viewer #guide02 li.fview01 {		/* ■ SP FView #01 */
		margin: 0  auto 0 auto;
		width:100%;
		height:620px;
		background:linear-gradient(rgba(27, 74, 112, 0.0), rgba(27, 74, 112, 0.0)),
		url("../images/fview/mv01_sp.png") no-repeat;
		background-size:cover;
		background-position: center top 0; 
	}
	.viewer #guide02 li.fview02 {		/* ■ SP FView #02 */
		margin: 0  auto 0 auto;
		width:100%;
		height:600px;
		background:linear-gradient(rgba(27, 74, 112, 0.0), rgba(27, 74, 112, 0.0)),
		url("../images/fview/mv02_sp.jpg") no-repeat;
		background-size:cover;
		background-position: center top 0; 
	}
	.viewer #guide02 li.fview03 {		/* ■ SP FView #03 */
		margin: 0  auto 0 auto;
		width:100%;
		height:600px;
		background:linear-gradient(rgba(27, 74, 112, 0.0), rgba(27, 74, 112, 0.0)),
		url("../images/fview/mv03_sp.jpg") no-repeat;
		background-size:cover;
		background-position: center top 0; 
		position:relative;
	}
	.viewer #guide02  li.fview01 .vox01 {	/* SP VOX01 */
		position:absolute;
		top:14%;
		left:0;
		right:0;
		margin:auto;
		width:100%;
		padding:bottom:20px;
	}
	.viewer #guide02 .vox01 .txt01 {
		margin: 0 auto 0 28%;
		width:60%;
		font-size:27px;
		line-height:1.5em;
		font-weight:bold;
		font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
		font-display: swap;
		color: #111;
		padding-left:0;
		padding-bottom:0;
	}
	.viewer #guide02 .vox01 .txt02 {
		margin: 30px auto 0 auto;
		width:100%;
		text-align:center;
		font-size:17px;
		font-weight:bold;
		font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
		font-display: swap;
		color: #111;
	}
	.viewer #guide02 .vox01 .txt03 {
		margin: 20px auto 0 auto;
		width:100%;
		text-align:center;
		font-size:20px;
		font-weight:bold;
		font-family: "Antro_Vectra";
		font-display: swap;
		color: #333;
		padding-top:10px;
	}
	.viewer #guide02 li.fview01 .vox02 {		/* PC VOX02 ◆  */
		display:block;
		position:absolute;
		bottom:0;
		left:0;
		right:0;
		margin:auto;
		width:100%;
/*		height: 100px;*/
		padding:20px 0 40px 0;
		z-index:1;
		background-color:rgba( 255,255,255,0.6 ); 	/*  White  透過60% */
	}
	.viewer #guide02 li.fview01 .vox02 ul {
		margin: 0  auto 0 auto;
		width:85%;
		display: flex;
		justify-content:space-between;
		flex-wrap: wrap;
	}
	.viewer #guide02 li.fview01 .vox02 li {
		width:25%;
		width:50%;
		height: 110px;
	}
	.viewer #guide02 li.fview01 .vox02 li img {
		display:block;
		margin: 0  auto 0 auto;
		width:85%;
	}

	.viewer #guide02 .fview01 .scbox {		/* ScroollDown BOX */
		display:block;
		position:absolute;
		top:37%;
		left:70%;
		width:150px;
		height: 70px;
		z-index:99;
		position:relative;
	}
	.viewer #guide02 .fview02 .scbox {		/* ScroollDown BOX */
		display:block;
		position:absolute;
		top:37%;
		left:70%;
		width:150px;
		height: 70px;
		z-index:99;
		position:relative;
	}
	.viewer #guide02 .fview03 .scbox {		/* ScroollDown BOX */
		display:block;
		position:absolute;
		top:28%;
		left:70%;
		width:150px;
		height: 70px;
		z-index:99;
		position:relative;
	}
	.viewer #guide02 .scbox .scrolldown01 a {		/* ScroolDown */
		display:block;
		position:absolute;
		bottom:0px;
		right:50px;
		width:130px;
		height: 60px;
		color: #FFF; 
		font-size:13px;
		text-align:center;
		padding-top:0px; 
		border-right:1px solid #FFF;
		z-index:7;
		transform: scaleY(0);			/* 縦 borderline 伸縮 animation　★ */
		transform-origin: top;
	 	animation : extend-y 1.5s linear 0.0s infinite normal none running;
	}
	@keyframes extend-y{
		0%{
			transform: scaleY(0);
		}
		 100%{
			  transform: scaleY(1);
		 }
	}
	.viewer #guide02 li .scbox .sdtxt {
		position:absolute;
		top:10px;
		right:40px;
		width:100%;
		color: #FFF;
		font-size:13px;
		text-align:center;
		padding-top:0px; 
	}
	.bx-wrapper .bx-prev {
		background-image:none;
	}
	.bx-wrapper .bx-next {
		background-image:none;
	}
	#fview>.circlesym {	/* ◎ */
		display:block;
		position:absolute;
		bottom:20px;
		left:70%;
		width:86px;
		height:86px;
		background: url( "../images/fview/reservation01.svg" ) no-repeat;
		background-size: 86px 86px;
		background-position:center 0;
		position:relative;
		z-index:1;
			transition: 0.4s ease-in-out;
			-webkit-transition: 0.4s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.4s ease-in-out;
			-o-transition: 0.4s ease-in-out;
	}
	#fview>.circlesym:hover {
		transform:scale(1.1,1.1);
			transition: 0.4s ease-in-out;
			-webkit-transition: 0.4s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.4s ease-in-out;
			-o-transition: 0.4s ease-in-out;
	}
	#fview>.circlesym a {
		display:block;
		width:71px;
		height:71px;
	}
	#fview>.circlesym .circle {
		margin:0 auto 0 auto;
		width:86px;
		height:86px;
		background: url( "../images/fview/circle.svg" ) no-repeat;
		background-size: 142px 142px;
		background-size: 71px 71px;		/* 50% */
		background-position:center center;
	}
	#fview>.circlesym .circle::before {
	 	content: '';
	 	padding-top: 50%;
	}
	/* 回転 */
	#fview>.circlesym .circle {
		animation-name: rotate;
		animation-duration: 15s;
		animation-timing-function: cubic-bezier(0.5, 0.51, 0.51, 0.52);
		animation-iteration-count: infinite;
	}
	@keyframes rotate {
		 0% {
		 	transform: rotateZ(0);
		 }
		 100% {
			transform: rotateZ(360deg);
		}
	}
	#fview>.circlesym .syml {
		position:absolute;
		top:35%;
		left:0;
		right:0;
		margin:auto;
		width:273px;
		width:68px;
		height:106px;
		height:27px;
		text-align:center;
	}

	@media only screen and  (max-width: 360px) {

	}

	@media only screen and (min-width: 992px) {

		#fview {	
		}
		#viewerPC {
			display:block;
		}
		#viewerSP {
			display:none;
		}
		#fview>.circlesym {	/* ◎ */
			display:block;
			position:absolute;
			bottom:50px;
/*			right:5%;	*/
			left:85%;
			width:171px;
			height:171px;
			z-index:1;
			background: url( "../images/fview/reservation01.svg" ) no-repeat;
			background-size: 171px 171px;
			background-position:center 0;
		}
		#fview>.circlesym a {
			display:block;
			width:171px;
			height:171px;
		}
		#fview>.circlesym .circle {
			margin:0 auto 0 auto;
			width:171px;
			height:171px;
			background: url( "../images/fview/circle.svg" ) no-repeat;
			background-size: 142px 142px;
			background-position:center center;
		}
		#fview>.circlesym .circle::before {
		 	content: '';
		 	padding-top: 50%;
		}
		/* 回転 */
		#fview>.circlesym .circle {
			animation-name: rotate;
			animation-duration: 15s;
			animation-timing-function: cubic-bezier(0.5, 0.51, 0.51, 0.52);
			animation-iteration-count: infinite;
		}
		@keyframes rotate {
			 0% {
			 	transform: rotateZ(0);
			 }
			 100% {
				transform: rotateZ(360deg);
			}
		}
		#fview>.circlesym .syml {
			position:absolute;
			top:35%;
			left:0;
			right:0;
			margin:auto;
			width:218px;
			height:85px;
			text-align:center;
		}
	}
	/* Tablet Layout ◇ */
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#wrapper {
			margin-top: 0;
		}
		#viewerPC {
			display:block;
			margin: 0  auto 0 auto;
		}
		#viewerSP{
			display:none;
			margin: 0 auto -80px auto;
			margin: 0 auto 0 auto;
		}
		.viewer #guide02 li.fview01 {		/* ■ tablet FView #01 */
			margin: 0  auto 0 auto;
			width:100%;
			height:400px;
			background	: url("../images/fview/kv01_tab.jpg") no-repeat;
			background-size:cover;
			background-position: center top 0; 
			position:relative;
		}
		.viewer #guide02 li.fview02 {		/* ■ tablet FView #02 */
			margin: 0  auto 0 auto;
			width:100%;
			height:400px;
			background	: url("../images/fview/kv02_tab.jpg") no-repeat;
			background-size:cover;
			background-position: center top 0; 
			position:relative;
		}
		.viewer #guide02 li.fview03 {		/* ■ tablet FView #03 */
			margin: 0  auto 0 auto;
			width:100%;
			height:400px;
			background:linear-gradient(rgba(27, 74, 112, 0.2), rgba(27, 74, 112, 0.2)),
			url("../images/fview/kv03_tab.jpg") no-repeat;
			background-size:cover;
			background-position: center top 0; 
			position:relative;
		}
		.viewer #guide02 .vox03 .txt01 {
			margin: 12% auto 0 auto;
			width:90%;
			font-size:16px;
			line-height:2.0em;
			text-align:center;
			font-weight:bold;
			color: #FFF;
			padding-left:0;
			padding-bottom:0;
		}
		#fview>.circlesym {	/* ◎ */
			display:block;
			position:absolute;
			top:25%;
			right:7%;
			width:99px;
			height:106px;
			z-index:1;
		}
	}
	.bx-wrapper .bx-prev {	/* < FV削除 */
		display:none;
	}
	.bx-wrapper .bx-next {	/* > FV削除 */
		display:none;
	}
	.bx-wrapper .bx-pager {	/* pager 〇● */
		position: absolute;
		bottom: -50px;
	}

	.cat .prev {
		display:none;
	}
	.cat  .next {
		display:none;
	}
	.slick-arrow {
	    display: none;
	}

