﻿/*.qn1品牌简介*/

.qn1 .part1{
	width: 48%;
	position:relative;
}
.qn1 .part1 img{
	width: 100%;
}
.qn1 .part1 .part1-fonts{
	position:absolute;
	top: 6.6%;
    left: 30%;
	font-size: 14px;
	color:#000333;
}
.qn1 .part1 .part1-fonts .p1{
    font-size: .34rem;
    color: #7d282d;
    font-weight: lighter;
    margin-bottom: .06rem;
    margin-top: .1rem;
}
.qn1 .part2{
	width: 50%;
	padding-left: 3%;
	box-sizing: border-box;
	margin-top: 50px;
}
.qn1 .part2 .p1{
	font-size: 30px;
	color:#000333;
	margin-bottom: 10px;
}
.qn1 .part2 .p1 span{
	color:#7d282d;
}
.qn1 .part2 .p2{
    font-size: 14px;
    color: #000333;
    margin-bottom: 15px;
    line-height: 28px;
    font-weight: lighter;
    text-align: justify;
}
.qn1 .part2 .p2 span{
	font-size: 22px;
}


/*qn2品牌历程*/
.qn2{
	height: 100%;
	position:relative;
	box-sizing: border-box;
	overflow-x: hidden;
}
.qn2 .part{
	width: 80%;
	margin:0 auto;
	position:relative;
}
.qn2 .part img{
	width: 100%;
}
.qn2 .part .img-fonts{
	position:absolute;
    top: 30.2%;
    left: 47%;
}
.qn2 .part .img-fonts .fonts1{
	font-size: 0.49rem;
	color:#7d282d;

}
.qn2 .part .img-fonts .fonts2{
	font-size: 0.36rem;
	line-height: 0.4rem;
}
.qn2 .part .img-fonts .fonts3{
	font-size: 0.14rem;
}
.qn2 .part .p{
	display: inline-block;
	font-size: 0.14rem;
	text-align: center;
	position:absolute;
}
.qn2 .part .p1{
	left: -3%;
	top: 19%;
}
.qn2 .part .p2{
	left: -3%;
	top: 42%;
}
.qn2 .part .p3{
	left: -3%;
	top: 62%;
}
.qn2 .part .p4{
	right: -5%;
	top: 12%;
}
.qn2 .part .p5{
	right: -1%;
	top: 31%;
}
.qn2 .part .p6{
	right: -10%;
	top: 51%;
}
.qn2 .part .p7{
	right: -9%;
	top: 67%;
}
.qn2 .part-b{
    position: relative;
    margin-top: -12%;
    width: 112%;
    height: 217px;
    overflow: hidden;
    left: -6%;
}
.qn2 .part-b img{
	position:absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	overflow: hidden;
}

/*.qn3品牌承诺*/
.qn3{
	/*background-color:rgba(0,0,0,0.5);*/
	height: 100%;
}
.qn3 .part1{
	width: 40%;
	height: 100%;
	position:relative;
	overflow: hidden;
}
.qn3 .part1 img{
	width: 100%;
}
.qn3 .part2{
	width: 57%;
}
.qn3 .part2 .p1{
	font-size: 0.18rem;
	color:#c4b798;
}
.qn3 .part2 .line{
	width: 60px;
	height: 2px;
	background-color: #7d282d;
	margin:10px 0;
}
.qn3 .part2 .p2{
	font-size: 0.74rem;
	color:#7d282d;
}
.qn3 .part2 .p2 span{
	font-weight: lighter;
}
.qn3 .part2 .p3{
	font-size: 0.28rem;
	color:#000333;
	font-weight: lighter;
}
.qn3 .part2 .line2{
	background-color: #c4b798;
}
.qn3 .part2 .part2-main{
	width: 100%;
}
.qn3 .part2 .part2-main .main-l{
	width: 55%;
}
.qn3 .part2 .part2-main .main-p1{
	font-size: 0.18rem;
	color:#c4b798;
}
.qn3 .part2 .part2-main .main-p2{
    font-size: 0.34rem;
    color: #7d282d;
    text-indent: -20px;
    font-weight: lighter;
}
.qn3 .part2 .part2-main .main-part{
	width: 100%;
	font-size: 14px;
	color:#000;
	line-height: 28px;
}
.qn3 .part2 .part2-main .main-part .fl-lt{
	width: 48%;
}
.qn3 .part2 .part2-main .main-part .fl-rt{
	width: 52%;
}
.qn3 .part2 .part2-main .main-r{
	width: 45%;
}
.qn3 .part2 .part2-main .main-r .main-part{
	line-height: 32px;
}

