﻿.header-navigation-banner {
    width: 100%;
    height: 600px;
    background-image: url(../image/attract-investment.png);
}

text {
    font-weight: 400;
}

.conten-but {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    padding: 20px 0;
    background-color: #F6F9FC;
}

.conten-butall {
    width: 160px;
    height: 50px;
    border-radius: 100px;
    background-color: #138DFF;
    color: #ffffff;
    text-align: center;
    line-height: 50px;
    display: flex;
}

.conten-butall img {
    width: 20px;
    height: 16.7px;
    margin-top: 16.5px;
    margin-left: 17px;
    z-index: 9;
}

.conten-butall span {
    font-size: 16px;
    font-weight: 400;
    margin: 0 17px 0 10px;
}

.conten-but-box {
    margin-left: 67px;
}

.conten-data-information {
    background-color: #ffffff;
    height: 700px;
}

.data-information {
    width: 1200px;
    margin: auto;
}

.information-conten {
    display: flex;
    flex-wrap: nowrap;
}

.information-img {
    width: 581px;
    height: 371px;
    margin-top: 101px;
    margin-left: 48px;
    background-image: url(../image/atlas-img.png);
}

.information-text {
    margin-top: 101px;
    margin-left: 59px;
}

.information-text h3 {
    font-size: 32px;
    line-height: 46px;
    font-weight: 400;
    color: #3D3D3D;
    margin-top: 28px;
}

.information-text-box {
    width: 511px;
    height: 160px;
    border-radius: 10px;
    background-color: #F8FBFF;
    margin-top: 36px;
}

.information-text-box ul {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    padding-top: 30px;
    margin: 0 46px;
}

.box-title {
    color: #666666;
    font-size: 14px;
    font-weight: 400;
}

.box-tex {
    color: #0084FF;
    font-size: 14px;
    font-weight: 400;
}

.box-tex span {
    font-size: 36px;
    font-weight: 400;
    color: #0084FF;
}

.text-boxall {
    font-size: 14px;
    font-weight: 400;
    color: #118CFF;
    margin-left: 46px;
    margin-top: 12px;
}

.text-box-but {
    width: 180px;
    height: 62px;
    background-color: #138DFF;
    margin-top: 39px;
    text-align: center;
    line-height: 62px;
    font-size: 20px;
    color: #FFFFFF;
    border-radius: 5px;
}

