@charset "utf-8";
/*幻灯片*/
.index-banner .swiper-container{height: 563px;}
.index-banner .pagination { position: absolute; z-index: 20; left: 50%; width: 140px; text-align: center; margin-left: -70px;  bottom: 20px; }
.index-banner .swiper-pagination-bullet {transition: all .3s ease;background:#b4b4b4;display: inline-block; width: 12px; height: 12px; border-radius: 12px; margin-right: 6px; opacity: 1; border: 0px solid #b4b4b4; cursor: pointer; }
.index-banner .swiper-pagination-bullet-active { background: #46be8a; width:40px; }
.index-banner .swiper-container .focus{ display: block; width: 100%; height: 100%; background-origin: center center; background-repeat: no-repeat;  background-size: cover;}
.index-banner .swiper-slide a{display: block;width: 100%;height: 100%;background-origin: center center;background-repeat: no-repeat; background-position: center center;}
.module-title .title{color:#333;font-size: 32px;    transition: all .3s ease-out 0s;}
.module-title .subtitle{margin-top: 10px;color: #999;font-size: 15px;}
.case-img{overflow: hidden;position: relative;}
#indexPage .case-img .img{height:280px;width:100%;background-position: center center;background-size: cover;background-repeat:no-repeat; }
.container-header{padding: 80px 0 80px;}
.index-case ul li img{width: 100%;transition: all 0.8s; -webkit-transition: all 1.2s; -moz-transition: 0.3s;}
.border-top{width: 0; height: 1px; top: 6%; left: 5%;background: #fff; opacity: .5; filter: alpha(opacity=50);}
.border-right{width: 1px; height: 0; top: 94%; right: 5%;background: #fff; opacity: .5; filter: alpha(opacity=50);}
.border-bottom{width: 0; height: 1px; bottom: 6%; left: 95%;background: #fff; opacity: .5; filter: alpha(opacity=50);}
.border-left{width: 1px; height: 0; top: 6%; left: 5%;background: #fff; opacity: .5; filter: alpha(opacity=50);}
#topSilder{height: 563px;}
.index-case{padding-bottom: 70px;}
@media (min-width: 1200px){
.index-case ul li a:hover .case-text{color: #5a4ee4;}
.index-case ul li a:hover img{-webkit-transform: scale(1.05) ; -moz-transform: scale(1.05); transform: scale(1.05);}
.index-case ul li a:hover .border-top, .index-case ul li a:hover .border-bottom{width: 90%; height: 1px;}
.index-case ul li a:hover .border-right, .index-case ul li a:hover .border-left{height: 88%; width: 1px;}
.index-case ul li a:hover .border-bottom{left: 5%;}
.index-case ul li a:hover .border-right{top: 6%;}
}
@media (max-width: 780px){
.index-case ul li{margin-bottom: 8px; padding-right: 15px;}
.index-case ul li .case-text{padding-left: 10px; padding-right: 10px; background-color: #fff;} 
.index-case ul li .zcase-view{right: 10px;}
}
.container-category {margin: 0 0 50px;text-align: center;}
.container-category a:after {position: absolute; margin-top: 3px;margin-left: 25px;width: 1px;height: 10px;background-color: #e7e7e7;content: '';}
.container-category a:last-of-type:after {width: 0;height: 0;}
.container-category a {text-decoration:none; cursor: pointer;box-sizing: initial;-webkit-box-sizing: initial;position: relative;display: inline-block;margin-left: 1px;padding: 8px 18px;height: 1pc;color: #898989;line-height: 1pc;transition: all .3s ease-out 0s;font-size: 14px;}
.container-category a.active, .container-category a:hover {background-color: #333;color: #fff;}
.index-case .index-case-list{display:none;}
.index-case .index-case-list.active{display:block;}
.index-case ul li .case-text {padding: 15px 0;position: relative;}
.index-case ul li .case-text .case-title {margin-top:10px;color:#505050;font-size:16px;margin-bottom: 10px;width: 95%;line-height: 20px;font-weight: bold;-webkit-transition: all 0.35s linear;-moz-transition: all 0.35s linear;-ms-transition: all 0.35s linear;-o-transition: all 0.35s linear;transition: all 0.35s linear;}
.index-case ul li .case-text .case-des {line-height: 22px;height: 44px;overflow: hidden;color:#b1b1b1;}
.index-case .case-view {position:absolute;right: 0;top: 28px;padding-right: 20px;font-size: 14px;color: #b4bab9;}
.index-case  .case-des span{padding-right:13px;}
#indexPage .li-con{
    border-radius: 20px;padding:50px 30px 50px 60px;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.15);overflow: hidden;}
#indexPage .index-okcase ul li{padding:28px;}
#indexPage .index-okcase ul{padding-left:-28px;padding-right:-28px;}
#indexPage .index-okcase ul li:first-child,#indexPage .index-okcase ul li:nth-child(2){padding-top:0;}
#indexPage .l-view{padding-left: 4px;overflow: hidden;float: left;
    background-image: url(../images/view/1.png);background-size:cover;background-position: center center;background-repeat: no-repeat;
    width: 266px;position: relative;
    height: 545px;}
    #indexPage .l-view-con{position: absolute;top:26px;left:11px;right:11px;bottom:10px;overflow: hidden;border-bottom-left-radius: 30px;border-bottom-right-radius: 30px;}
    #indexPage .l-view .header {    background: #ececec;left:0;padding:0 40px;
    height: 24px;
    line-height: 24px;
    font-size:12px;
    text-align: center;
    position: absolute;
    top:0;right:0;}
    #indexPage .l-inner{top:24px;bottom:0;left:0;right:0;
    position: absolute;
    background: #fff;}
    #indexPage .r-view{    float: left;
    margin-left: 10%;
    position: relative;}
    #indexPage .r-view-con{    background: #fff;
    margin-top: 100px;}
    #indexPage .r-view-con img{width:175px;}
#indexPage .r-view-con .codename{display: block;
    padding: 15px 0 21px;
    text-align: left;
    font-size: 15px;}
    #indexPage .r-view-con .des{padding-top:0px;}
    #indexPage .r-view-con .des span{padding:5px 0;display:block;font-size:15px;text-align: left;}
    #indexPage .r-view-con .des .green{color:#42d172;}

/* more */
.case-more2{position: relative;z-index: 1;margin:0 auto;line-height:42px;display:block;cursor:pointer;margin-top: 0;height:42px;width: 160px;border: 1px solid #e1e1e1;color: #898989;text-align: center;text-transform: Uppercase;transition: all .3s linear; margin-top: 20px;}
.case-more2:hover{border-color:#46be8a;}
.case-more{margin-top: 50px;}
.case-more .line{width: 1px; height: 45px; background-color: #d9d5d1; display: none\9;}
.case-more .circles{width: 7px; height: 7px; border: 1px solid #d9d5d1; display: none\9;}
.button-load-more i{top: 50%; left: 50%; margin-top: -7px; margin-left: -7px; color: #000;}
.button-load-more{margin: 20px auto 30px; height:126px; width:126px; position:relative; display:block;}
@media (max-width: 780px){
.button-load-more{width: 76px; height: 76px;  background: url(/images/huudon_more.jpg) no-repeat center center; background-size: 100%;}
.button-load-more svg{display: none;}
}
.button-load-more svg {fill:transparent; stroke:#e3ded9; stroke-width:1}
.button-load-more .c1,.button-load-more .c2 {
	-webkit-transform-origin:center center;
	-ms-transform-origin:center center;
	transform-origin:center center;
	-webkit-transition:fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),-webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	transition:fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),-webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	transition:fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	transition:fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94),-webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}
@media (min-width: 1200px){
.button-load-more:hover i{-webkit-animation: myCircle 0.8s linear; -moz-animation: myCircle 0.8s linear; animation: myCircle 0.8s linear;}
.button-load-more:hover .c1 {-webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg)}
.button-load-more:hover .c2 {-webkit-transform:rotate(-135deg); -ms-transform:rotate(-135deg); transform:rotate(-135deg)}
}
.index-advantage{padding-bottom: 90px;}
.mediabody{text-align: center;position: relative;margin-top:100px;}
.good-box-item:first-child .mediabody,.good-box-item:nth-child(2) .mediabody{margin-top:0;}
.mediabody .l{width:180px;text-align: left;position: absolute;}
.mediabody .r{padding-left:203px;}
.advIcon{width:100%;max-height:106px;margin:0 auto;}
.advName{display: block;text-align:left;padding-top: 19px;color: #333;font-size: 25px;}
.advDes{display: block;text-align:left;padding-top: 18px;color:#5b5b5b;font-size: 20px;letter-spacing:2px;line-height: 24px;}
.index-partner{background-color: #f8f8f8;position: relative;z-index:1;padding-bottom: 85px;overflow: hidden;}
.index-partner .swiper-container{padding-bottom: 100px;}
.partnerImg{/*-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);*/background-color: #fff;height: 148px;padding-top: 22px;text-align: center;cursor: pointer;}
.partnerImg img{height:97px;width:auto;cursor: pointer;}
.partnerImg:hover{-webkit-filter:none;filter:none}
.index-partner .pagination {z-index: 2;bottom: 12px;display: table;width: 100%;text-align: center;}
.index-partner .swiper-container{padding-bottom: 100px;}
.index-partner .swiper-pagination-bullet{margin: 5px; width: 12px; height: 12px; background: #b4b4b4; opacity: 1;}
.index-partner .swiper-pagination-bullet-active{background: #46be8a; opacity: 1;}
.partner-box-item .partnerImg{margin-top:60px;}
.partner-box-item:first-child .partnerImg,.partner-box-item:nth-child(2) .partnerImg,.partner-box-item:nth-child(3) .partnerImg,.partner-box-item:nth-child(4) .partnerImg{margin-top:0;}
@media screen and (min-width: 1200px) and (max-width: 1600px){
    #indexPage .l-view{width:245px;height:502px;}
    #indexPage .li-con{padding:50px 18px 50px 29px;}
    #indexPage .r-view{margin-left:8%;}
    #indexPage .r-view-con img{width:150ppx;}
    #indexPage .r-view-con .codename{font-size:13px;}
    #indexPage .r-view-con .des span{font-size:13px;}
}