/*.qn4品牌荣誉*/
.qn4 .title .title-l{
	vertical-align: middle;
	display: inline-block;
	margin-left: 5%;
}
.qn4 .title .p1{
	font-size: 0.5rem;
	color:#7d282d;
	display: inline-block;
	vertical-align: middle;
}
.qn4 .title .line{
	width:150px;
	height: 1px;
	background-color: #7d282d;
	display: inline-block;
	vertical-align: middle;
	position:relative;
}
.qn4 .title .line::after{
	content:"";
	width: 20px;
	height: 20px;
	display: inline-block;
	background-color: #7d282d;
	position:absolute;
	right: 0;
	top:-10px;
}
.qn4 .title .p2{
	font-size: 0.34rem;
	color:#7d282d;
}
.qn4 .title .title-r{
	display: inline-block;
	font-size: 0.5rem;
    color: rgba(0,0,0,0.2);
	text-transform: uppercase;
	margin-left: .5rem;
	vertical-align: middle;
}
.qn4 .picScroll-left{
	width: 13.48rem;
	margin: 0 auto;
	position: relative;
}
.qn4 .picScroll-left .bd{
	width:13.48rem;
  /*  overflow: hidden;*/
    margin: 0 auto;
   	height: 5.6rem;
}
.qn4 .picScroll-left .bd ul{
	position: relative;
	overflow: hidden;
	margin: 15px auto;
}
.qn4 .picScroll-left .bd ul li{
	width:3.1rem;
	float: left;
	position: relative;
	text-align: center;
	margin-right: 0.35rem;
	margin-top: 0.4rem;
}
.qn4 .picScroll-left .bd ul li:nth-child(4n){
	margin-right: 0;
}
.qn4 .picScroll-left .bd ul li img{
	width: 100%;
	display: block;
	height:160px;
}
.qn4 .picScroll-left .bd ul li .p1{
	width: 100%;
	font-size: 16px;
	border:1px solid #666;
	box-sizing: border-box;
	height: 0.4rem;
	line-height: 0.4rem;
}
.qn4 .picScroll-left .arrow{
	position: absolute;
	top: 50%;
	width: 34px;
	height: 160px;
	cursor: pointer;
	margin-top: -80px;
}
.qn4 .picScroll-left .arrow img{
	width: 100%;
	display: block;
}
.qn4 .picScroll-left .arrow-left{
	left: -60px;
}
.qn4 .picScroll-left .arrow-right{
	right: -60px;
}



/*qn5社会责任*/

