@charset "UTF-8";

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

.swiper-container {
	margin-top: 4rem;
}

.slide-text {
	text-align: center;
	font-size: 1.2rem;
	margin-top: .4em;
}

.slide-next,
.slide-prev {
	position: absolute;
	top: 38%;
	width: 30px;
	height: 40px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	cursor: pointer;
	z-index: 2;
}

.slide-next {
	background-image: url('/reizo/products/fjhm7k/feature/images/arrow-right.svg');
	right: 1%;
	left: auto;
}

.slide-prev {
	background-image: url('/reizo/products/fjhm7k/feature/images/arrow-left.svg');
	left: 1%;
	right: auto;
}

/* スライダー：サムネイル */
ul.slide-thumbs {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 2rem;
}

ul.slide-thumbs a {
	display: block;
	cursor: pointer;
	padding: 2px;
}

ul.slide-thumbs li {
	width: calc(92% / 4);
	margin-top: 1%;
	margin-left: 1%;
	border: solid 2px #fff;
}

ul.slide-thumbs li.active {
	border: solid 2px #a0a0a0;
}

ul.slide-thumbs li.active a {
	opacity: 0.5;
}

ul.slide-thumbs li:nth-child(-n+5) {
	margin-top: 0;
}

ul.slide-thumbs li:nth-child(5n-4) {
	margin-left: 0;
}

/* ====================================
	共通スタイル
 ==================================== */

ul.list-figures {
	margin-top: 1rem;
}

ul.list-figures li {
	width: 32%;
	margin-top: 0;
}

ul.list-figures li:not(:first-of-type) {
	margin-left: 2%;
}

.fig-caption-bottom figcaption {
	text-align: left;
}

/* ====================================
	スマートフォン専用スタイル
===================================== */
@media only screen and (max-width: 767px) {
	ul.list-figures {
		display: flex;
		flex-wrap: wrap;
	}
}

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

	.swiper-container {
		margin-top: 8rem;
	}

	.slide-text {
		text-align: center;
		font-size: 1.4rem;
		margin-top: .4em;
	}

	.slide-next,
	.slide-prev {
		top: 45%;
		width: 40px;
		height: 50px;
	}

	ul.slide-thumbs li {
		width: calc(65% / 4);
	}
}