.banner-container {
	width: 100%;
	height: 100vh;
}

.banner-container .swiper-slide {
	position: relative;
	overflow: hidden;
}

.banner-container .swiper-slide>img {
	min-height: 100%;
	min-width: 100%;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}

.product-info {
	position: absolute;
	left: 10%;
	top: 50%;
	transform: translateY(-50%);
	width: 730px;
	padding: 60px 70px;
	background-color: #8d3e39;
}

.product-info .title {
	font-size: 24px;
	padding-bottom: 15px;
	position: relative;
}

.product-info .title::after {
	content: '';
	width: 100%;
	height: 1px;
	background-color: #e4d7d0;
	opacity: 0.5;
	position: absolute;
	bottom: 0;
	left: 0;
}

.product-info .title h2 {
	font-size: 46px;
	line-height: 60px;
	margin: 0;
}

.product-info dl {
	margin-top: 40px;
	font-size: 24px;
	padding-left: 40px;
}

.product-info dl dt {
	font-weight: normal;
	position: relative;
}

.product-info dl dt img {
	position: absolute;
	left: -40px;
	top: 50%;
	transform: translateY(-50%);
}

.page2,
.page3,
.page4{
	width: 100%;
	height: 100vh;
	position: relative;
	overflow: hidden;
}

.page2>div,
.page3>div,
.page4>div {
	width: 50%;
	flex: 1;
}

.info {
	height: 100%;
	background: url(../img/bg.jpg) repeat;
}

.img {
	position: relative;
}

.img img {
	height: 100%;
	width: 100%;
}

.info>div {
	width: 700px;
}

.info h5 {
	font-size: 28px;
}

.info h1 {
	font-size: 64px;
	margin-bottom: 60px;
}

.info h2 {
	font-size: 52px;
}

.info h2 span:last-of-type {
	font-size: 20px;
}

.info-item {
	font-size: 26px;
	line-height: 45px;
	padding-left: 126px;
	text-align: justify;
	position: relative;
}

.info-item::before {
	content: '';
	width: 0;
	height: 0;
	border-left: 12px solid #e4d7d0;
	border-right: 12px solid transparent;
	border-top: 9px solid transparent;
	border-bottom: 9px solid transparent;
	position: absolute;
	left: 94px;
	top: 13px;
}

.info-item .patent {
	font-size: 16px;
	line-height: 36px;
}

@media (min-width: 768px) {
	.product-info {
		transform: translateY(-50%) scale(0.7);
	}
	
	.info >div{
		transform: scale(0.7);
	}
}

@media (min-width: 992px) {
	.product-info {
		transform: translateY(-50%) scale(0.75);
	}
	
	.info >div{
		transform: scale(0.8);
	}
}

@media (min-width: 1200px) {
	.info >div{
		transform: scale(0.85);
	}
}

@media (min-width: 1444px) {
	.product-info {
		transform: translateY(-50%) scale(0.95);
	}
	
	.info >div{
		transform: scale(0.95);
	}
}