/* 首页轮播 */

.container-bgc {
    background: url(../images/indhead.jpg);
    background-repeat: no-repeat;
    height: 800px;
    background-position: center top;
    min-width: 1200px;
}
.container-bgc .lunbo {
    height: 73%;
}

.swiper-wrapper {
    margin: 0 auto;
}

.swiper-pagination-bullet {
    background: #0077ff;
}

.carousel-container {
    display: flex;
}

.copywriting {
    min-width: 645px;
    color: #fff;
    margin-top: 110px;
}

.copywriting .section {
    font-size: 50px;
}

.copywriting .text {
    font-size: 24px;
    font-weight: 100;
    margin-top: 40px;
    opacity: .9;
}

.copywriting a {
    display: block;
    margin-top: 63px;
    width: 160px;
    height: 40px;
    background: #fc9925;
    background: #fc9925;
    border-radius: 50px;
    text-align: center;
    line-height: 40px;
}
.copywriting a:hover span{
    padding-left: 15px;
}

.copywriting a span {
    font-size: 18px;
    color: #ffff;
    transition: all .3s;
}

.carousel-container .illustration {
    min-width: 640px;
}

.carousel-container .illustration img {
    width: 100%;
    vertical-align: top;
}

.indPbot {
    bottom: 25px !important;
}


/* 轮播结束 */


/* 服务及产品 */

.serviceproduct {
    margin: 0 auto;
}

.title-picture {
    text-align: center;
}


.Title-container .title {
    position: absolute;
    top: 55px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    color: #1678fe;
    width: 100%;
}

.Title-container .title h2 {
    font-size: 40px;
    text-shadow: 0px 4px 5px #ddd;
    font-weight: 600;s
}

.Title-container .title span {
    font-size: 18px;
}

.service-box .box-item {
    background: #f3f8ff;
    border-radius: 15px;
    box-shadow: 0px 4px 9px 0px rgb(80 151 254 / 36%);
}

.service-box .box-item h3 {
    font-size: 22px;
    text-align: center;
    margin-bottom: 30px;
}

.service-box .box-item p {
    font-size: 16px;
    text-align: center;
    color: #808080;
    margin: 10px 0;
}

.service-box .box-item .service-btn {
    margin:30px auto
}

.service-box .item-side {
    flex: 1;
    padding-top: 80px;
    margin: 30px 0;
}

.service-box .box-item:hover img {
    /* animation-name: boxitem; */
}

.boxitemImg {
    animation-name: boxitem;
}

@keyframes boxitem {
    0% {
        transform: translateX(-50%) translateY(-60%);
    }
    50% {
        transform: translateX(-50%) translateY(-80%);
    }
    100% {
        transform: translateX(-50%) translateY(-60%);
    }
}

.service-box .item-center {
    flex: 1.12;
    padding-top: 98px;
    margin: 0 45px;
}

.service-box .box-item img {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%) translateY(-60%);
    animation-duration: .7s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards
}

.service-box .item-center .service-btn {
    margin-top: 41px;
}


/* 解决方案 */

.solution {
    background: url(../images/bgc_02.png);
    background-position: center top;
    background-repeat: no-repeat;
    min-width: 1200px;
}

.solution-container {
    margin: 0 auto;
}

.Titlt-container2 {
    color: #fff;
}

.Titlt-container2 .title1 {
    font-size: 40px;
    font-weight: 700;
    text-shadow: 0 5px 10px #1778fe;
}

.Titlt-container2 .describe {
    font-size: 18px;
    margin-left: 71px;
    color: #e4edff;
}

.solution-box {
    display: flex;
    justify-content: center;
}

.solution-box .solubox-list {
    flex: 1;
    z-index: 2;
}

.solution-box .solubox-item:nth-last-child(1) {
    margin-bottom: 0;
}

.solu-icon {
    width: 50px;
    height: 50px;
    transition: all .2s;
}

.solu-icon01{
    background: url(../images/solu_icon02.png) center right no-repeat;
}

.solu-icon02{
    background: url(../images/solu_icon03.png) center right no-repeat;
}

