@charset "utf-8"; 
@font-face{  
    font-family:'didot';  
    src:url('../fonts/DIDOT.TTF')  format('truetype');    
        font-weight:normal;  
        font-style:normal;  
}  
.main-con{
	position: relative;
}
.con1{
	padding-top:7%;
	padding-bottom: 6.77%;
}
.brand-story{
	width:73%;
	margin:0 auto;
}
.story-left{
	width:calc(100% - 6.5% - 350px);
	width:-webkit-calc(100% - 6.5% - 350px);
	width:-moz-calc(100% - 6.5% - 350px);
	margin-right:6.5%;
	float: left;
	position: relative;	
	box-sizing: border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing: border-box;
}
.story-left::after{
	content: "";
	display: block;
	position: absolute;
	width:100%;
	height:100%;
	border:1px solid #e9e9e9;
	right:15px;
	bottom: 15px; 
	z-index: -1;
	box-sizing: border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing: border-box;
}

.story-left>img{
	-webkit-transition: all 0.4s ease;
   -moz-transition: all 0.4s ease;
   transition: all 0.4s ease;
   cursor: pointer;
}

.story-right{
	width:350px;
	float: left;
}

.brand-tit-en{
	font-family: "didot";
	font-size: 26px;
	text-transform: uppercase;
	line-height: 1
}
.brand-tit-zh{
	font-size: 18px;
	color: #000000;
	line-height: 1;
	margin-top:3.33%;
	margin-bottom: 8.3%;
}
.tit-line1{
	width:50px;
	height: 1px;
	background: #939393;
	margin-bottom: 13.333%;
}
.brand-con{
	font-size: 14px;
	color: #646464;
	line-height: 24px;
}
.brand-con p{
	margin-top:8.3%;
}



/*con2*/
.con2{
	padding-top:7.1%;
	padding-bottom: 7.9%;
	background: #fafafa; 
}
.spirit-left{
	width:38%;
	padding-left:3.6%;
	float: left;
	margin-top: 7.6%;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}
.spirit-left .brand-tit-zh{
	margin-top: 2%;
	margin-bottom: 4%;
}
.spirit-left .tit-line1{
	margin-bottom: 5%;
}
.brand-spirit{
	margin-bottom: 10%;
	font-size: 0;
}
.brand-spirit span{
	display: inline-block;
	width:55px;
	height: 20px;
	border:1px solid #d0d0d0;
	color: #646464;
	font-size: 14px;
	text-align: center;
	line-height: 20px;
	margin-right: 6.288%
}
.spirit-right{
	float: right;
	width:62%;
	overflow: hidden;
	position: relative;
}
.spirit-right>div{
	display: inline-block;
	margin: 0 4px;
	overflow: hidden;
}
.spirit-right>div img,.flower-bottom>div img{
	-webkit-transition: all 0.4s ease;
   -moz-transition: all 0.4s ease;
   transition: all 0.4s ease;
}
.spirit-right>div:hover img,.flower-bottom>div:hover img{
	-webkit-transform: scale(1.1);
       -moz-transform: scale(1.1);
         -o-transform: scale(1.1);
            transform: scale(1.1);
}

.spirit-right>div:nth-child(1){
	width:calc(61.35% - 8px);
}
.spirit-right>div:nth-child(2){
	width:calc(38.6% - 8px);

	
}

/*con3*/
.con3{
	padding-top: 3.6%;
	padding-bottom: 7.3%;
}
.flower{
	width:60.7%;
	float: right;
	text-align: center;
}
.flower-img{
	width:34.6%;
	margin: 0 auto 25px;
	position: relative;
	overflow: hidden;
}

.flower .tit-line1{
	margin: 0 auto;
	margin-bottom: 6%;
}
.flower-bottom{
	overflow: hidden;
	width:72%;
	margin: 0 auto;
	margin-top: 19%;
	position: relative;
}
.flower-bottom >div:nth-child(1){
	width:41.6%;
	float: left;
	overflow: hidden;
}
.flower-bottom>div:nth-child(2){
	width:55.8%;
	float: right;
	overflow: hidden;
}
.con3 .brand-tit-zh{
	margin-top:1%;
	margin-bottom: 3%;
}
.wenzi{
	width:15.3%;
	margin:0 auto;
	margin-bottom: 6%;
}
.bck{
	position: absolute;
	width:40.5%;
	left:0;
	bottom: 7.3%;
}

/*con4*/
.con4{
	padding-top:4.75%;
	background: #fafafa;
	padding-bottom:9.1%; 
}
.positioning-con{
	max-width: 485px;
	margin: 0 auto;
	text-align: center;
}
.positioning-con .tit-line1{
	margin: 0 auto;
	margin-bottom: 7.6%
}
.con4 .brand-tit-zh{
	margin-top:2.1%;
	margin-bottom: 5.2%
}
.con4 .brand-con p {
    margin-top: 4.2%;
}
.con4-img{
	margin-top:6%;
	padding:15px;
	border:1px solid #e9e9e9;
	position: relative;
	overflow: hidden;
	box-sizing: border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
}
.con4-img >div{
	overflow: hidden;
}
.con4-img img{
	-webkit-transition: all 0.5s ease;
   -moz-transition: all 0.5s ease;
   transition: all 0.5s ease;
}
.con4-img:hover img{
	-webkit-transform: scale(1.1);
       -moz-transform: scale(1.1);
         -o-transform: scale(1.1);
            transform: scale(1.1);
}
.brand-con-en{
	text-align: center;
	width:470px;
	margin:0 auto;
	font-size: 11px;
	color: #707070;
	line-height: 20px;
	font-family: "didot";
	font-style: italic;
}
.brand-con-en{
	margin-top:3.6%;
}
.brand-con p:first-child{
	margin-top:0;
}

@media (max-width: 1200px) {
	.story-left{
		width: 100%;
		margin-right:0;
	}
	.story-right{
		margin-top:8%;
	}
	.spirit-right{
		width:100%;
		margin-top:8%;
	}
	.spirit-left{
		width:70%;
	}
}