.cwgw-container {
    padding-top: 80px;
    background: #FFF;
}

.cwgw-banner {
    width: 100%;
    height: 500px;
    background: url(../img/hgyszh/hgyszh-banner.png) center center no-repeat;
    background-size: cover;
    margin-bottom: 62px;
}

.cwgw-content {
    width: 1200px;
    margin: 0 auto;
}

.top-button > a:last-child {
    background: linear-gradient(90deg, #006CDE 0%, #00A7EC 100%)
}

.cwgw-main-1 {
    background: #fff;
}

.cwgw-main-1-wrapper {
    width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    padding-bottom: 100px;
}

.cwgw-main-1-wrapper-left {
    padding-top: 85px;
}


.cwgw-main-1-wrapper-left h3 {
    color: #333;
    font-weight: bold;
    font-size: 30px;
}
.cwgw-main-1-wrapper-left b {
    font-size: 12px;
    color:#999;
    transform: scale(0.8333);
    transform-origin: left;
    opacity: 0.8;
    font-weight:normal;
    margin-bottom: 38px;
    display:block;
}

.cwgw-main-1-wrapper-left p {
    width: 500px;
    word-break: break-word;
    font-size: 14px;
    color: #666;
    line-height: 26px;
    padding-bottom: 63px;

}

.cwgw-main-1-wrapper-right {
    width: 644px;
    height: 400px;
    background: url(../img/hgyszh/whatishgyszh.png) center center no-repeat;
    background-size: 100% 100%;
}

.customer-case{
    background:#fff;
}
.hgyszh-main-2{
    background:#F7F8FA;
}
.hgyszh-main-2 h3 {
    background:#fff;
    padding-bottom: 18px;
    font-size: 30px;
    font-weight: bold;
    color: #333333;
    text-align: center;

}
.hgyszh-main-2 > p {
    font-size: 20px;
    color:#666;
    padding-bottom: 40px;
    background:#fff;
    text-align: center;
}
.hgyszh-main-2-wrapper{
    background:#F7F8FA;
}
.hgyszh-main-2-box{
    width:1200px;
    margin:0 auto;
}
.hgyszh-main-2-content{
   position:relative;
    height: 420px;
}
.hgyszh-main-2-content > div{
    position:absolute;
    left:0;
    top:0;
    z-index:1;
    width: 1200px;
    height: 420px;
    transition: all 0.25s ease;
    opacity: 0;
}
.hgyszh-main-2-content > div:nth-child(1){
    background:url(../img/hgyszh/problem.png) center center no-repeat;
    background-size: 100% 100%;
}
.hgyszh-main-2-content > div:nth-child(2){
    background:url(../img/hgyszh/progress-2.png) center center no-repeat;
    background-size: 100% 100%;
}
.hgyszh-main-2-content > div:nth-child(3){
    background:url(../img/hgyszh/progress-3.png) center center no-repeat;
    background-size: 100% 100%;
}
.hgyszh-main-2-content > div:nth-child(4){
    background:url(../img/hgyszh/progress-4.png) center center no-repeat;
    background-size: 100% 100%;
}
.hgyszh-main-2-content > div.active{
    opacity: 1
}
.hgyszh-main-2-tab{
    display:flex;
}
.hgyszh-main-2-tab > div{
    width: 300px;
    height: 240px;
    border-bottom: 1px solid transparent;
    transition: all 0.25s ease;
    background:#F2F3F5;
    padding: 38px 37px 0 36px;
}
.hgyszh-main-2-tab > div.active{
    border-bottom: 4px solid #1c56a0;
    background:#fff
}
.hgyszh-main-2-tab h4 {
    font-size: 18px;
    font-weight: bold;
    color:#333;
    padding-bottom: 20px;
}
.hgyszh-main-2-tab p{
    color:#666;
    line-height: 23px;
    font-size: 14px;
}
.hgyszh-main-3{
    background:#fff;
    margin-bottom: 122px;
}
.hgyszh-main-3-wrapper{
    width: 1200px;
    margin: 0 auto
}
.hgyszh-main-3-wrapper h3 {
    font-size:30px;
    color:#333;
    font-weight:bold;
    padding-top: 120px;
    padding-bottom: 18px;
    text-align: center;
}
.hgyszh-main-3-wrapper > p{
    font-size: 20px;
    color:#666;
    text-align: center;
    padding-bottom: 40px;
}
.hgyszh-main-3-wrapper > div{
    display:flex;
}
.ability-left{
    display:flex;
    flex-wrap: wrap;
    width: 814px;
    flex: 0 0 auto;
}
.ability-left > div{
    width: 386px;
    height: 190px;
    margin-right: 20px;
    margin-bottom: 20px;
    background:#FBFBFB;
    transition: all 0.25s ease;
    padding: 34px 28px 0 32px
}
.ability-right{
    background:#FBFBFB;
    padding: 34px 28px 0 32px;
    height: 400px;
}
.ability-left > div:hover, .ability-right:hover{
    box-shadow: 0px 4px 10px 0px #EAEAEA;
    background: linear-gradient(180deg, #FBFBFB 0%, #FFFFFF 100%);
}
.ability-left h4, .ability-right h4 {
    color:#1c56a0;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 16px;
    padding-left: 36px;
}
.ability-right h4 {
    background:url(../img/hgyszh/5.png) left center no-repeat;
    background-size: 20px 20px;
    margin-bottom: 0
}
.ability-left > div:nth-child(1) h4{
    background:url(../img/hgyszh/1.png) left center no-repeat;
    background-size: 20px 20px;
}
.ability-left > div:nth-child(2) h4{
    background:url(../img/hgyszh/2.png) left center no-repeat;
    background-size: 20px 20px;
}
.ability-left > div:nth-child(3) h4{
    background:url(../img/hgyszh/3.png) left center no-repeat;
    background-size: 20px 20px;
}
.ability-left > div:nth-child(4) h4{
    background:url(../img/hgyszh/4.png) left center no-repeat;
    background-size: 20px 20px;
}
.ability-left p, .ability-right p{
    font-size: 14px;
    color:#666;
    line-height: 23px;
}
.ability-right img {
    display:block;
    width: 252px;
    height: 228px;
    margin-bottom: 17px;
}

.cwtg-main-6-wrapper h3{
    font-size:30px;
    color:#333;
    font-weight: bold;
    text-align:center;
    margin-bottom: 18px;

}
.cwtg-main-6-wrapper>p{
    color:#666;
    font-size: 20px;
    margin-bottom: 40px;
    text-align:center;
}
.cwtg-main-6-wrapper-box{
    width: 100%;
    height: 480px;
    display:flex;
    color:#fff;
    background:url(../img/hgyszh/effect-bg.png) center center no-repeat;
    background-size: 100% 100%;
}
/**tab-wrapper*/
.tab-wrapper{
    width: 1200px;
    margin:0 auto;
    display:flex;
    justify-content: space-between;
}
.main-tab{
    padding-top: 49px;
    margin-right: 172px;
}
.main-tab-1, .main-tab-2{
    margin-bottom: 40px;
}
.main-tab h3{
    text-align:left !important;
    color:#fff !important;
    padding-bottom: 16px;
    font-size: 24px;
    letter-spacing: 1px;
    margin-bottom:0;
    position:relative;
    opacity: 0.6;
    transition: all 0.25s linear;
}
.main-tab h3:before{
    content: '';
    display:block;
    position:absolute;
    top:0;
    left: -30px;
    width: 4px;
    height: 37px;
    background:#fff;
    transition:all 0.25s linear;
    opacity:0;
}
.main-tab p{
    margin-bottom: 22px;
    font-size: 14px;
    opacity: 0.6;
    transition: all 0.25s linear;
}
.arrow-fuck{
    display:block;
    width: 63px;
    height: 10px;
    background:url(../img/arrow-fuck.png) center center no-repeat;
    background-size: 63px 10px;
    opacity: 0;
    transition: all 0.25s linear;
}
.main-tab > div{
    transition: margin 0.25s linear;
}
.main-tab > div.active {
    margin-left: 20px;
}

.main-tab > div.active h3, .main-tab > div.active h3:before{
    opacity: 1
}
.main-tab > div.active p{
    opacity: 1
}
.main-tab > div.active .arrow-fuck{
    opacity: 1
}
.main-content{
    width: 788px;
    position:relative;
}
.main-content>div{
    position:absolute;
    top:0;
    left:0;
    opacity: 0;
    transition: opacity 0.25s linear;
    padding-top: 26px;
}
.main-content > div.active{
    opacity: 1
}
.main-content img {
    margin-bottom: 18px;
    display:block;
    width: 100%;
    height: 254px;
}
.main-content-3 img {
    height: 428px;
}
.main-content p {
    line-height: 22px;
    font-size:14px;
    color:#fff;
    letter-spacing: 2px;
    padding-left: 15px;
    position:relative;
}
.main-content p:before {
    content: '';
    display:block;
     width: 5px;
    height: 5px;
    border-radius: 50%;
    background:#fff;
    position:absolute;
    left: 0;
    top: 50%;
    margin-top: -2.5px;
}