/*----------------------------------------------------------------------------*/
/* 	 2ndary First View								  CSS    */
/*----------------------------------------------------------------------------*/

	/* ☆ KeyVisual Image Area --------------*/
	#fview {	
		display:block;
		margin: 0  auto 0 auto;
		width: 100%;
		padding-bottom:0px;
		background-color: #FFF;
		border-bottom:none;
		border:none;
		padding-top:60px;
		position: relative;
	}
	.viewer{
		margin: 0  auto 0 auto;
		border:none;
	}
	#sviewerSP{				/* ●SP */
		display:block;
		margin: 0  auto 0 auto;
		background:linear-gradient(90deg,#EFEFEF 0%,#EFEFEF 47%,white 47%,white 100%);	/* ★ */
	}
	#sviewerPC {
		display:none;		/* ●PC */
	}
	#viewerSP{
		display:block;
		margin: 0  auto 0 auto;
		background-color:#FFF;
	}
	#sviewerSP .box01 {
		margin: 0  auto 0 auto;
		width:90%;
		text-align:right;
	}
	#sviewerSP h2 {
		display:block;
		margin: 0  auto 0 auto;
		font-weight:bold;
		font-size:17px;
		font-family: "游ゴシック体", YuGothic,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",
					"NotoSansCJKjp-Bold";
		color: #444;
		padding-top:14px;
	}
	#sviewerSP .h1subt {
		display:block;
		margin: 7px  auto 0 auto;
		font-size:12px;
		font-weight:bold;
		font-family: "Athelas-Regular";
		flex-wrap: wrap;
		color: #AAA;
		padding-bottom:10px;
	}
	#viewerPC {
		display:none;
	}
	#fview>.circlesym {	/* ◎ */
		display:none;
		position:absolute;
		bottom:20px;
		left:70%;
		width:87px;
		height:86px;
		background: url( "../images/fview/online01.svg" ) no-repeat;
		background-size: 87px 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:87px;
		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: 768px) {

		#fview {	
			display:block;
			margin: 0  auto 0 auto;
			width: 100%;
			padding-bottom:0px;
			background-color: transparent;
			border:none;
			padding-top:90px;
			position: relative;
		}
		#sviewerPC {			/* ●PC */
			display:block;
			margin: -20px  auto 0 auto;
			width: 100%;
			height:180px;
			height:190px;
			background:linear-gradient(180deg,#EFEFEF 0%,#EFEFEF 5%,white 5%,white 63%,#F4F4F4 63%,#F4F4F4 97%,#0c3484 97%,#0c3484 98%,#EFEFEF 98%,#EFEFEF 100% );	/* ★ */
			position: relative;
		}

		#sviewerPC .box01 {
			display:block;
			position: absolute;
			top: 35px;
			right:0;
			left:0;
			margin:auto;
			width:40%;
		}
		#sviewerPC .box01 h2 {
			display:block;
			margin: 0  auto 0 auto;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 700;
			font-style: normal;
			font-display: swap;
			text-align:center;
			font-size:36px;
			letter-spacing:2px;
			color: #555;
		}
		#sviewerPC .box01 .h1subt {
			display:block;
			margin: 30px  auto 0 auto;
			font-size:24px;
			font-size:46px;
			font-weight:bold;
			text-align:center;
			font-family: "Athelas-Regular";
			flex-wrap: wrap;
			color: #777;
			letter-spacing:2px;
		}
		#sviewerPC dl,dt,dd {
			display:block;
		}
		#sviewerPC .rqsym {
			display:block;
			position: absolute;
			top: 27px;
			top: 10px;
			right:8%;
			width:474px;
			height:85px;
			width:379px;
			height:68px;
		}
		#sviewerPC .rqsym #fvsym01 img {
			display:block;
			margin: 25px  auto 0 auto;
		}
		#sviewerPC .rqsym dd.fv-hline  {	/* FV H-line */
			display:block;
			margin: 8px  auto 0 auto;
			width:100%;
			height: 5px;
			padding-top:0; 
			border-top:2px solid #d03c1b;		/* svs-red01 */
			transform: scaleX(1);				/* 縦 borderline 伸縮 animation　★0:loop */
			transform-origin:left;
		 	animation : extend-x 0.8s linear 0.0s infinite alternate none running;
		 	animation : extend-x 3.0s linear 0.0s  infinite normal none running;	/* loop */
	 		animation : extend-x 3.8s linear 0.0s ;	/* 停止 */
		}
		@keyframes extend-x{
			0%{
				transform: scaleX(0);
			}
			 100%{
				  transform: scaleX(1);
			 }
		}
		#sviewerSP{			/* ●SP */
			display:none;
		}

		#viewerPC {
			display:block;
		}
		#viewerSP{
			display:none;
		}
		#fview>.circlesym {	/* ◎ */
			display:block;
			position:absolute;
			bottom:-10px;
/*			right:5%;	*/
			left:80%;
			width:171px;
			height:171px;
			z-index:2;
			background: url( "../images/fview/online01.svg" ) no-repeat;
			background-size: 171px 170px;
			background-position:center 0;
		}
		#fview>.circlesym a {
			display:block;
			width:171px;
			height:170px;
		}
		#fview>.circlesym .circle {
			margin:0 auto 0 auto;
			width:171px;
			height:170px;
			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;
		}
		#sviewerPC {
			display:none;
		}
		#sviewerSP{
			display:block;
			margin: -30px  auto 0 auto;
			background:linear-gradient(90deg,#0c3484 0%,#0c3484 40%,white 40%,white 100%);	/*★ */
		}

		#viewerPC {
			display:none;
		}
		#viewerSP{
			display:block;
		}
		#sviewerSP .box01 {
			margin: 0  auto 0 auto;
			width:70%;
		}
		#sviewerSP h2 {
			display:block;
			margin: 0  auto 0 auto;
			font-weight:bold;
			font-size:20px;
			padding-top:20px;
		}
		#sviewerSP .h1subt {
			margin: 7px  auto 0 auto;
			font-size:20px;
		}
		#fview>.circlesym {	/* ◎ */
			display:none;
		}
	}
	.bx-wrapper .bx-prev {
		display:none;
	}
	.bx-wrapper .bx-next {
		display:none;
	}

	.cat .prev {
		display:none;
	}
	.cat  .next {
		display:none;
	}
	.slick-arrow {
	    display: none;
	}
	.bx-wrapper .bx-pager {
		display:none;
	}