.solu-icon03{
    background: url(../images/solu_icon04.png) center right no-repeat;
}

.solu-icon04{
    background: url(../images/solu_icon05.png) center right no-repeat;
}

.solu-icon05{
    background: url(../images/solu_icon06.png) center right no-repeat;
}

.solu-icon06{
    background: url(../images/solu_icon07.png) center right no-repeat;
}

.solu-icon07{
    background: url(../images/solu_icon08.png) center right no-repeat;
}

.solu-icon08{
    background: url(../images/solu_icon01.png) center right no-repeat;
}
.solu-icon10{
    background: url(../images/solu_icon10.png) center right no-repeat;
}
.jt {
    width: 58px;
    border-bottom: 1px solid #fff;
    text-align: right;
    float: right;
    transform: translateX(15px);
}

.jt span {
    display: block;
    width: 10px;
    height: 10px;
    border-left: 1px solid #fff;
    transform: rotate(-45deg) translateX(4px) translateY(2px);
    margin-left: 49px;
}

.solution-box .solubox-item {
    width: 340px;
    margin: 0 auto;
    margin-bottom: 39px;
    background-image: linear-gradient(to right top, #fff, #fff);
    transition: all .3s;
    border-radius: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 0 4px 9px 0px #005ce2;
    background-size: 100%;
}

.solution-box .solubox-item:hover a {
    box-shadow: 0 3px 13px 0px#0d3ce7e0;
    background-image: linear-gradient(to top right, #4f97ff, #1376fe);
    background-repeat: no-repeat;
    background-size: 100%;
}

.solution-box .solubox-item .jt {
    animation: solujt .5s ease-in-out 0s infinite alternate;
}

@keyframes solujt {
    0% {
        transform: translateX(15px);
    }
    100% {
        transform: translateX(30px);
    }
}

.solution-box .solubox-item:hover .solu-icon {
    background-position: center left;
}

.solution-box .solubox-item:hover h3 {
    color: #fff;
}

.solution-box .solubox-item:hover p {
    color: #fff;
}

.solution-box .solubox-item h3 {
    margin: 15px 0;
    color: #333;
    font-size: 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.solution-box .solubox-item p {
    font-size: 16px;
    color: #808080;
    line-height: 1.5;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.solution-box .solubox-item a {
    display: block;
    padding: 20px 41px 27px 24px;
    background-image: linear-gradient(to top right, #4f97ff, #1376fe);
    background-size: 0;
    background-repeat: no-repeat;
    transition: all .4s;
    border-radius: 4px;
}

.solubox-center {
    margin: 110px 30px 0 30px;
}

.marginR0 {
    margin-right: 0 !important;
}

.marginL0 {
    margin-left: 0 !important;
}


.solution-container .solu-effect {
    position: absolute;
}

.d1 {
    display: block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #9fc7ff;
    position: absolute;
    left: 785px;
    top: 360px;
    transform: translateX(-50%) translateY(-50%);
}

.solution-container .eff1 {
    width: 0px;
    height: 0px;
    border-radius: 50%;
    border: 1px solid #8db6f1;
    top: 360px;
    left: 785px;
    transform: translateX(-50%) translateY(-50%);
    animation: ef1 2s linear infinite forwards;
}

.d2 {
    display: block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #9fc7ff;
    position: absolute;
    top: 649px;
    left: 366px;
    transform: translateX(-50%) translateY(-50%);
}

.solution-container .eff2 {
    width: 0px;
    height: 0px;
    border-radius: 50%;
    border: 1px solid #8db6f1;
    top: 649px;
    left: 366px;
    transform: translateX(-50%) translateY(-50%);
    animation: ef2 2s .5s linear infinite forwards;
}

.d3 {
    display: block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #9fc7ff;
    position: absolute;
    top: 619px;
    left: 832px;
    transform: translateX(-50%) translateY(-50%);
}

.solution-container .eff3 {
    width: 0px;
    height: 0px;
    border-radius: 50%;
    border: 1px solid #8db6f1;
    top: 619px;
    left: 832px;
    transform: translateX(-50%) translateY(-50%);
    animation: ef3 2s 1s linear infinite forwards;
}

@keyframes ef1 {
    0% {
        width: 0px;
        height: 0px;
        opacity: 1;
    }
    70% {
        opacity: 1;
    }
    100% {
        width: 150px;
        height: 150px;
        opacity: 0;
    }
}

@keyframes ef2 {
    0% {
        width: 0px;
        height: 0px;
        ;
    }
    70% {
        opacity: 1;
    }
    100% {
        width: 200px;
        height: 200px;
        opacity: 0;
    }
}

@keyframes ef3 {
    0% {
        width: 0px;
        height: 0px;
        ;
    }
    70% {
        opacity: 1;
    }
    100% {
        width: 250px;
        height: 250px;
        opacity: 0;
    }
}


/* 系统开发服务案例 */

.case {
    background: url(../images/bgc_03.png);
    background-repeat: no-repeat;
    background-position: center bottom;
    min-width: 1200px;
}

.case-container {
    margin: 0 auto;
}

.casebox1 {
    background: url(../images/case_01.png) center center no-repeat;
}

.casebox2 {
    background: url(../images/case_02.png) center center no-repeat;
}

.casebox3 {
    background: url(../images/case_03.png) center center no-repeat;
}

.casebox4 {
    background: url(../images/case_04.png) center center no-repeat;
}

.casebox5 {
    background: url(../images/case_05.png) center center no-repeat;
}

.casebox6 {
    background: url(../images/case_01.png) center center no-repeat;
}

.case-item {
    display: block;
    width: 380px;
    height: 240px;
    border-radius: 5px;
    overflow: hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 0 4px 9px rgb(80 151 254 / 36%);
}
.case-item img{
    width: 100%;
}
.case-item:hover .case-effect {
    visibility: visible;
    opacity: 1;
}

.case-item .case-effect {
    width: 380px;
    height: 240px;
    position: absolute;
    top: 0;
    left: 0;
    background: rgb(0, 110, 242, .8);
    opacity: 0;
    transition: all .3s;
    visibility: hidden;
}

.case-item .case-effect .effect-layer {
    max-width: 90%;
    text-align: center;
    margin: 0 auto;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.case-item .case-effect .effect-layer .tit {
    font-size: 24px;
    color: #fff;
}

.case-item .case-effect .effect-layer p {
    font-size: 16px;
    color: #fff;
    margin-top: 15px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.case-item .case-effect .effect-btn {
    text-align: center;
}

.case-item .case-effect .effect-btn a {
    display: inline-block;
    font-size: 16px;
    padding: 8px 25px;
    border-radius: 50px;
    box-shadow: 0 2px 4px 0px #0049b2c2;
    color: #2d8dff;
    background: #fff;
}

.case-item .case-effect .effect-btn a:hover {
    color: #FFF;
    background: rgba(255, 255, 255, 0);
}

.effect-btn .ylbtn {
    display: inline-block;
    margin: 0 18px;
    background: linear-gradient(to right, #5098ff, #1476fe);
    border-radius: 50px;
}


.case-item h4 {
    width: 40px;
    border-bottom: 4px solid #fff;
    box-shadow: 3px 3px 0px 0px #707070
}


.pdb40 {
    padding-bottom: 40px;
}

.casePbot {
    bottom: 0 !important;
}



/* 横幅 */

#wrap {
    margin: 0px;
    height: auto;
    width: 100%;
    overflow: auto;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    min-width: 1200px;
}

.index_number {
    width: 100%;
    margin: 20px auto;
    text-align: left;
    overflow: hidden !important;
}

.main_red {
    background: url(../images/bgc_09.png) center center no-repeat;
    width: 100%;
    height: 230px;
    background-size: cover;
    padding: 30px;
    min-width: 1200px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.time_bg {
    width: 1200px;
    margin: 0 auto;
    color: #fff;
    padding: 20px 0;
}

.time_bg ul li {
    float: left;
    width: 300px;
    position: relative;
}

.xyNumber {
    font-size: 56px;
    margin: 0;
    text-align: center;
    /* line-height: 90px; */
    margin-top: 9px;
    font-family: "KaiTi";
    font-weight: normal;
    text-shadow: 0 4px 4px #005bda
}

.time_bg ul li span {
    position: absolute;
    top: 10px;
    right: 75px;
    font-size: 30px;
    display: block;
}

.index_number p {
    font-size: 16px;
    text-align: center;
    margin: 10px;
    display: block;
    text-shadow: 0 4px 4px #005bda
}

.time_bg ul li span.xyj3 {
    right: 25px;
}


/* 开发项目服务流程 */

.process {
    background: url(../images/bgc_04.png) center bottom no-repeat;
    min-width: 1200px;
}

.process-container {
    margin: 0 auto;
}

.pro-layer {
    padding: 0 5px;
}

.pro-item:nth-of-type(1) .pro-layer:nth-of-type(1) {
    animation: pro 1s linear alternate infinite;
}

.pro-item:nth-of-type(2) .pro-layer:nth-of-type(1) {
    animation: pro2 1.2s linear alternate infinite;
}

.pro-item:nth-of-type(2) .pro-layer:nth-of-type(2) {
    animation: pro 2s linear alternate infinite;
}

.pro-item:nth-of-type(3) .pro-layer:nth-of-type(1) {
    animation: pro 1.5s linear alternate infinite;
}

.pro-item:nth-of-type(3) .pro-layer:nth-of-type(2) {
    animation: pro2 2s linear alternate infinite;
}

.pro-item:nth-of-type(4) .pro-layer {
    animation: pro2 1.2s linear alternate infinite;
}

.pro-item:nth-of-type(5) .pro-layer:nth-of-type(1) {
    animation: pro 1s linear alternate infinite;
}

.pro-item:nth-of-type(5) .pro-layer:nth-of-type(2) {
    animation: pro2 1s linear alternate infinite;
}

@keyframes pro {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(20px);
    }
}

@keyframes pro2 {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-20px);
    }
}

.pro-layer img {
    vertical-align: middle;
}

.pro-layer span {
    font-size: 20px;
}

.pro-layer h4 {
    position: absolute;
    border-left: 1px solid #d5e6ff;
    left: 40px;
    top: 68px;
}

.bgc_0401 {
    height: 191px;
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    background: url(../images/bgc_04_01.png) center bottom no-repeat;
}


/* 信任 */

.evaluate {
    background: url(../images/bgc_10.png) center top no-repeat;
    min-width: 1200px;
}

.evaluate-container {
    margin: 0 auto;
}

.evaluate .title1 {
    color: #1a7afe;
    text-shadow: none;
}

.evaluate .describe {
    color: #1a7afe;
}

.process-content {
    width: 100%;
    height: 100%;
    background: #fff;
    text-align: center;
    padding: 0 40px;
    border-radius: 10px;
    box-shadow: 0px 4px 9px rgb(80 151 254 / 36%);
    margin: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.process-content span {
    font-size: 24px;
    color: #333;
    padding: 17px 28px;
    background: url(../images/protext_01.png), url(../images/protext_02.png);
    background-position: left top, right bottom;
    background-repeat: no-repeat, no-repeat;
}

.process-content p {
    font-size: 16px;
    line-height: 2;
    color: #7d7d7d;
}

.process-content a {
    color: #4794FF;
}

.process-content img {
    float: right;
}


/* 合作伙伴 */

.index_customer {
    min-width: 1200px;
    background: url(../images/bgc_07.png) center bottom no-repeat;
}

.customer-container {
    margin: 0 auto;
}

.customer-container ul {
    display: flex;
    flex-wrap: wrap;
}

.customer-container li img {
    width: 100%;
    height: 100%;
    opacity: .5;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    transition: all .3s;
}

.customer-container li {
    width: 240px;
    height: 124px;
    border: 0.5px solid #eee;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.customer-container li:hover {
    box-shadow: 0px 0px 10px 0px #a7cbff;
    border: none;
    z-index: 2;
}

.customer-container li:hover img {
    -webkit-filter: grayscale(0);
    -moz-filter: grayscale(0);
    -o-filter: grayscale(0);
    filter: grayscale(0);
    opacity: 1;
}


/* 新闻中心 */

.index-news {
    min-width: 1200px;
    background: url(../images/bgc_06.png) center top no-repeat;
}

.news-container {
    margin: 0 auto;
}

.flex1 {
    flex: 1;
}

.new-list {
    display: none;
    padding-top: 16px;
}
.Listactive{
    display: block;
}

.new-list .jt {
    visibility: hidden;
    animation: jt .5s ease-in-out 0s infinite alternate;
    transform: translateX(-12px) translateY(-4px);
}

@keyframes jt {
    0% {
        transform: translateX(-12px) translateY(-4px);
    }
    100% {
        transform: translateX(8px) translateY(-4px);
    }
}

.news-container .layer-box1 {
    box-shadow: 0 4px 9px rgb(80 151 254 / 36%);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 10px;
    overflow: hidden;
}

.wid600 {
    width: 600px;
}

.news-item a {
    padding: 0 37px 0 20px;
    color: #fff;
}

.news-container .layer-box1 img {
    display: block;
    width: 100%;
    transition: all 0.3s;
    -ms-transition: all 0.3s;
}
.news-container .layer-box1:hover img { 
    transform: scale(1.2);
}

.newstop {
    background: url(../images/news_666.jpg) center center no-repeat;
    background-size: cover;
}

.news-data {
    margin-top: 45px;
    width: 100px;
}

.news-data .day {
    font-size: 50px;
}

.news-data .fullyear {
    font-size: 14px;
}

.news-content {
    margin-left: 10px;
    overflow: hidden;
}

.news-content h4 {
    font-size: 22px;
    border-bottom: 1px solid;
    padding: 34px 0 22px 0;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.news-content p {
    font-size: 14px;
    padding: 22px 0 32px 0;
    font-weight: normal;
}

.news-container .layer-box2 {
    padding-left: 30px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.newstitle li a {
    display: block;
    border-radius: 50px;
    padding: 10px 33px;
    font-size: 16px;
    background-image: linear-gradient(to right, #4f97ff, #1476fe);
    background-size: 0% 0%;
    background-repeat: no-repeat;
    background-position: center;
    /* transition: all .3s; */
    margin: 0 6px;
}

.newstitle li a:hover {
    color: #fff;
    background-image: linear-gradient(to right, #4f97ff, #1476fe);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
    box-shadow: 0 4px 9px rgb(80 151 254 / 36%);
}

.newactive{
    color: #fff;
    background-image: linear-gradient(to right, #4f97ff, #1476fe);
    background-size: 100% 100% !important;
    background-repeat: no-repeat;
    background-position: center;
    box-shadow: 0 4px 9px rgb(80 151 254 / 36%);
}

.new-list .list-item {
    border-bottom: 1px solid #d5e6ff;
    transition: all;
    padding: 32px 32px 23px 23px;
}

.new-list .list-item:hover {
    background-image: linear-gradient(to top right, #539aff, #016bfe);
    border-radius: 10px;
}

.new-list .list-item:hover a .data {
    color: #fff;
}

.new-list .list-item:hover .content h4 {
    color: #FFF;
}

.new-list .list-item:hover .content p {
    color: #FFF;
}

.new-list .list-item:hover .jt {
    visibility: visible;
}

.new-list .list-item a {
    width: 100%;
}

.new-list .list-item a .data {
    padding-right: 20px;
    text-align: center;
    color: #1074fe;
    border-right: 1px solid #d4d4d4;
}

.new-list .list-item a .data .day {
    font-size: 40px;
}

.new-list .list-item a .data .year {
    font-size: 16px;
    white-space: nowrap;
}

.new-list .list-item .content {
    padding-left: 25px;
    white-space: nowrap;
    overflow: hidden;
}

.new-list .list-item .content h4 {
    font-size: 22px;
    color: #333;
    font-weight: normal;
    text-overflow: ellipsis;
    overflow: hidden;
}

.new-list .list-item .content p {
    font-size: 14px;
    padding-top: 22px;
    color: #808080;
    white-space: pre-wrap;
}