.qn5 .part1{
	width: 50%;
    margin-top: 30px;
}
.qn5 .part1 .title .p1{
	width: 99%;
	text-align: center;
	font-size: 0.49rem;
	color:#7d282d;
	border:1px solid #7d282d;
	position:relative;
	padding-left:0.1rem;
	margin:0 auto;
	font-weight: lighter;
}
.qn5 .part1 .title .p1 span{
	background-color: #7d282d;
	color:#fff;
	padding:0 0.1rem;
	float:right;
}
.qn5 .part1 .title .p1 span::after{
	content:"RESPECTED ENTERPRISE";
	color:#c4b798;
	font-size: 0.18rem;
	position:absolute;
	top:-22px;
	right: 20px;
}
.qn5 .part1 .title .p2{
	font-size: 0.28rem;
	color:#000333;
	text-align: center;
	margin-top: 0.2rem;
	line-height: 0.4rem;
	font-weight: lighter;
}
.qn5 .part1 ul li{
	width: 48%;
	margin-right: 4%;
	border:1px solid #7d282d;
	box-sizing: border-box;
	margin-top: 20px;
	text-align: center;
	position:relative;
	float:left;
	margin-top: 50px;
	padding-bottom: 20px;
}
.qn5 .part1 ul li:nth-child(2n){
	margin-right: 0;
}
.qn5 .part1 ul li .p1{
	font-size: 0.24rem;
	background-color: #c4b798;
	color:#7d282d;
	text-align: center;
	width: 152px;
	margin:0 auto;
	margin-top: -13px;
}
.qn5 .part1 ul li .p2{
	font-size: 14px;
	line-height: 22px;
	margin-top: 10px;
}
.qn5 .part1 ul li .p3{
	width: 60px;
	height: 2px;
	background-color: #c4b798;
	position:absolute;
	bottom: 0;
	left: 50%;
	margin-left: -30px;
}
.qn5 .part1 ul li:last-child{
	height: 160px;
}
.footer{
	/*margin: 0 108px;*/
}








/*7.18*/
.qn5 .part2{
	width: 46%;
	height: 100%;
	margin-top: 0.3rem;
	position:relative;
	overflow: hidden;
}
.qn5 .part2 img{
	height: 100%;
	position:absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
}
.qn5{
	height: 76%;
}
.footer{
	   /* margin: 0 108px;*/
}

@media (max-width:1444px){
	.qn2 .part .p1,
	.qn2 .part .p2{
		left: -4%;
	}
	.qn2 .part .p3{
		left: -5%;
	}
	.qn2 .part .p4{
		right: -7%;
	}
	.qn2 .part .p5{
		right: -3%;
	}
	.qn2 .part .p6{
		right: -13%;
	}
	.qn2 .part .p7{
		right: -15%;
	}
	.qn3 .part2 .part2-main .main-part{
		font-size: 12px;
	}
	.qn3 .part2 .part2-main .main-part .fl-lt{
		width: 44%;
	}
	.qn3 .part2 .part2-main .main-part .fl-rt{
		width: 56%;
	}
	.qn5 .part1 .title .p1{
		font-size: 0.44rem;
	}
	.qn5 .part1 ul li .p2{
		font-size: 12px;
	}
	.qn5 .part1 ul li{
		width: 49%;
		margin-right: 2%;
	}

	.qn1 .part2 .p2{
	    font-size: 13px;
	    margin-bottom: 10px;
	    line-height: 22px;
	}
	.qn1 .part2{
		margin-top: 0;
		margin-bottom: 30px;
	}
	.qn2 .part-b {
	    width: 120%;
	    left: -10%;
	    margin-top: -15%;
	}
	.qn5 .part1{
		width: 52%;
		margin-bottom: 40px;
	}
	.qn5 .part1 ul li:last-child {
	    height: 153px;
	}
	.qn5{
		height: 84%;
	}

}
@media(max-width:1367px){
	.qn3 .part2{
		margin-bottom: 30px;
		width: 60%;
	}
	.qn5 .part1{
		width: 56%;
	}
	.qn4 .picScroll-left,
	.qn4 .picScroll-left .bd{
		width: 11rem;
	}
	.qn4 .picScroll-left .bd ul li{
		width: 2.48rem;
	}
	.qn5 .part2{
		width: 44%;
	}
	.qn5{
		height: 90%;
	}
}
@media (max-width:1280px){
	.qn4 .picScroll-left .arrow-left{
		left: -20px;
	}
	.qn4 .picScroll-left .arrow-right{
		right: -20px;
	}
	.qn5 .part1{
		width: 57%;
	}
	.qn5 .part2{
		width: 43%;
		margin-top: 25px;
	}

	.qn3{
		padding-left: 4%!important;
		padding-right: 4%!important;
	}
	.qn5{
		height: 97%;
	}
}
