/******about home******/
.about .description{ padding: 0px 15px; max-width: 600px; width: 100%; margin: 0 auto; text-align: center;}
.about .description p{ margin-top: 15px; font-size: 18px; line-height: 24px;}
.about .video{ margin: 50px auto 0px; max-width: 580px; width: 80%;}
@media screen and (max-width:1000px) {
	.about .description p{font-size: 16px;}
	.about .video{  margin-top: 20px; }
}
@media screen and (max-width:640px) {
	.about .description p{font-size: 13px; line-height: 22px;}
}

.w1022{ max-width: 1022px; width: 100%; margin: 0 auto; padding: 50px 12px 82px; }
.about .box{ float: left; padding: 0px 3px 6px;}
.about .box a{ display: block; cursor: pointer; border: 1px solid #19a2d2;  background:rgba(0,0,0,.6); position: relative; overflow: hidden; }
.about .box .tit{ display: block; padding: 15px 0px; font-size: 20px; font-weight: bold;}
.about .box  p{ font-size: 13px; line-height: 24px; color: #e0e0e0;}
.about .box  .more{ position: absolute; bottom:0px; right:-10px; background: #19a2d2; display: inline-block; height: 36px; line-height: 36px; padding:0px 30px; transform:skew(-20deg);-ms-transform:skew(-20deg);-moz-transform:skew(-20deg); -webkit-transform:skew(-20deg); -o-transform:skew(-20deg);}
.about .box .more i{display: inline-block;transform:skew(20deg);-ms-transform:skew(20deg);-moz-transform:skew(20deg); -webkit-transform:skew(20deg); -o-transform:skew(20deg); font-style: normal;}
.about .box .more:hover{ box-shadow:0px 0px 40px #29bbf0; }
.about .leftbox{ width: 286px;}
.about .leftbox a{ border: 1px solid #19a2d2;  background:rgba(0,0,0,.6); position: relative; overflow: hidden; }
.about .leftbox img{ width: 100%;}
.about .leftbox .con{ padding:0px 15px 68px;}
.about .right{ float: left; width: 710px;}
.about .box1 a{ width: 465px; padding: 0px 18px 35px; }
.about .box1 div{ float: left; width: 265px;}
.about .box1 img{ float: right; margin-top: 48px;}
.about .box2 a{ width: 230px; padding: 0px 18px 60px;}
.about .box2 img{ display: block; margin: 0 auto;}
@media screen and (max-width:1050px) {
	.about .leftbox{ float: none; width: 706px; margin: 0 auto;}
	.about .leftbox img{  float:left; width:30%;}
	.about .leftbox .con{ float:right; width:70%; padding-bottom: 0px;}
	.about .right{ float: none; margin: 0 auto; width: 710px;}
}
@media screen and (max-width:780px) {
	.w1022{ padding: 50px 12px;}
	.about .box .tit{ font-size: 18px;}
	.about .leftbox{ float: none; width:auto;}
	.about .right{ float: none; width: 100%;}
	.about .box1{float: none;}
	.about .box1 a{  width: 100%;}
	.about .box1 div{ width: 70%; }
	.about .box1 img{ width: 28%; max-width: 120px; margin-top: 25px;}
	.about .box2{ width: 50%;}
	.about .box2 a{ width: 100%; padding: 0px 18px 40px;}
	.about .box2 img{ width: 60%; max-width: 120px;}
}
@media screen and (max-width:480px) {
	.w1022{ padding: 30px 12px 30px;}
	.about .box .tit{padding: 8px 0px; font-size: 14px;}
	.about .box  p{ line-height: 20px;}
	.about .box .more{ line-height: 28px; height: 28px; padding: 0px 15px;}
	.about .leftbox img{ width:40%;}
	.about .leftbox .con{ width:60%;}
	.about .box1 img{ margin-top: 40px;}
}




/******chairman******/
.chairman{ padding-bottom: 136px;}
.chairman .w805{ max-width: 805px; width: 100%; margin: 0 auto; padding: 0px 15px;}
.chairman .dimg{ float: left; width: 28%;}
.chairman .dimg img{ width: 100%;}
.chairman .con{ float: right; width:70%; background:rgba(0,0,0,.8); padding:8px 25px; }
.chairman .con span{ display: block; text-align: center; font-size: 23px; background:url(../images/about/chairman-span.png) no-repeat center;}
.chairman .con .tit{ margin-bottom:10px; font-size: 44px; text-align: center; padding-bottom: 10px; border-bottom:3px solid #FFFFFF;}
.chairman .con p{ font-size: 15px; line-height: 24px;}
@media screen and (max-width:1000px) {
	.chairman{ padding-bottom: 70px;}
	.chairman .con span{ font-size: 18px;}
	.chairman .con .tit{ font-size: 26px;}
	.chairman .con p{ font-size: 14px;}
}
@media screen and (max-width:640px) {
	.chairman{ padding-bottom:30px;}
	.chairman .con{ padding: 10px;}
	.chairman .con span{ font-size: 14px;}
	.chairman .con .tit{ font-size: 18px;}
	.chairman .con p{ font-size: 12px;}
}



/******profile******/
.profile .bg-div{ padding-bottom: 110px;}
.profile .bg-div .con{ max-width: 580px; width: 100%; margin: 0 auto; padding: 30px 15px 0px; text-align: center;}
.profile .bg-div .con p{ line-height: 24px;}
.profile .container{ padding: 90px 15px 100px; color: #6f6f6f; font-size: 13px; line-height: 22px;}
.profile .container a{ color: #2e2e2e;}
.profile .container a:hover{ color: #df3343;}
.profile .container .p1{ color: #161616; font-size: 18px; line-height: 28px;}
.profile .container .dimg{ float: left; width: 47%;}
.profile .container .dimg img{ width: 100%;}
.profile .container .right{ float: right; width: 49%;}

@media screen and (max-width:640px) {
	.profile .bg-div { padding-bottom: 30px;}
	.profile .bg-div .con{ padding-top: 20px;}
	.profile .bg-div .con p{ line-height: 20px;}
	.profile .container{  padding: 30px 15px; line-height: 20px; font-size: 12px;}
	.profile .container .p1{ font-size: 14px; line-height: 22px;}
	.profile .container .dimg{ float: none; width: 100%;}
	.profile .container .right{  float: none; width: 100%; padding-top: 20px;}
}




/******culture******/
.culture .bg-div{ padding-bottom: 65px;}
.culture .box{ max-width: 886px; width: 100%; margin: 50px auto 0;}
.culture .box li{ float: left; width: 33.3%; text-align: center; padding: 0px 5px; font-size: 22px;}
.culture .w1006{ color: #2e2e2e;}
.culture .w1006 a{ color: #2e2e2e;}
.culture .w1006 a:hover{ color: #df3343;}
.culture .container{ text-align: center;}
.culture .container .tit{  padding-top: 55px; font-size: 35px;}
.culture .container .text{ padding: 25px 0px; font-size: 13px; line-height: 24px;}
.culture .container .dimg{ margin-top: 30px; }
.culture .container .dimg li{ float: left; padding:3px; width: 33.3%;}
.culture .container .dimg .li-big{ width: 66.6%;}
.culture .video{ color: #2c2c2c;}
.culture .video .tit{ margin: 40px 0px; text-align: center; font-size: 18px; text-align: center; position: relative;} 
.culture .video .tit i{ position: absolute; left:0px; top:45px; width: 100%; border-bottom: 1px solid #cecece; z-index: 0;}
.culture .video .tit span{ position: relative; z-index:1; display:inline-block; width: 90px; height: 90px; line-height: 90px;  background: #FFFFFF; border: 1px solid #cecece;transform:rotate(-45deg);-ms-transform:skew(-45deg);-moz-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -o-transform:rotate(-45deg); }
.culture .video .tit em{ display: inline-block; font-style: normal; transform:rotate(45deg);-ms-transform:rotate(45deg);-moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg);}
.culture .video .con{ background: #f6f6f6; padding: 45px 0px;}
.culture .video li{ float: left; width: 33.3%; padding: 0px 3px; cursor: pointer; }
.culture .video li .dimg{ width: 100%; position: relative; overflow: hidden;}
.culture .video li .dimg img{ position: absolute; top:0px; left:0px; width: 100%; height: 100%; z-index: 1;}
.culture .video li .dimg i{ display: inline-block; padding-bottom: 67.69%;}
.culture .video li p{ font-size: 13px; margin-top: 10px;}
@media screen and (max-width:1000px){
	.culture .box li{ font-size: 18px;}
	.culture .container .tit{ font-size:28px;}
	.culture .video .tit{ margin: 30px 0px; font-size: 16px; } 
	.culture .video .tit i{ top:35px;}
	.culture .video .tit span{width: 70px; height: 70px; line-height: 70px;}
}
@media screen and (max-width:640px) {
	.culture .bg-div{ padding-bottom:30px;}
	.culture .box{ margin: 20px auto 0;}
	.culture .box li{ font-size: 13px;}
	.culture .container .tit{ padding-top: 20px; font-size:20px;}
	.culture .container .text{ padding: 15px 0px; font-size: 12px; line-height: 22px;}	
	.culture .container .dimg li{ width: 50%;}
	.culture .container .dimg .li-big{ width: 100%;}
	.culture .video .tit{ margin: 15px 0px; font-size: 12px;} 
	.culture .video .tit i{ top:25px;}
	.culture .video .tit span{width: 50px; height: 50px; line-height: 50px;}
	.culture .video li p{ font-size: 12px;}
}





/******milestone******/
.milestone { padding-bottom: 80px;}
.milestone .dimg{ padding: 70px 15px; text-align: center;}
.milestone .list{ width: 74px; position: relative; margin: 0 auto; background: url(../images/about/item.png) center repeat-y;}
.milestone .year{ font-size: 20px; text-align: center;  padding-bottom: 70px;} 
.milestone .year span{ display: inline-block; width: 74px; height: 74px; line-height: 74px; text-align: center; border-radius: 50%; background:rgba(85,213,248,.95); }
.milestone .item{ min-height: 100px; margin-top:-40px; display: inline-block; text-align: left; border: 1px solid #19a2d2; width:250px; padding: 20px; font-size: 18px; line-height: 28px; position: relative;background:rgba(0,0,0,.6);}
.milestone .item span{ position: absolute; top:-15px; display:inline-block; height: 30px; width: 72px; background: url(../images/about/item-span.png) no-repeat;}
.milestone .left{  margin-left: -270px;}
.milestone .left span{ right:-72px; background: url(../images/about/item-span2.png) no-repeat;}
.milestone .right{ margin-left: 93px; }
.milestone .right span{ left:-72px;}

@media screen and (max-width:720px) {
	.milestone{ padding-bottom: 30px;}
	.milestone .dimg{ padding:20px 15px;}
	.milestone .list{ width: 100%; padding:0px 15px; background: none;}
	.milestone .year{ text-align:left; padding-bottom:10px; }
	.milestone .year span{ width: 50px; height: 50px; line-height: 50px; font-size: 15px;}
	.milestone .item{ min-height: 0px; width:100%; margin-bottom: 10px; margin-top: 0px; padding: 10px; line-height: 22px; font-size: 13px;}
	.milestone .left{  margin-left: 0px;}
	.milestone .right{  margin-left: 0px;}
	.milestone .item span{ display: none;}
}




/******honor******/
.honor{ padding-bottom: 100px;}
.honor .srcoll{ width: 100%; max-width: 500px; margin:50px auto 0; position: relative; padding: 0px 15px;}
.honor .con{ position: absolute; top:50%; margin-top: -50px; width: 100%; left:0px; }
.honor .slick{ max-width: 450px; width: 80%; padding:0px 120px; margin: 0 auto; text-align: center; color:#141414; }
.honor .slick .text{ display: inline-block; vertical-align: middle; height: 100px; font-size: 18px; margin:0 auto; width: 100%; padding-top: 10px;}
.honor .slick .text i{ display: inline-block; vertical-align: middle; height: 100%;}
.honor .slick span{ font-size: 16px;}
.honor .slick .slick-next,.honor .slick .slick-prev{ position: absolute; top:50%; margin-top: -15px; width: 28px; height: 31px;  background-position: center center;  background-repeat: no-repeat; background-size: cover;  -ms-behavior: url(/plugin/backgroundsize.min.htc);  behavior: url(backgroundsize.min.htc);}
.honor .slick .slick-next{ right:0px; background-image: url(../images/about/honor-next.png);}
.honor .slick .slick-prev{ left:0px; background-image: url(../images/about/honor-prev.png);}
@media screen and (max-width:640px) {
	.honor{ padding-bottom: 20px;}
	.honor .srcoll{ margin-top: 20px;}
	.honor .con{ margin-top:-22px}
	.honor .slick{ padding: 0px 45px;}
	.honor .slick .text{ height: 44px; font-size: 18px;}
	.honor .slick span{ font-size: 14px;}
	.honor .slick .slick-next,.honor .slick .slick-prev{ width: 20px; height: 22px; margin-top: -11px;}
}
