@charset "utf-8";
/***************************************************************************************************
	catalog.css
***************************************************************************************************/
#page_catalog {
	position: relative;
	overflow: hidden;
}
/*
*/
#page_catalog .gsty_2 .blk_1_1_1 .blk_sty_1::before {
	background-image: url('../images/page_catalog_img_1.jpg');
}
#page_catalog .blk_1_2 {
	position: relative;
	width: 100%;
	max-width: 1400px;
	height: 100%;
	margin: auto;
	padding:50px 8% 80px 8%;
	opacity: 0;
}
#page_catalog .blk_1_2 p {
	position: relative;
	font-size: 16px;
	line-height: 175%;
}
#page_catalog .blk_1.psa_ready .blk_1_2 {
	opacity: 0;
	transform:translateY(20px);
}
#page_catalog .blk_1.psa_show .blk_1_2 {
	opacity: 1;
	transform:translateY(0);
	transition: opacity 1s ease-out .4s, transform .6s ease-out .4s;
}
/*
*/
#page_catalog .blk_2 {
	position: relative;
	width: 100%;
	max-width: 1400px;
	margin: auto;
	padding:0  8% 0 8%;
}
#page_catalog .blk_2_1 {
	position: relative;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
}
#page_catalog .blk_2_1 .rep_1 {
	width: 29%;
	display: flex;
	flex-direction: column;
	position: relative;
}
#page_catalog .blk_2.psa_ready .blk_2_1 .rep_1 {
	opacity: 0;
	transform:translateY(40px);
	pointer-events: none;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1 {
	opacity: 1;
	transform:translateY(0);
	transition: opacity 1s ease-out 0s, transform .6s ease-out 0s;
	pointer-events: auto;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(1) {
	transition-delay: .4s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(2) {
	transition-delay: .8s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(3) {
	transition-delay: 1.2s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(4) {
	transition-delay: 1.6s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(5) {
	transition-delay: 2s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(6) {
	transition-delay: 2.4s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(7) {
	transition-delay: 2.8s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(8) {
	transition-delay: 3.2s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(9) {
	transition-delay: 3.6s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(10) {
	transition-delay: 4s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(11) {
	transition-delay: 4.4s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(12) {
	transition-delay: 4.8s;
}
#page_catalog .blk_2_1 .rep_1:nth-of-type(3n + 1)::before {
	position: absolute;
	display: block;
	content: '';
	width: 200vw;
	height: 220px;
	left:0;
	top:45%;
	transform: translateX(-50%);
	background-color: #f5f5f5;
	transform-origin: 0 0;
}
#page_catalog .blk_2.psa_ready .blk_2_1 .rep_1:nth-of-type(3n + 1)::before {
	transform: translateX(-50%) scaleX(0);
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(3n + 1)::before {
	transform: translateX(-50%) scaleX(1);
	transition: transform 1s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(1)::before {
	transition-delay: 1.4s;
}
#page_catalog .blk_2.psa_show .blk_2_1 .rep_1:nth-of-type(4)::before {
	transition-delay: 2.6s;
}
#page_catalog .blk_2_1 .rep_1.blk_empty {
	padding: 0;
}
#page_catalog .blk_2_1 .rep_1.blk_empty::before {
	display: none;
}
#page_catalog .blk_2_1 .rep_1_1 {
	position: relative;
	order: 2;
	padding: 0 0 120px 0;
}
#page_catalog .blk_2_1 .rep_1_1 h3 {
	position: relative;
	padding: 20px 0 0 0;
}
#page_catalog .blk_2_1 .rep_1_1 h3 span {
	position: relative;
	display: block;
}
#page_catalog .blk_2_1 .rep_1_1 h3 span:nth-of-type(1) {
	font-size: 18px;
	line-height: 150%;
	font-weight: 700;
	padding: 0 0 10px 0;
}
#page_catalog .blk_2_1 .rep_1_1 h3 span:nth-of-type(2) {
	font-size: 16px;
	line-height: 150%;
}
#page_catalog .blk_2_1 .rep_1_2 {
	position: relative;
	order: 1;
	width: 100%;
	padding: 100% 0 0 0;
}
#page_catalog .blk_2_1 .rep_1_2 p {
	position: absolute;
	left:0;
	top:0;
	width: 100%;
	height: 100%;
}
#page_catalog .blk_2_1 .rep_1_2 p a {
	position: absolute;
	left:0;
	top:0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
#page_catalog .blk_2_1 .rep_1_2 p a img {
	position: absolute;
	display: block;
	left:0;
	top:0;
	width: 100%;
	height: auto;
}
#page_catalog .blk_2_1 .rep_1_2 p a span {
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
}
#page_catalog .blk_2_1 .rep_1_2 p a span::before {
	position: absolute;
	display: block;
	content: '';
	width: 100%;
	height: 100%;
	background-color: #000000;
	opacity: .6;
	transform-origin: 100% 0;
	transform: scaleX(0);
	transition: transform .4s  cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
}
#page_catalog .blk_2_1 .rep_1_2 p.btn_over a span::before {
	transform-origin: 0 0;
	transform: scaleX(1);
}
#page_catalog .blk_2_1 .rep_1_2 p a span::after {
	position: absolute;
	display: block;
	content: 'VIEW MORE';
	font-size: 11px;
	line-height: 100%;
	left:50%;
	top:50%;
	transform: translate(-50%, -50%);
	transform-origin: 0 0;
	color:#ffffff;
	opacity: 0;
	padding: 20px 0 0 0;
}
#page_catalog .blk_2_1 .rep_1_2 p.btn_over a span::after {
	opacity: 1;
	padding: 0;
	transition:padding .4s ease-out .2s, opacity .4s ease-out .2s;
}
#page_catalog .blk_2_1 .rep_1 div[data-catalog-id] {
	position: absolute;
	display: block;
	left:0;
	top:0;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	border: 1px solid #7d7d7d;
	text-align: center;
	transform: translate(-50%, -50%);
	z-index: 3;
}
#page_catalog .blk_2_1 .rep_1 div[data-catalog-id]::before {
	position: absolute;
	display: block;
	content: attr(data-catalog-id)"";
	left:0;
	top:0;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	font-size: 24px;
	font-family: 'RennerBook';
	text-align: center;
	line-height: 50px;
}
/*  */
#page_catalog .blk_2_1 .rep_1_3 {
	display: none;
}
/*
*/
#page_catalog .blk_3 {
	position: relative;
}
#page_catalog .blk_3 .gsty_1 {

}
/***************************************************************************************************
  responsive
***************************************************************************************************/

