*, :after, :before { -webkit-box-sizing: border-box; box-sizing: border-box }

/*IEtips ie*/
.IEtips{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000000; background: rgba(0,0,0,1); display: none;}
.IEtips_Box{ width: 1000px; background: #FAFAFA; height: 500px; position: absolute; left: 50%; top: 50%; margin: -250px 0 0 -500px;}
.IEtips .Browser{ margin-top: 35px;}
.IEtips .IEtips_title{ font-size: 36px; width: 80%; margin: 0 auto; padding-top: 35px;}
.IEtips .Browser ul{ overflow: hidden; text-align: center; width: 80%; margin: 0 auto;font-size: 0;}
.IEtips .Browser ul li{ margin: 0 40px; text-align: center; width: 120px;display: inline-block;vertical-align: top;}
.IEtips .Browser ul li img{ width: 100px; margin: 0 auto;}
.IEtips .Browser ul li a, .IEtips .Browser ul li span{ display: block; margin-top: 25px; color: #2570e1; font-size: 16px; transition: all .5s; -webkit-transition: all .5s;}
.IEtips .Browser ul li a:hover{ color: #800886;}
.IEtips .brn_off{ background: url(../images/brn_off.png); height: 32px; width: 32px; position: absolute; top: 5px; right: 5px; cursor: pointer;}


/*------------第二屏-----------------*/
.sec1_left{
	background: url(../images/sec1_left.jpg);
	background-size:cover ;
	background-repeat:no-repeat ;
	background-position:center  center;
}
.sec1_l_bd{
	position: absolute;
	left:15%;
	top:35%;
	
}
.sec1_l_bd h2{
	color:#fff;
	font-size: 30px;
	font-weight: normal;
	letter-spacing: 1px;
}
.more_1{
	display: block;
	width:180px;
	height:45px;
	margin-top: 20px;
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
	position: relative;
	overflow: hidden;
	color:#fff;
	line-height: 45px;
	cursor: pointer;
}
.more_1 .block{
	width:100%;
	height:100%;
	position: absolute;
	left:-100%;
	top:0;
	background: #f5bc00;
	transition: .3s ease;
	z-index: 1;
}
.more_1:hover .block{
	left:0;
	
}
.more_1 .block1{
	width:100%;
	height:100%;
	position: relative;
	z-index: 2;
	padding-left: 10px;
}
.more_1 .block1 span{
	display: block;
	position: absolute;
	right:10px;
	top:50%;
	transform: translateY(-50%);
	z-index: 2;
	font-size: 23px;
	transition: .3s ease;
}
.more_1:hover .block1 span{
	right:7px;
}
.sec1_mid{
	margin-left: 4%;
	height:100%;
	width:30%;
	position: relative;
	float:left;
}
.sec1_mid h2{
	font-size: 22px;
	letter-spacing: 1px;
	margin-bottom: 10px;
}
.sec1_mid .profile{
	font-size: 14px;
	line-height: 28px;
	margin-top: 30px;
}

.sec1_mid > div{
	height:100%;
	padding-top:24% ;
	position: relative;
}

.yearcon li{
	float:left;
	width:33.3%;
}
.yearcon li h3{
	font-size: 38px;
	margin-bottom: 5px;
}
.yearcon li h3 em{
	font-style: normal;
	font-size: 14px;
}
.yearcon li p{
	font-size: 14px;
}
.sec1_r {
	float:left;
	margin-left: 4%;
	height:100%;
	position: relative;
	width:30%;
}

.sec1_r_bd:hover img{
	transform: scale(1.1,1.1);
	-webkit-transform: scale(1.1,1.1);
	-moz-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
}
.sec1_r_bd img{
	transition: all .8s ease 0s;
	-webkit-transition: all .8s ease 0s;
	-moz-transition: all .8s ease 0s;
	-ms-transition: all .8s ease 0s;
}
.cul_txt{
	position: absolute;
	bottom:40px;
	left:40px;
	z-index: 2;
}
.cul_txt h4 {
	color:#fff;
	font-size: 22px;
}
.cul_txt p {
	color:#fff;
}
/*------------第三屏-----------------*/
.section3{
	background: url(../images/section3bg.jpg);
	background-size:cover ;
	background-repeat:no-repeat ;
	background-position:center center;
}
.section3_left{
	padding-top: 6%;
	float:left;
	width:24%;
}
.line1{
	width:60px;
	height:2px;
	background: #fff;
	margin: 30px 0;
}
.section3_left h2{
	color: #fff;
    font-size: 30px;
    font-weight: normal;
    letter-spacing: 1px;
}
.section3_left p{
	font-size: 14px;
	color:#fff;
	line-height: 25px;
}
.section3_right{
	float:right;
	width:70%;
	padding-top: 5%;
}


.productIbox-list{ margin: 0px auto; width: 100%;   }
.productIbox-list dd{
	background: rgba(0,0,0,0.3);
	cursor: pointer; 
	padding: 30px 0px 30px 150px;
	position: relative; 
	z-index: 1;
    float:left;
    width:340px;
    margin-right:3% ;
    margin-bottom: 30px;
	   }
	.productIbox-list dd:nth-child(2n+2){margin-right: 0;}
.productIbox-list .ico{ width: 90px; height: 100px; display: block; position: absolute; left: 8%; top: 50%; margin-top: -50px; background-position: center center; background-repeat: no-repeat;}
.productIbox-list .line{ width: 10px; height: 1px; background-color: #fff; position: absolute; left: 46%; margin-left: -25px; top: 50%; display: block;}
.productIbox-list p{ padding-left: 24px;}
.productIbox-list .t{ font-size: 16px; line-height: 1.5;color:#fff;}
.productIbox-list .c{ font-size: 12px; font-family: arial, helvetica, sans-serif;color:#fff;}
.productIbox-list .addMore{ position: absolute; background-color: #f5bc00; top: 0; left: 100%; width: 60px; height: 100%; -webkit-transform: perspective(1200px) rotateY(-90deg);  transform: perspective(1200px) rotateY(-90deg); -webkit-transform-origin: left top 0; transform-origin: left top 0; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transition: all .48s ease .38s;  transition: all .48s ease .38s; visibility: hidden; }
.productIbox-list dd:after{ content: ""; background: url(../images/orange_68.png) repeat; background: none rgba(245,188,0,0.68); position: absolute; left: 0; top: 0; z-index: -1; width: 100%; height: 100%; display: block; transform-origin: 100%; -webkit-transform-origin: 100%; -webkit-transition: -webkit-transform .38s cubic-bezier(.4,0,.2,1);  transition: transform .38s cubic-bezier(.4,0,.2,1); transform: scaleX(0); -webkit-transform: scaleX(0); visibility:hidden\9;}
.productIbox-list dd:hover:after{ transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); transform-origin: 0; -webkit-transform-origin: 0; visibility: visible\9;}
.productIbox-list dd:hover .addMore { visibility: visible; -webkit-transform: perspective(600px) rotateY(0deg); -moz-transform: perspective(600px) rotateY(0deg); -ms-transform: perspective(600px) rotateY(0deg); transform: perspective(600px) rotateY(0deg); }
.addMore i{ position: absolute; left: 50%; top:50%; background-color: #fff;}
.addMore i.i1{ margin:-1px 0px 0px -8px; width: 17px; height: 2px; }
.addMore i.i2{ margin:-8px 0px 0px -1px; height: 17px; width: 2px; }

/*------------第四屏-----------------*/
.section4{
	padding-top: 30px;
}
.section4_t{
	position: relative;
}
.leftline{
	position: absolute;
	left:-53px;
	width:48px;
	top:15px;
	height: 2px;
	background: #f5bc00;
}
.section4_t h2{
    font-size: 30px;
    font-weight: normal;
    
}
.section4_t span{
	font-size: 22px;
}
.sect_l{
	float:left;
	width:50%;
	font-size: 14px;
	line-height: 25px;
}
.sect_r{
	float:right;
}
.st{margin: 20px 0;height: auto;overflow: hidden;}
.newmore{
	cursor: pointer;
	display: block;
	position: relative;
	width:100px;
	height:30px;
	line-height: 30px;
	transition: .3s ease;
}
.newmore span{
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	right:5px;
	transition: .3s ease;
	}
	
.newmore:hover span{
	right:0;
}
.newmore:hover span{
	color:#f5bc00;
}
.newmore:hover {
	color:#f5bc00;
}
/*----------------------*/

.hm-brand .brand-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin: 0 0 0 }

@media (max-width:1240px) {
    .hm-brand .brand-info { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column }
}

.hm-brand .brand-info > div a:hover .b-i_desc { top: 0; -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s }
.hm-brand .brand-info > div a:hover .b-i_pic img { top: -110px }

@media (max-width:1240px) {
    .hm-brand .brand-info > div a:hover .b-i_pic img { top: 0 }
}

.hm-brand .brand-info > div .b-i_desc { top: 330px; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s }

@media (max-width:1920px) {
    .hm-brand .brand-info > div .b-i_desc { top: 247px }
}

@media (max-width:1240px) {
    .hm-brand .brand-info > div .b-i_desc { margin-left: 380px; margin-right: 0; top: 0 }
}

@media (max-width:768px) {
    .hm-brand .brand-info > div .b-i_desc { margin-left: 304px }
}

@media (max-width:576px) {
    .hm-brand .brand-info > div .b-i_desc { margin-left: 0 }
}

.hm-brand .brand-info > div .b-i_pic { top: 0; bottom: auto }

@media (max-width:1240px) {
    .hm-brand .brand-info > div .b-i_pic { left: 0; right: auto }
}

.hm-brand .brand-info a { display: block; overflow: hidden; position: relative; z-index: 1; background: #f2f2f2 }
.hm-brand .brand-info a:hover { z-index: 3 }
.hm-brand .brand-info a:hover .b-i_pic { height: 0; -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s }
.hm-brand .brand-info a:hover .b-i_pic img { opacity: .3; -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s }

@media (max-width:1240px) {
    .hm-brand .brand-info a { margin: 10px 0; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s }
    .hm-brand .brand-info a:hover { background: #e9e9e9; -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s }
    .hm-brand .brand-info a:hover .b-i_pic { height: auto }
    .hm-brand .brand-info a:hover .b-i_pic img { opacity: 1; -webkit-transform: scale(1.03); -ms-transform: scale(1.03); transform: scale(1.03) }
}

@media (max-width:576px) {
    .hm-brand .brand-info a { margin: 10px auto; max-width: 480px }
}

.hm-brand .brand-info .b-i_desc { position: relative; z-index: 1; padding: 30px; width: 380px; height: 490px }

@media (max-width:1440px) {
    .hm-brand .brand-info .b-i_desc { width: 342px; height: 360px ;top:207px;}
}

@media (max-width:1240px) {
    .hm-brand .brand-info .b-i_desc { margin-right: 380px; width: auto; height: 330px }
}

@media (max-width:768px) {
    .hm-brand .brand-info .b-i_desc { margin-right: 304px; padding: 25px; height: 264px }
}

@media (max-width:576px) {
    .hm-brand .brand-info .b-i_desc { margin-top: 71%; margin-right: 0; padding: 7.5%; height: auto }
}

.hm-brand .brand-info .date { font-size: 15px; line-height: 15px; color: #ababab }
.hm-brand .brand-info .name { height: 50px; margin: 35px 0 0; font-size: 16px; font-weight: 700; line-height: 25px; color: #111; display: -webkit-box; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical }

@media (max-width:768px) {
    .hm-brand .brand-info .name { margin-top: 15px }
}

@media (max-width:576px) {
    .hm-brand .brand-info .name { font-size: 15px }
}

.hm-brand .brand-info .desc { height: 50px; margin: 10px 0 0; font-size: 12px; line-height: 25px; color: #858585; display: -webkit-box; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical }

@media (max-width:1240px) {
    .hm-brand .brand-info .desc { margin: 35px 0 0 }
}

@media (max-width:768px) {
    .hm-brand .brand-info .desc { margin-top: 0; }
}

.hm-brand .brand-info .more { margin: 70px 0 0; padding: 10px 0; width: 110px; font-size: 12px; line-height: 15px; text-align: center; background: #f5bc00; color: #fff; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s }
.hm-brand .brand-info .more:hover { background: #f5bc00 }

@media (max-width:1240px) {
    .hm-brand .brand-info .more { margin: 60px 0 0 }
}
@media (max-width:1440px) {
	.hm-brand .brand-info .name{margin: 25px 0 0;}
}

@media (max-width:768px) {
    .hm-brand .brand-info .more { margin-top: 29px }
}

.hm-brand .brand-info .b-i_pic { overflow: hidden; position: absolute; right: 0; bottom: 0; z-index: 3; height: 330px; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s ;top: 0; bottom: auto}
.hm-brand .brand-info .b-i_pic img { position: relative; top: 0; width: 100%; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s }

@media (max-width:1440px) {
    .hm-brand .brand-info .b-i_pic { height: 207px }
}

@media (max-width:1240px) {
    .hm-brand .brand-info .b-i_pic { width: 380px; height: 330px }
}

@media (max-width:768px) {
    .hm-brand .brand-info .b-i_pic { width: 304px; height: 264px }
}

@media (max-width:576px) {
    .hm-brand .brand-info .b-i_pic { top: 0; bottom: auto; padding: 0 100% 86.8421% 0; width: auto; height: auto }
    .hm-brand .brand-info .b-i_pic img { position: absolute; left: 0; }
}







/*------------第五屏-----------------*/
.section5{
	background: url(../images/joinbg.jpg);
	background-size:cover ;
	background-repeat:no-repeat ;
	background-position:center center;
}
.joint h2{
	text-align: center;
	font-size: 30px;
    font-weight: normal;
    color:#fff;
}
.joint h3{
	text-align: center;
	font-size: 22px;
    color:#fff;
    margin: 20px 0;
}
.joint p{
	text-align: center;
	color:#fff;
	font-size: 14px;
	line-height: 22px;
}
.joint{
	margin-bottom: 80px;
}
.joinlist {
	text-align: center;
	height:auto;

}

.joinlist  a{
	margin: 0 20px;
	display: inline-block;
	cursor: pointer;
	width:100%;
	height:100%;
	position: relative;
	width:168px;
	height:169px;
}
.joinlist a .jn{
	z-index: 1;
	width: 100%;
	text-align: center;
	position: absolute;
	top:55%;
	transform: translateY(-50%);
}
.joinlist a .jn h3{
	font-weight: normal;
	margin-bottom: 8px;
	color:#fff;
	font-size: 18px;
}
.joinlist a .jn p{
	color:#fff;
	font-size: 14px;
	line-height: 20px;
}

.joinlist a .js{
   width: 110%;
    height: 110%;
    position: absolute;
    left: -5%;
    top: -5%;
   transform: scale(0);
   z-index: 2;
   background: #f5bc00;
   transition: .3s ease-in-out;
}
.joinlist a:hover .js{
	transform: scale(1);
}
.jsborder{
	text-align: center;
    top:10px;
    left:10px;
    bottom:10px;
    right:10px;
    border: 1px solid #fff;
	position: absolute;
	z-index: 3;
    
}
.jsborder h4{
	font-weight: normal;
	color:#fff;
	font-size: 38px;
	line-height: 1;
	margin-bottom: 4px;
}
.jsborder p{
	color:#fff;
	font-size: 14px;
	line-height: 20px;
}
.jsborder span{
	display: inline-block;
	width:50px;
	height:3px;
	background: #fff;
	margin-bottom: 12px;
}
.jtxt{
	width:100%;
	left:0;
	text-align: center;
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	z-index: 5;
}
 .ye{
	width:calc(100% + 20px);
	height:30px;
	position: absolute;
	top:50%;
	left:-10px;
	transform: translateY(-50%);
	z-index: 4;
	background: #f5bc00;
}
.joinlist .jl1{
	background: url(../images/jbg1.png);
}
.joinlist .jl2{
	background: url(../images/jbg2.png);
}
.joinlist .jl3{
	background: url(../images/jbg3.png);
}
.joinlist .jl4{
	background: url(../images/jbg4.png);
}
.joinlist .jl5{
	background: url(../images/jbg5.png);
}






/*------------响应式-----------------*/

@media  (min-width: 641px) {
	.sec1_left{height:100%;width:28%;position: relative;float:left;}
	.sec1_r_bd{cursor: pointer;height:auto;overflow: hidden;position: absolute;left:0;top:60%;transform: translateY(-50%);z-index: 2;}
    .yearcon{width:100%;position: absolute;left:0;bottom:25%;}
    .phdiv{display: none;}
    
}
@media  (max-width: 640px) {
	.sec1_left{width:100%;height:200px;margin-top: 30px;}
	.sec1_l_bd{top:25px;left:15px;}
	.sec1_l_bd h2{font-size: 20px;}
	.more_1{width:110px;}
	.sec1_mid{float:none;width:calc(100% - 20px);margin-left: 10px;margin-right: 10px;}
	.sec1_mid h2{font-size: 18px;}
	.sec1_mid > div{padding-top: 30px;}
	.sec1_r{float:none;width:calc(100% - 20px);margin-left: 10px;margin-right: 10px;}
	.sec1_r_bd{width:100%;height:auto;}
	.sec1_r_bd img{width:100%;}
	.yearcon{margin: 25px 0;height:auto;overflow: hidden;}
	.yearcon li h3{font-size: 30px;}
	.sec1_mid .profile{margin-top: 25px;}
	.cul_txt h4{font-size: 18px;}
	.cul_txt{left:15px;bottom:15px;}
	.section3{height:auto;overflow: hidden;margin: 30px 0;padding: 0 0 30px 0;}
	.section3_left h2{font-size: 20px;}
	.line1{margin: 10px 0 25px 0;}
	.section3_left{float:none;width:100%;padding-top: 25px;}
	.section3_right{float:none;width:100%;height:auto;overflow: hidden;margin-top: 20px;}
	.productIbox-list dd{width:100%;float:none;margin-bottom: 0;margin-right: 0;border-bottom:1px solid #999 ;padding: 15px 15px 15px 200px;margin-left: 0;background: rgba(0,0,0,.7);}
	.productIbox-list .ico{left:10px;height:80px;margin-top: -40px;}
	.section4 .leftline{display: none;}
	.section4_t h2{font-size: 20px;}
	.section4_t span{font-size: 18px;}
	.st{margin: 25px 0;}
	.sect_l{width:calc(100% - 120px);line-height: 20px;}
	.newlist li{width:100%;margin-left: 0;margin-bottom: 20px;}
	.section4{padding-top: 0;}
	.newmore{width:80px;}
	.hm-brand .container{margin-left: 0 !important;margin-right: 0 !important;}
	.section5{padding: 30px 0;}
	.joint h2{font-size: 20px;}
	.joint h3{margin: 10px 0;font-size: 18px;}
	.joint{margin-bottom: 35px;}
	.joinlist a{width:135px;height:136px;margin: 0 10px;margin-bottom: 15px}
	.joinlist a .jn h3{font-size: 17px;}
	.joinlist a .jn p{font-size: 13px;}
	.joinlist .jl1{background: url(../images/jbg1_p.png);}
	.joinlist .jl2{background: url(../images/jbg2_p.png);}
	.joinlist .jl3{background: url(../images/jbg3_p.png);}
	.joinlist .jl4{background: url(../images/jbg4_p.png);}
	.joinlist .jl5{background: url(../images/jbg5_p.png);}
}
@media  (max-width: 380px){
	.productIbox-list dd{padding: 15px 15px 15px 180px;}

}
@media  (min-width: 1550px){
	.sec1_mid > div{padding-top: 40%;}
}