/* index ~ project requirements  */
.requirements{padding: 37px 0 13px; background: url(../images/huudon_bg.jpg) no-repeat center center; background-size: cover;
-webkit-box-shadow: 0 -3px 12px #dad6d6; -moz-box-shadow: 0 -3px 12px #dad6d6; box-shadow: 0 -3px 12px #dad6d6;}
.require-top .text-right *{color: #c1c3f3; }
.require-top .text-right .ff-ar{margin-bottom: 0;}
.input-box{margin-top: 20px; height:50px; line-height:10px;}
.input-wrap{position: relative; height:50px; line-height:50px; padding:0 10px; border: 1px solid transparent; background: rgba(255,255,255,.85); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#d9ffffff,endColorstr=#d9ffffff); zoom:1;}
:root .input-wrap{filter: none\9;}
.input-wrap.error{border: 1px solid #e34220;}
.input-wrap .required{width: 100%; color: #ac63ce; font-size: 14px; line-height:50px; height:50px; font-weight: normal; background: transparent;}
.input-wrap .placeholder{position: absolute; top:0; left:10px; color: #ac63ce; font-size: 14px; font-weight: normal;}
.submit-box{margin-top: 30px;}
.submit-box .submit{position: relative; top: 0; padding: 0.65% 3.55%; color: #fff; font-size: 20px;
background: -moz-linear-gradient( left,#632bcf,#9128ef);
background: -webkit-gradient(linear,0 50%,100% 50%,from(#632bcf),to(#9128ef));
background: -webkit-linear-gradient(left,#632bcf,#9128ef);
background: -o-linear-gradient(left,#632bcf,#9128ef);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#632bcf, endColorstr=#9128ef);/*IE<9>*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#632bcf, endColorstr=#9128ef)";/*IE8+*/
-webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; transition: all 0.3s linear;
}
@media (min-width: 1200px){
.submit-box .submit:hover{top: -5px; -webkit-box-shadow: 0 11px 16px rgba(0,0,0,.17); -moz-box-shadow: 0 11px 16px rgba(0,0,0,.17); box-shadow: 0 11px 16px rgba(0,0,0,.17);}
}
@media (max-width: 780px){
.requirements{padding-top: 0; background: #fff;}
.requirements .input-box{margin-right: 15px;}
.require-top{padding: 38px 0; background: url(/images/huudon_bg.jpg) no-repeat center center;}
.require-top .col-xs-12{text-align: center;}
.require-top .col-xs-12 img{width: 55%;}
.input-wrap{border-bottom: 1px solid #f2f2f2;}
.input-wrap .required, .input-wrap .placeholder{color: #838383;}
.submit-box{margin-top: 22px;}
}
@media (max-width: 414px){
.require-top .col-xs-12 img{width: 70%;}
}
@media (min-width: 780px){
.requirements{padding:50px 0;}
}


/* index ~  feedback customer */
.customer{position: relative; padding: 50px 0; background: #2c313f;}
.customer .dots{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(/images/huudon_dot.png) repeat;
-webkit-animation: myflash 8s ease-in-out infinite;
-moz-animation: myflash 8s ease-in-out infinite;
-o-animation: myflash 8s ease-in-out infinite;
animation: myflash 8s ease-in-out infinite;
}
.responsive .dots{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(/images/huudon_dot_white.png) repeat; opacity: .5;
-webkit-animation: myflash 8s ease-in-out infinite;
-moz-animation: myflash 8s ease-in-out infinite;
-o-animation: myflash 8s ease-in-out infinite;
animation: myflash 8s ease-in-out infinite;
}
@keyframes myflash{
0 {opacity: .5;}
50% {opacity: .2;}
100% {opacity: .5;}
}
@-moz-keyframes myflash{
0 {opacity: .5;}
50% {opacity: .2;}
100% {opacity: .5;}
}
@-webkit-keyframes myflash{
0 {opacity: .5;}
50% {opacity: .2;}
100% {opacity: .5;}
}
@-o-keyframes myflash{
0 {opacity: .5;}
50% {opacity: .2;}
100% {opacity: .5;}
}
.customerbg{position: absolute; top: 0; left: 0; width: 100%; height: 40px; background: url(/images/huudon_bg1.jpg) repeat-x; background-size: auto 100%;}
.customer ul li {position: relative; margin: 2% 0; color: #abacb0;}
.customer ul li.active{z-index:99999;}
.customer ul li a{display: block; width: 97%; margin: 0 auto; background-color: #333949; text-align: center;}
.customer ul li:first-child{padding-top: 4%; text-align: center;}
.customer ul li:first-child img{margin-bottom: 20px;}
@media (min-width: 1200px){
.customer ul li {margin: 0.79% 0;}
.customer ul li:first-child{text-align: right; padding-right:50px;}
.customer ul li:first-child *{margin-right: 1%;}
.customer ul li a:hover{background-color: #5f55ce; -webkit-box-shadow: 0 0 17px #282c39; -moz-box-shadow: 0 0 17px #282c39; box-shadow: 0 0 17px #282c39; -webkit-transform: scale(1.2); -moz-transform: scale(1.2); transform: scale(1.2);}
.customer ul li a:hover img{position: relative; top: -0.5px; left: 0.5px; -webkit-transform: scale(0.96); -moz-transform: scale(0.96); transform: scale(0.96); }
}

@media (min-width: 1200px){
.responsive-ul li:hover img{animation: flipInY 2s ease-in-out; -webkit-animation: flipInY 2s ease-in-out;}
.responsive-ul .desc li a:hover span{color: #5f55ce;}
.responsive-ul .desc li a:hover em{width: 100%;}
}
@media (max-width: 1366px){
.responsive-top .desc{left: 26%;}
}
@media (max-width: 1199px){
.responsive-tit{padding: 60px 0 90px;}
.responsive-tit h3{font-size: 28px;}
.responsive-tit h3 .red{color: #5f55ce;}
.responsive-top .desc{left: 23%;}
.responsive-top .line{left: 34%; width: 100px;}
.responsive-ul {margin-top: 0;}
.responsive-ul >li{margin-top: 120px; padding: 0; width: 45%;}
.responsive-ul >li:nth-of-type(2n-1){float: left;}
.responsive-ul >li:nth-of-type(2n){float: right;}
}
.responsive-top {height: 535px;}
@media (max-width: 1080px){
.responsive-top{height: 365px;}
.responsive-ul{padding: 0 8%;}
}


@media (min-width: 1200px){
.index-news .item .more a:hover em{width: 100%;}
.index-news .item .more a:hover span{color: #fff;}
.index-news .industry, .index-news .company{padding-right: 15px;}
.index-news .industry .item .col-sm-8 >a:hover h5{color: #5f55ce;}
.index-news .industry .item .more a:hover{border: 1px solid #5f55ce;}
.index-news .industry .item .more a:hover em{background: #5f55ce;}
.index-news .company .item .more a:hover{border: 1px solid #ffa13d;}
.index-news .company .item .more a:hover em{background: #ffa13d;}
.index-news .company .item .col-sm-8 >a:hover h5{color: #ffa13d;}
}
@media (max-width: 1199px){
.index-news .industry{margin-bottom: 15px;}
.index-news .item .col-sm-4 img{margin-top: 18%;}
}

/* index ~  signing company */
.signing{padding-top: 40px; background: #f6f6f6;}
.signing .swiper-slide a{margin: 0 auto; background-color: #fff; display: block; width: 91.65%; height: 100%;}
.signing .picbox{position: relative; height: 112px; border-bottom: 1px solid #e5e5e5;}
.signing .picbox img{position: absolute; top: 0; left: 50%; margin-left: -63px; width: 126px; height: 112px; -webkit-transition: all 0.35s linear; -moz-transition: all 0.35s linear; transition: all 0.35s linear;}
.signing .picbox img.after{-webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0);}
.signing .picbox img.before{-webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1);}
.signing .date{margin:15px 0; padding: 0 12px; font-size: 12px; line-height: 12px; color: #c0c0c0; border-right: 1px solid #c0c0c0;}
.signing .desc{margin: 10px 12px; width: 65%; color: #565656; line-height: 22px; height: 44px; overflow: hidden; font-size: 15px;}
@media (max-width: 1600px){
.signing .desc{width: 57%;}
}
@media (min-width: 1200px){
.signing .swiper-slide a:hover{background-color: #5f55ce;}
.signing .swiper-slide a:hover .picbox{border-bottom: 1px solid #7c71f5;}
.signing .swiper-slide a:hover *{color: #fff;}
.signing .swiper-slide a:hover img.before{-webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0);}
.signing .swiper-slide a:hover img.after{-webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1);}

}
.signing .swiper-container{padding-bottom: 100px;}
.signing .swiper-pagination-bullet{margin: 5px; width: 12px; height: 12px; background: #b4b4b4; opacity: 1;}
.signing .swiper-pagination-bullet-active{background: #5f55ce; opacity: 1;}
.pagination{z-index: 2; bottom: 12px; display: table; width: 100%; text-align: center;}

/* cases */
.banner{-webkit-animation: fadeInDown 2s; animation: fadeInDown 2s;}
.tab-ul {margin-bottom: 45px; border-bottom: 1px solid #bfbfbf;}
.tab-ul ul{overflow: hidden; width: 100%; margin: 0 auto;}
.tab-ul li{float: left; padding: 0; text-align: center;}
.tab-ul li a{position: relative; display: block; margin: 0 auto; padding: 25px 0; width: 70%; color: #373737; font-size: 20px;}
@media (max-width: 780px){
.tab-ul li a{font-size: 15px;}
}
.tab-ul li a img{display: block; margin: 40px auto;}
.tab-ul li a em{position: absolute; left: 50%; bottom: 0; z-index: 99; width: 0; height: 5px; background: #4f4f4f; -webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;transition: all 0.5s ease;}
.tab-ul li.current a em{left: 0; width: 100%;}
.case-ani{position: relative; margin-top: 170px; height: 340px;}
.case-ani >div{position: absolute !important; overflow: hidden;}
.case-ani1 .ani1{left: -1% !important; bottom: 2% !important; top: auto  !important; width: 17.5%; z-index: 1;}
.case-ani1 .ani2{left: 7% !important; bottom: 5% !important; width: 57.8%;}
.case-ani1 .ani3{left: 29% !important; bottom: 6%; top: auto !important; width: 43%;}
.case-ani1 .ani3 img.pa{top: 7.5%; left: 12.3%; width: 75.3%; height: 80.8%;}
.case-ani1 .ani4{left: 72% !important; bottom: 7%; top: auto !important; width: 11.3%;}
.case-ani1 .ani5{right: 0; bottom: 3%; left: auto !important; top: auto !important; width: 24.3%;}
.case-ani1 .ani6{left: 81% !important; bottom: 19%; top: auto !important; width: 11.2%;}
@media (min-width: 1200px){
.tab-ul ul{width: 69%;}
.tab-ul li a:hover em{left: 0; width: 100%;}
}