.text-box-but:hover {
    background: linear-gradient(270deg, #138DFF 0%, #1371FF 100%);
}

.information-box {
    margin-top: 76px;
}

.information-box ul {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.information-box ul li {
    width: 368px;
    height: 200px;
    background-color: #FFFFFF;
    border-radius: 20px;
    box-shadow: 0px 4px 10px 0px rgba(19, 141, 255, 0.18);
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.information-box ul li:hover {
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -o-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
}

.centen-nex img {
    width: 30px;
    height: 30px;
}

.centen-nex {
    display: flex;
    flex-wrap: nowrap;
}

.information-box-centen {
    margin: 56px 34px 0 34px;
}

.information-box-centen h4 {
    font-size: 20px;
    font-weight: 600;
    color: #0084FF;
    margin-left: 12.26px;
    margin-top: -3px;
}

.information-box-centen p {
    margin-top: 21px;
    font-size: 14px;
    line-height: 22px;
    color: #555555;
    font-weight: 400;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.conten-function {
    background-color: #F9FBFF;
    padding-bottom: 132px;
}

.conten-center {
    width: 1200px;
    padding-top: 167px;
    margin: auto;
    text-align: center;
}

.center-tex {
    font-size: 32px;
    font-weight: 400;
    line-height: 46px;
    color: #3D3D3D;
}

.center-second {
    font-size: 16px;
    font-weight: 400;
    color: #666666;
    margin-top: 28px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.centen-modu {
    margin-top: 48px;
}

.centen-moduall {
    margin-top: 51px;
}

.centen-modu-title {
    font-size: 20px;
    line-height: 22px;
    color: #138DFF;
    font-weight: 600;
}

.modu-box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 40px;
}

.modu-box li {
    width: 18%;
    height: 220px;
    background-color: #FFFFFF;
    border-radius: 5px;
    margin-bottom: 23px;
    margin-right: 20px;
    text-align: center;
}

.modu-box li img {
    width: 70px;
    height: 70px;
    margin-top: 36px;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.modu-box li p {
    font-size: 16px;
    font-weight: 400;
    color: #3D3D3D;
    margin-top: 26px;
}

.modu-boxall {
    font-size: 14px;
    line-height: 22px;
    font-weight: 400;
    color: #999999;
    margin-top: 8px;
    margin: 8px 34px 0 34px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.modu-box li:hover {
    box-shadow: 0px 4px 10px 0px rgba(19, 141, 255, 0.3);
}

.modu-box li:hover p {
    color: #138DFF;
}

.modu-box li:hover img {
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -o-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
}

/*  */
.modu-box-all {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 40px;
}

.modu-box-all li {
    width: 23%;
    /* height: 220px; */
    background-color: #FFFFFF;
    border-radius: 5px;
    margin-bottom: 23px;
    margin-right: 20px;
    text-align: center;
}

.modu-box-all li img {
    width: 70px;
    height: 70px;
    margin-top: 33px;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.modu-box-all li p {
    font-size: 16px;
    font-weight: 400;
    color: #3D3D3D;
    margin-top: 20px;
}

.modu-boxall {
    font-size: 14px;
    line-height: 22px;
    font-weight: 400;
    color: #999999;
    margin-top: 8px;
}

.modu-box-all li:hover {
    box-shadow: 0px 4px 10px 0px rgba(19, 141, 255, 0.3);
}

.modu-box-all li:hover img {
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -o-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
}

.modu-box-all li:hover p {
    color: #138DFF;
}

.modu-boxall-tex {
    font-size: 14px;
    line-height: 22px;
    font-weight: 400;
    color: #999999;
    margin-top: 8px;
    margin: 8px 38px 0 38px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    padding-bottom: 34px;
}

.centen-understand {
    width: 100%;
    height: 90px;
    margin-top: 99px;
    background-image: url(../image/understand-img.png);
    background-size: 100% 100%;
}

.understand-frame {
    display: flex;
    flex-wrap: nowrap;
    justify-content: end;
    margin-left: 105px;
    margin-right: 160px;
}

.understand-frame p {
    line-height: 90px;
    color: #136AFF;
    font-size: 20px;
    font-weight: 600;
}

.understand-frame ul {
    display: flex;
    flex-wrap: nowrap;
    line-height: 90px;
}

.frame-but {
    width: 90px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    border: 1px solid #138DFF;
    font-size: 14px;
    font-weight: 400;
    padding: 11px 17px;
    margin-right: 17px;
    border-radius: 5px;
    color: #138DFF;
}

.frame-but:hover {
    background-color: #138DFF;
    color: #FFFFFF;
}

.centen-support {
    background-color: #E6EEFF;
}

.support-title {
    font-size: 32px;
    line-height: 46px;
    font-weight: 600;
    color: #3D3D3D;
}

.support-box {
    padding-top: 86px;
    text-align: center;
}

.support-text {
    color: #666666;
    font-size: 16px;
    font-weight: 400;
    margin-top: 28px;
}

.support-banner {
    margin-top: 80px;
    overflow: hidden;
}

.support-banner ul {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: scroll;
    overflow-y: hidden;
    padding-left: 36px;
}

.support-banner ul li {
    margin-right: 36px;
}

::-webkit-scrollbar {
    display: none;
}

.banner-butall:active{
   background-color: #999999;
}

.banner-butall-right:active{
    background-color: #9E9E9E;
 }

.support-banner-img {
    width: 390px;
    height: 500px;
    background-color: #FFFFFF;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
    box-shadow: 0px 4px 15px 0px rgba(12, 111, 232, 0.3);
}

.banner-img {
    width: 390px;
    height: 301px;
    overflow: hidden;
}

.banner-img img {
    width: 100%;
    height: 301px;
    transition: 0.5s;
}

.support-banner-img h4 {
    font-size: 20px;
    font-weight: 400;
    color: #333333;
    margin-top: 30px;
    margin-left: 21px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.support-banner-img p {
    font-size: 14px;
    font-weight: 400;
    color: #666666;
    margin: 17px 30px 0 21px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}

.support-collect {
    width: 90px;
    height: 30px;
    background: linear-gradient(90deg, #138DFF 0%, #1371FF 100%);
    border-radius: 15px 0px 15px 0px;
    line-height: 30px;
    position: absolute;
    top: 0;
}

.support-collect img {
    width: 15px;
    height: 15px;
    margin: 0 0 0 11px;
}

.support-collect span {
    font-size: 12px;
    color: #FFFFFF;
}

.support-banner-but {
    margin: auto;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    margin-top: 64px;
    padding-bottom: 75px;
    text-align: center;
}

.banner-butall {
    width: 60px;
    height: 60px;
    border-radius: 60px;
    background-color: #FFFFFF;
}

.banner-butall-right {
    width: 60px;
    height: 60px;
    border-radius: 60px;
    background-color: #FFFFFF;
    margin-left: 31px;
}

.banner-butall-right img {
    width: 13.33px;
    height: 23.33px;
    line-height: 60px;
    margin-top: 18.15px;
    transform: rotate(-180deg);
}

.banner-butall img {
    width: 13.33px;
    height: 23.33px;
    line-height: 60px;
    margin-top: 18.15px;
}

.centen-cooperation {
    width: 100%;
    height: 699px;
    background-image: url(../image/background-img.png);
    text-align: center;
}

.cooperation-box {
    padding-top: 108px;
    width: 1200px;
    margin: auto;
}

.cooperation-title {
    font-size: 32px;
    font-weight: 600;
    line-height: 46px;
    color: #3D3D3D;
}

.cooperation-box p {
    width: 673px;
    font-size: 16px;
    color: #666666;
    font-weight: 400;
    margin: 28px auto;
}

.cooperation-flow {
    width: 678px;
    margin: 104px auto;
}

.flow-garden {
    width: 70px;
    height: 70px;
    border-radius: 70px;
    background: linear-gradient(270deg, #007BFF 0%, #45A5FF 100%);
    box-shadow: 0px 4px 10px 0px rgba(19, 141, 255, 0.3);
    color: #FFFFFF;
    text-align: center;
    line-height: 15px;
    display: table-cell;
    vertical-align: middle;
}

.flow-garden p {
    width: 30px;
    margin: auto;
}

.flow-garden-max p {
    width: 30px;
    margin: auto;
}

.flow-gardenall p {
    width: 30px;
    margin: auto;
}

.cooperation-flow ul {
    display: flex;
    flex-wrap: nowrap;
}

.flow-box {
    display: flex;
    flex-wrap: nowrap;
    margin: auto 32px;
}

.flow-boxall {
    display: flex;
    flex-wrap: nowrap;
    margin: auto 24px auto 32px;
}

.flow-arcall {
    margin-right: 4.25px;
    margin-top: -15px;
}

.flow-gardenall {
    width: 70px;
    height: 70px;
    border-radius: 70px;
    background-color: #FFFFFF;
    box-shadow: 0px 4px 10px 0px rgba(19, 141, 255, 0.3);
    color: #138DFF;
    border: 1px solid #138DFF;
    text-align: center;
    line-height: 15px;
    display: table-cell;
    vertical-align: middle;
}

.flow-garden-maxall {
    margin-top: -15px;
}

.flow-garden-max {
    width: 100px;
    height: 100px;
    border-radius: 100px;
    background: linear-gradient(270deg, #007BFF 0%, #45A5FF 100%);
    box-shadow: 0px 4px 10px 0px rgba(19, 141, 255, 0.3);
    color: #FFFFFF;
    text-align: center;
    line-height: 15px;
    display: table-cell;
    vertical-align: middle;
}

.flow-arc {
    margin-top: -15px;
}

.cooperation-but {
    margin: 117px auto 107px;
    width: 180px;
    height: 62px;
    line-height: 62px;
    background-color: #138DFF;
    border-radius: 5px;
    /* transition: all .3s; */
}

.cooperation-but:hover {
    background: linear-gradient(270deg, #138DFF 0%, #1371FF 100%);
}

.cooperation-butall {
    color: #FFFFFF;
    font-size: 20px;
    font-weight: 400;
}

.centen-channel {
    background-color: #F9FBFF;
}

.channel-box {
    width: 1200px;
    margin: auto;
}

.channel-box-title {
    font-size: 32px;
    font-weight: 600;
    line-height: 46px;
    color: #3D3D3D;
    padding-top: 97px;
    text-align: center;
}

.channel-case {
    margin-top: 60px;
}

.case-text {
    width: 1200px;
    background-color: #FFFFFF;
    border-radius: 10px;
}

.text-box {
    margin: 0 119px 0 35px;
    padding: 40px 0 34px 0;
    display: flex;
    flex-wrap: nowrap;
}

.text-box-img {
    width: 218px;
    height: 146px;
}

.text-box-img img {
    width: 218px;
    height: 146px;
}

.case-text-reight {
    display: flex;
    flex-wrap: nowrap;

}

.reight-timer {
    margin: 0 31px 0 15px;
    width: 56px;
}

.reight-timer p {
    font-size: 12px;
    font-weight: 400;
    color: #999999;
    margin-top: -13px;
}

.reight-timer span {
    font-size: 40px;
    font-weight: 600;
    color: #138DFF;
}

.reight-text {
    width: 734px;
}

.reight-text h4 {
    font-size: 20px;
    font-weight: 400;
    line-height: 24px;
    color: #333333;
}

.reight-text p {
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    color: #666666;
    margin-top: 18px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.channel-case ul li {
    margin-bottom: 20px;
}

.reight-but {
    border: 1px solid #E5E5E5;
    width: 136px;
    height: 32px;
    line-height: 32px;
    color: #9E9E9E;
    font-size: 12px;
    font-weight: 400;
    margin-top: 20px;
    text-align: center;
}

.see-more {
    padding: 30px 0 71px;
}

.channel-case ul li:hover {
    box-shadow: 0px 4px 10px 0px rgba(19, 141, 255, 0.3);
}

.channel-case ul li:hover .reight-but {
    background-color: #138DFF;
    color: #FFFFFF;
}

.channel-case ul li:hover .reight-text h4 {
    color: #138DFF;
}

.see-more-but {
    width: 180px;
    height: 62px;
    background-color: #138DFF;
    line-height: 62px;
    text-align: center;
    font-size: 20px;
    color: #ffffff;
    font-weight: 400;
    border-radius: 5px;
    margin: auto;
}

.see-more-but:hover {
    background: linear-gradient(270deg, #138DFF 0%, #1371FF 100%);
}

.centen-bottome {
    background-image: url(../image/cooperationall-img.png);
    width: 100%;
    height: 200px;
    text-align: center;
    line-height: 200px;
}

.centen-bottome img {
    width: 699px;
    height: 65px;
    margin: auto;
}

.cooperation-flow ul li {
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.cooperation-flow ul li:hover {
    -webkit-transform: translateY(-20px);
    -moz-transform: translateY(-20px);
    -o-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
}

.support-banner-img:hover .banner-img img {
    transform: scale(1.2);
}

.support-banner-img:hover h4 {
    color: #007BFF;
}