@charset "UTF-8";

/* ====================================
	プラグイン・アニメーション設定
 ==================================== */

.scroll-fade-in {
	opacity: 0;
}

.scroll-fade-in.passed {
	opacity: 1;
	animation: MvPop1 0.15s linear;
}

/* スライドショー */


/* スライドショー：NEXT/PREV */
.slide-text {
	padding: 0.5em;
	font-size: 1.2rem;
	position: absolute;
	left: 0;
	bottom: 0;
}
.slide-next, .slide-prev {
	position: absolute;
	top: 50%;
	width: 50px;
	height: 50px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	transform: translate(0, -50%);
	cursor: pointer;
	z-index: 2;
}

.slide-prev {
	background-image: url(images/arrow-left.svg);
	left: 0;
	right: auto
}

.slide-next {
	background-image: url(images/arrow-right.svg);
	right: 0;
	left: auto
}

.swiper-pagination-bullets {
	margin-top: 1rem;
	text-align: center;
}

.swiper-pagination-bullets .swiper-pagination-bullet {
	width: 1.2rem;
	height: 1.2rem;
	margin-left: .8rem;
	background: #D9D9D9;
	border: solid 1px #707070;
	opacity: 1;
}

.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: #707070;
}

/* ====================================
	スマートフォン専用スタイル
===================================== */
@media only screen and (max-width: 767px) {

	/* 製品ページナビメニュー */
	ul.list-page-navi .front {
		display: none;
	}

	/* 追尾ナビ */
	.page-navi-fix-wrap {
		display: none;
	}

	/* スライドショー */
	.slide-ba {
		padding-top: 60.4%;
		position: relative;
	}
	.slide-ba .swiper-container {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.slide-wrap {
		width: 100%;
		height: 100%;
		position: absolute;
		bottom: -100%;
		left: 50%;
		transform: translate(-50%,0);
		transition: .4s;
	}
	.swiper-slide-active .slide-wrap {
		bottom: 0;
	}
	.slide-img-text {
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0;
	}
	.swiper-slide-active .slide-img-text {
		opacity: 1;
		transition-duration: .4s;
		transition-delay: 1s;
	}
	.slide-title-container {
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.slide-title-container .icon {
		width: 10vw;
		height: 10vw;
		padding: 1%;
		margin-right: 1rem;
		background: #F55747;
		border-radius: 50%;
	}
	.slide-title {
		flex: 1;
		font-size: 1.8rem;
		font-weight: bold;
	}
	.slide-img {
	}

}

/* ====================================
	PC&タブレット、印刷専用スタイル
===================================== */
@media print , screen and (min-width: 768px) {

}

/* ====================================
	タブレット専用スタイル
===================================== */
@media screen and (min-width:768px) and (max-width:1079px) {

	/* 追尾ナビ */
	.page-navi-fix-wrap {
		display: none;
	}

	/* スライドショー */
	.slide-ba {
		margin: 8rem auto 0;
		padding-top: 60.4%;
		position: relative;
	}
	.slide-ba .swiper-container {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.slide-wrap {
		width: 100%;
		height: 100%;
		position: absolute;
		bottom: -100%;
		left: 50%;
		transform: translate(-50%,0);
		transition: .4s;
	}
	.swiper-slide-active .slide-wrap {
		bottom: 0;
	}
	.slide-img-text {
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0;
	}
	.swiper-slide-active .slide-img-text {
		opacity: 1;
		transition-duration: .5s;
		transition-delay: 1s;
	}
	.slide-title-container {
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.slide-title-container .icon {
		width: 10%;
		padding: 1%;
		margin-right: 20px;
		background: #F55747;
		border-radius: 50%;
	}
	.slide-title {
		font-size: 2.6rem;
		font-weight: bold;
	}
	.slide-img {
	}

}

/* ====================================
	PC専用スタイル
===================================== */
@media only screen and (min-width: 1080px) {

	/* 追尾ナビ */
	article {
		overflow: hidden;
	}
	#pageNaviFix {
		display: flex;
		flex-direction:column;
		flex-wrap: wrap;
		justify-content: center;
		align-content: center;
		width: auto;
		height: 100%;
		min-height: 100vh;
		position: fixed;
		top: 0;
		right: 0;
		z-index: 10;
		opacity: 0;
		transform: translate(100%, 0);
		transition: .3s;
		overflow: hidden;
	}
	.passed #pageNaviFix {
		opacity: 1.0;
		transform: translate(0, 0);
	}
	.passed.hidden #pageNaviFix {
		opacity: 0;
		transform: translate(100%, 0);
	}
	#pageNaviFix.fix {
		position: fixed;
		z-index: 10;
	}
	#pageNaviFix .top,
	#pageNaviFix ul li {
		font-size: 1.2rem;
		text-align: right;
		color: #535353;
	}
	#pageNaviFix .top a,
	#pageNaviFix ul li a {
		padding: 10px 32px 10px 4px;
		text-decoration: none;
	}
	#pageNaviFix .top a::after,
	#pageNaviFix ul li a::after {
		content: '';
		display: inline-block;
		width: 10px;
		height: 10px;
		margin-left: 6px;
		border: solid 2px #F5F5F5;
		background: #535353;
		border-radius: 50%;
	}
	#pageNaviFix ul li {
		margin-top: 32px;
	}
	#pageNaviFix .top a span,
	#pageNaviFix ul li a span {
		display: none;
	}
	#pageNaviFix ul li a.active {
		color: #F55747;
	}
	#pageNaviFix ul li a.active::after {
		border: solid 2px #F55747;
		background: #F55747;
	}
	#pageNaviFix .top a.on-mouce span,
	#pageNaviFix ul li a.on-mouce span, #pageNaviFix ul li a.active span {
		display: inline-block;
	}

	/* スライドショー */
	.slide-ba {
		max-width: 960px;
		margin: 8rem auto 0;
		padding-top: 580px;
		position: relative;
	}
	.slide-ba .swiper-container {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.slide-wrap {
		width: 960px;
		height: 100%;
		position: absolute;
		bottom: -100%;
		left: 50%;
		transform: translate(-50%,0);
		transition: .4s;
	}
	.slide-img-text {
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0;
	}
	.swiper-slide-active .slide-img-text {
		opacity: 1;
		transition-duration: .5s;
		transition-delay: 0.6s;
	}
	.swiper-slide-active .slide-wrap {
		bottom: 0;
	}
	.slide-title-container {
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.slide-title-container .icon {
		width: 100px;
		height: 100px;
		padding: 10px;
		margin-right: 20px;
		background: #F55747;
		border-radius: 50%;
	}
	.slide-title {
		font-size: 2.6rem;
		font-weight: bold;
	}

	/* 製品ページナビメニュー */
	ul.list-page-navi>li>a {
		position: relative;
	}
	ul.list-page-navi .front,
	ul.list-page-navi .back {
		backface-visibility: hidden;
		transition: all 0.5s ease-in-out 0.1s;
	}
	ul.list-page-navi .back {
		position: absolute;
		top: 0;
		left: 0;
	}
	ul.list-page-navi .front {
		display: block;
		transform: rotateY(-180deg);
	}
	ul.list-page-navi>li>a.hovering .back {
		transform: rotateY(180deg);
	}
	ul.list-page-navi>li>a.hovering .front {
		transform: rotateY(0deg);
	}

}

/* ====================================
	印刷専用スタイル
===================================== */
@media print {
	.page-navi-fix-wrap,
	.fix-sub-title-wrap {
		display: none;
	}
}