.about-xcelion-sec1{ width:100%; height: auto; display: block; position:relative; padding: 50px 0;}
.about-xcelion-sec1:after{content:''; display:block; clear:both;}
.about-xcelion-sec1-box1{width:100%; height: auto; display: block; position:relative;  padding-bottom: 0px; margin-bottom: 0px;}
.about-xcelion-sec1-box1:after{content:''; display:block; clear:both;}
.about-xcelion-sec1-box1 aside{width:45%; max-width: 475px; height: auto; float: left; display: block; position:relative;}
.about-xcelion-sec1-box1 aside h2{width:100%; height: auto; float: left; display: block; font-size: 40px; font-weight: 700; color: #000; line-height: 50px;}
.about-xcelion-sec1-box1 article{width:55%; height: auto; float: left; padding-left: 0%; display: block; position:relative; box-sizing: border-box; padding-top: 10px;}
.about-xcelion-sec1-box1 article h3{width:100%; height: auto; float: left; display: block; font-size: 22px; font-weight: 400; color: #000; line-height: 30px; padding-bottom: 20px; }
.about-xcelion-sec1-box1 article p{width:100%; height: auto; float: left; display: block; font-size: 16px; font-weight: 400; color: #000; line-height: 20px; padding-bottom: 0px;}

.about-xcelion-sec2{ width:100%; height: auto; display: block; position:relative; padding: 0px 0;}
.about-xcelion-sec2:after{content:''; display:block; clear:both;}
.about-xcelion-sec2-box1{width:100%; height: auto; display: block; position:relative;  padding-bottom: 0px; margin-bottom: 0px;}
.about-xcelion-sec1-box1:after{content:''; display:block; clear:both;}

.about-xcelion-sec2-box1-vision{ width: 50%; height: auto; float: left; display: block; padding-right: 15px; position: relative;}
.about-xcelion-sec2-box1-vision figure{width: 100%; height: auto; float: left; display: block; padding-right: 160px; }
.about-xcelion-sec2-box1-vision figure i{width: 100%; display: block; }
.about-xcelion-sec2-box1-vision figure i img{width: 100%; display: block; }
.about-xcelion-sec2-box1-vision aside{ position: absolute; right: 0px; top: -1px; background: #fff; width:285px; padding: 25px 25px; border-radius: 10px; border-bottom-left-radius: 10px; border-top-left-radius: 0px; border-top-right-radius: 0px; }

.about-xcelion-sec2-box1-vision aside h2{width: 100%; height: auto;  display: block; padding-bottom: 15px; font-size: 28px; font-weight: 400; color: #000; line-height: 36px; } 
.about-xcelion-sec2-box1-vision aside p{width: 100%; height: auto;  display: block; font-size: 18px; font-weight: 400; color: #000; line-height: 24px;}

.about-xcelion-sec2-box1-mission{ width: 50%; height: auto; float: left; display: block; padding-left: 15px; position: relative;}

.about-xcelion-sec2-box1-mission{ width: 50%; height: auto; float: left; display: block; padding-left: 15px; position: relative;}
.about-xcelion-sec2-box1-mission figure{width: 100%; height: auto; float: left; display: block; padding-right: 160px; }
.about-xcelion-sec2-box1-mission figure i{width: 100%; display: block; }
.about-xcelion-sec2-box1-mission figure i img{width: 100%; display: block; }
.about-xcelion-sec2-box1-mission aside{ position: absolute; right: 0px; bottom: 0; background: #fff; width: 285px; padding: 25px 0px 25px 25px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; border-top-left-radius: 10px; border-top-right-radius: 0px; }
.about-xcelion-sec2-box1-mission aside h2{width: 100%; height: auto;  display: block; padding-bottom: 15px; font-size: 28px; font-weight: 400; color: #000; line-height: 36px; } 
.about-xcelion-sec2-box1-mission aside p{width: 100%; height: auto; display: block;  font-size: 18px; font-weight: 400; color: #000; line-height: 24px;}

.about-xcelion-sec4{ width:100%; height: auto; display: block; position:relative; padding: 0px 0 0px 0;}
.about-xcelion-sec4:after{content:''; display:block; clear:both;}



.about-xcelion-sec4-box1{width:100%; height: auto; display: block; position:relative;}
.about-xcelion-sec4-box1:after{content:''; display:block; clear:both;}
.about-xcelion-sec4-box1 ul{margin-left: -10px; margin-right: -10px; height: auto; display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;flex-wrap: wrap;-webkit-flex-wrap: wrap; position:relative;}
.about-xcelion-sec4-box1 ul li{width:33.333%; height: auto; display: block; float: left; padding:10px 10px; overflow: hidden;}
.about-xcelion-sec4-box1 ul li a{ width: 100%; height: 100%; float: left; position: relative; overflow: hidden; z-index: 1; background: #f2f2f2; border-radius: 6px; padding: 50px 20px 0px 20px ; transition: 0.4s; }
.about-xcelion-sec4-box1 ul li a:hover{ background: #486aae;}
.about-xcelion-sec4-box1 ul li a figure{width:100%; height: auto; display: block; position: relative; border-top-right-radius: 10px; border-top-left-radius: 10px; overflow: hidden;}
.about-xcelion-sec4-box1 ul li a figure img{ width: 100%; display: block;border-top-right-radius: 10px; border-top-left-radius: 10px;  -webkit-transform: scale(1);transform: scale(1);	-webkit-transition: .5s ease-in-out;transition: .5s ease-in-out;}
.about-xcelion-sec4-box1 ul li a:hover figure img{	-webkit-transform: scale(1.1);transform: scale(1.1);}
.about-xcelion-sec4-box1 ul li a aside{width: 100%; height: 120px; float: left; position: relative;  padding: 0px 0px 0 0px; transition: 0.4s;}
.about-xcelion-sec4-box1 ul li a aside h2{font-size: 18px; font-weight: 400; color: #000; line-height: 36px; transition: 0.4s; padding-bottom: 10px;}
.about-xcelion-sec4-box1 ul li a aside p{font-size: 16px; font-weight: 400; color: #000; line-height: 22px; transition: 0.4s; }
.about-xcelion-sec4-box1 ul li a aside p strong{font-weight: 700; display: block;}
.about-xcelion-sec4-box1 ul li a small{position: absolute; right: 20px; top: 20px; width: 20px; height: 20px; transition: 0.4s;}
.about-xcelion-sec4-box1 ul li a:hover aside h2{ color: #fff;}
.about-xcelion-sec4-box1 ul li a:hover aside p{ color: #fff;}
.about-xcelion-sec4-box1 ul li a small:after{content: ''; position: absolute; right: 0; top: 0; width: 16px; height:16px;  background: url(../images/arrow-right5.png) no-repeat left top; -webkit-transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;  -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in-out;}
.about-xcelion-sec4-box1 ul li a:hover small:after{content: ''; position: absolute; right: 0; top: 0; width: 16px; height: 16px;  background: url(../images/arrow-right5-hover.png) no-repeat left top;}
.about-xcelion-sec4-box1 ul li a:hover figure{-webkit-box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.26);
-moz-box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.26);
box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.26);}


.padding50Tb{ padding: 50px 0 50px 0;}
.padding-bottom50{ padding-bottom: 50px;}
.padding-top50{ padding-top: 50px;}












@media all and (max-width:800px){
.about-xcelion-sec1-box1 aside { width: 100%; max-width: inherit; text-align: center; padding-bottom: 10px;}
.about-xcelion-sec1-box1 aside:after{ content:''; display:block; clear:both;}
.about-xcelion-sec1-box1 article {  width: 100%; padding-left: 0%; text-align: center;}

.about-xcelion-sec2-box1-vision{ width: 100%;  padding-right: 0px; position: relative;}
.about-xcelion-sec2-box1-vision figure {padding-right:0px; float: none;}
.about-xcelion-sec2-box1-vision aside{ position: relative; right:inherit; top:inherit; z-index: 22;  background: #fff; width:90%; display: block; margin: -60px auto 50px; padding: 25px 25px; border-radius: 10px; border-bottom-left-radius: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; text-align: center; }
.about-xcelion-sec2-box1-mission{ width: 100%;  padding-right: 0px; position: relative;}
.about-xcelion-sec2-box1-mission figure {padding-right:0px; float: none;}
.about-xcelion-sec2-box1-mission aside{ position: relative; right:inherit; top:inherit; z-index: 22;  background: #fff; width:90%; display: block; margin: -60px auto 50px; padding: 25px 25px; border-radius: 10px; border-bottom-left-radius: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; text-align: center; }
.about-xcelion-sec2-box1-mission {  padding-left: 0px;}

}







@media all and (max-width:600px){
.about-xcelion-sec4-box1 ul li { width: 50%;}
.about-xcelion-sec1-box1 aside h2 { font-size: 30px;line-height: 36px;}
.about-xcelion-sec1 { padding: 30px 0;}
.about-xcelion-sec2-box1-vision aside { margin: -60px auto 20px;}
.about-xcelion-sec2-box1-mission aside { margin: -60px auto 20px;}
.padding50Tb{ padding: 30px 0 30px 0;}
.padding-bottom50{ padding-bottom: 30px;}
.padding-top50{ padding-top: 30px;}

}

@media all and (max-width:550px){
.about-xcelion-sec4-box1 ul li { width: 100%;}    
}