@media screen and (max-width: 1000px) {
#page_catalog {
}
/*
*/
#page_catalog .blk_1_2 {
	height: auto;
	margin: auto;
	padding:20px 5% 0 5%;
}
#page_catalog .blk_1_2 p {
	padding: 0 0 0 0;
}
#page_catalog .blk_1_2 br {
	display: none;
}
/*
*/
#page_catalog .blk_2 {
	padding:60px 10% 0 10%;
}
#page_catalog .blk_2_1 {
	width: auto;
	display: block;
}
#page_catalog .blk_2_1 .rep_1 {
	width: 100%;
	padding: 0 0 20px 0;
}
#page_catalog .blk_2_1 .rep_1:nth-of-type(3n + 1)::before {
	display: none;
}
#page_catalog .blk_2_1 .rep_1.blk_empty::before {
	display: none;
}
#page_catalog .blk_2_1 .rep_1_1 {
	padding: 0 0 40px 0;
}
#page_catalog .blk_2_1 .rep_1_1::before {
	position: absolute;
	display: block;
	content: '';
	left:50%;
	top:0;
	width: 100vw;
	height: 100%;
	transform: translate(-50%, 0);
	background-color: #f5f5f5;
}
#page_catalog .blk_2_1 .rep_1_1 h3 {
	position: relative;
	padding: 30px 0 0 0;
}
#page_catalog .blk_2_1 .rep_1_1 h3 span {
	position: relative;
	display: block;
}
#page_catalog .blk_2_1 .rep_1_1 h3 span:nth-of-type(1) {
	padding: 0 0 5px 0;
}
#page_catalog .blk_2_1 .rep_1_1 h3 span:nth-of-type(2) {
}
#page_catalog .blk_2_1 .rep_1_2 {
	position: relative;
	order: 1;
	width: 100%;
	padding: 100% 0 0 0;
}
#page_catalog .blk_2_1 .rep_1_2::before {
	position: absolute;
	display: block;
	content: '';
	left:50%;
	top:100%;
	width: 100vw;
	height: 100px;
	transform: translate(-50%, -100%);
	background-color: #f5f5f5;
}
#page_catalog .blk_2_1 .rep_1_2 p {
}
#page_catalog .blk_2_1 .rep_1_2 p a {
}
#page_catalog .blk_2_1 .rep_1_2 p a img {
}
#page_catalog .blk_2_1 .rep_1_2 p a span {
}
#page_catalog .blk_2_1 .rep_1_2 p a span::before {
}
#page_catalog .blk_2_1 .rep_1_2 p.btn_over a span::before {
}
#page_catalog .blk_2_1 .rep_1_2 p a span::after {
}
#page_catalog .blk_2_1 .rep_1_2 p.btn_over a span::after {
}
#page_catalog .blk_2_1 .rep_1 div[data-catalog-id] {
}
#page_catalog .blk_2_1 .rep_1 div[data-catalog-id]::before {
}
/*  */
#page_catalog .blk_2_1 .rep_1_3 {
	position: relative;
	order: 3;
	transform: translateY(-50%);
	display: block;
	text-align: right;
}
#page_catalog .blk_2_1 .rep_1_3 a {
	position: relative;
	display: inline-block;
	width: auto;
	height: 60px;
	padding: 0 60px 0 0;
}
#page_catalog .blk_2_1 .rep_1_3 a span {
	position: relative;
	font-size: 12px;
	line-height: 60px;
	white-space: nowrap;
	pointer-events: none;
}
#page_catalog .blk_2_1 .rep_1_3 a span.nm_js_svg_1 {
	position: absolute;
	display: block;
	width: 60px;
	height: 60px;
	left:100%;
	top:50%;
	transform: translate(-60px, -50%) scale(.8);
	pointer-events: none;
	/* border: 1px solid #ff0000; */
}
/*
*/
#page_catalog .blk_3 {
padding: 0 0 0 0;
}


}
