@charset "utf-8";
/* CSS Document */


/*¹ØÓÚÎÒÃÇ*/
.about {
    width: 100%;
	background:#ffffff;

}

.about .left{width: 100%;height:auto;position: relative;padding: 3% 0;float:left;}

.more2 { font-size: 1.4rem; background: transparent; border: 1px solid #666; width: 18rem;    height: 4.5rem; color: #666;  -webkit-tap-highlight-color: transparent;  cursor: pointer;  transition: 400ms ease-in-out;  line-height:4.5rem;  text-align:center;  display:block;  margin:0 auto;  margin-top:5%;}
.more2 {  -webkit-touch-callout: none;    -webkit-user-select: none;     -khtml-user-select: none;       -moz-user-select: none;        -ms-user-select: none;            user-select: none;}
.more2:hover {  width:20rem;  background: #c00a0d;  border: 2px solid #c00a0d;color:#fff !important;}
.more2:focus {  border: none;}
.more2 span { color: transparent;  transition: 500ms;  margin-left: -20px;} 
.more2:hover span{ color: #eee;  margin-left: 0;}

.about .left h3 {font-size: 3.5rem; color: #333333;font-weight:bold;line-height:2;display:block;width:100%;text-align:center}
.about .left h3 a{ color: #333;font-weight:normal;text-align:center;transition: 400ms ease-in-out;}
.about .left p{font-size:1.6rem;color:#777777;}
.about .left:hover h3 a{color:#c00a0d;letter-spacing:6px;}
.about .left .atext{width:100%;clear:both;height:auto;margin-top:4rem;padding:0 10px;}
.about .left .atext p{height:auto;width:100%;line-height:2;color:#555555;font-size:1.5rem;}
.about .right{width: 100%;height:auto;position: relative;margin: 80px 0px 0px 0px;float:left;background:#f5f4f9;float:right;}
 .about .right ul{
            width: 100%;
     height: auto;
            margin: 0;
            padding: 0;
        }

 .about .right ul li {
            width: 33.3333%;
            height: auto;
            float: left;
            overflow: hidden;
			overflow:hidden;
			position: relative;
        }



 .about .right ul li .img,
 .about .right ul .img img {
            display: block;
            position: relative;
			    transition: all 3s;
    -ms-transition: all 3s;
	width:100%;
	height:auto;
        }

        .about .right ul li .img {
            overflow: hidden;
			
        }


    .about .right ul li .ctxt{width:100%;height:100%;position:absolute;left:0px;top:0px;}
	
.about .right ul li .ctxt h1{width:90%;margin:0 auto;line-height:3;color:#fff;font-size:2.4rem;text-align:center;margin-top:20%;font-weight:normal;}
.about .right ul li .ctxt h1 a{width:90%;margin:0 auto;line-height:3;color:#fff;font-size:2.4rem;text-align:center;font-weight:normal;transition: 400ms ease-in-out;}
.about .right ul li .ctxt ul{width:100%;text-align:center;}
.about .right ul li .ctxt ul li{display:inline-table;width:auto;height:auto;padding:0px 20px;float:none;border-right:solid #fff 1px;}
.about .right ul li .ctxt ul li:last-child{border:none;}
.about .right ul li .ctxt ul li a{color:#fff;font-size:1.4rem;}
.about .right ul li:hover .ctxt ul li a{text-shadow:1px 1px 1px #000;}
.about .right ul li:hover .img img{   transform: scale(1.2);  -ms-transform: scale(1.2);}
.about .right ul li:hover .ctxt h1 a {letter-spacing:5px; }
.about .right ul li .ctxt  .more { font-size: 1.4rem; background: transparent; border: 1px solid #fff; width: 18rem;    height: 4.5rem; color: #fff;  -webkit-tap-highlight-color: transparent;  cursor: pointer;  transition: 400ms ease-in-out;  line-height:4.5rem;  text-align:center;  display:block;  margin:0 auto;  margin-top:5%;}

.about .right ul li .ctxt .more {  -webkit-touch-callout: none;    -webkit-user-select: none;     -khtml-user-select: none;       -moz-user-select: none;        -ms-user-select: none;            user-select: none;}

.about .right ul li:hover .ctxt .more {  width:20rem;  background: #c00a0d;  border: 2px solid #c00a0d;  height:5rem;  line-height:5rem;}

.about .right ul li .ctxt .more:focus {  border: none;}

.about .right ul li .ctxt .more span { color: transparent;  transition: 500ms;  margin-left: -20px;}

.about .right ul li:hover .ctxt .more span{ color: #eee;  margin-left: 0;}








/* 公共属性 */
.best-con{padding:80px 0;}
.best-con .title{position:relative;font-weight:normal;text-align:center;font-size:3.5rem;height:52px;line-height:52px;color:#333;z-index:50;}
.best-con .layout-wrap{width:80%;position:relative;margin:0 auto;}
.layout-wrap .layout-3-1{float:left;vertical-align:top;width:33.3333%;}
.feature-list{margin-top:50px;}
.feature-list .item{position:relative;text-align:center;}
.feature-list .item img{max-width:90px;}
.feature-list .item:not(:last-child):after{content:"";position:absolute;right:0;top:10px;width:1px;height:100px;background: #bebdbd;}
.feature-list .item h3{margin-top:30px;font-size:2rem;font-weight:normal;color:#353535;height:32px;line-height:32px;}
.feature-list .item p{font-size:1.4rem;color:#888;width: 80%;margin: 0 auto; margin-top: 0px;margin-top: 2rem;line-height:2;}

















@media (max-width:768px) {
.about .right ul li {width: 100%;margin: 0 auto;float:none;	margin-top:1rem;}
.about .right ul li .ctxt h1{;margin-top:10%;}		
.about .left{padding: 20px 0px 0px 0px;}	
.layout-wrap .layout-3-1{width:90%;margin:0 auto;}	
.about .left h3 {font-size:2.5rem}
.about .right ul li .ctxt h1 a{    font-size: 2rem;}
}
@media  (min-width:769px) and (max-width:990px){

.about .right ul li { width: 50%;}
.about .right ul li:last-child {width: 100%;}
}
@media  (min-width:991px) and (max-width:1200px){

.about .right ul li .ctxt h1{margin-top:10% !important;}		
.best-con .layout-wrap{width:100%;}
}
@media  (min-width:1201px) and (max-width:1400px){

.about .right ul li .ctxt h1{margin-top:10% !important;}		
}

@media  (min-width:1401px) and (max-width:1600px){

.about .right ul li .ctxt h1{margin-top:10% !important;}		
}