.banner {
    padding-top: 2.88rem;
    height: 7.99rem;
    background: url("../images/serviceSolution/banner.jpg") no-repeat;
    background-size: 100% 100%;
}
@media screen and (max-width: 17.5rem)  {
    .infoTop {
        width: 15rem;
    }
}

.banner-title {
    margin-left: 1.47rem;
    font-size: 0.48rem;
    color: #ffffff;
	opacity: 0.95;
    -webkit-animation:fadeInLeft 1s .2s ease both;
    -moz-animation:fadeInLeft 1s .2s ease both;
    left:calc(50% - 6.11rem);
}
.banner-sub {
    margin-top: 0.06rem;
    margin-left: 1.47rem;
    margin-bottom: 0.36rem;
    font-size: 0.18rem;
    line-height: 0.33rem;
    color: #ffffff;
    left:calc(50% - 6.11rem);
    -webkit-animation:fadeInLeft 1s .5s ease both;
    -moz-animation:fadeInLeft 1s .5s ease both;
}
.banner-btn {
    width: 2.41rem;
    height: 0.72rem;
    line-height: 0.72rem;
    text-align: center;
    margin-left: 1.47rem;
    background-image: linear-gradient( #ff8f27, #ff8f27), linear-gradient(-90deg, #4a7cee 0%, #0db0e6 100%), linear-gradient(93deg, rgba(239, 180, 102, 1) 0%, #e8875b 100%);
    background-blend-mode: normal, normal, normal;
    border-radius: 0.08rem;
    font-size: 0.28rem;
    color: #fff;
    left: calc(50% - 6.11rem);
    -webkit-animation: fadeIn 2s .7s ease both;
    -moz-animation: fadeIn 2s .7s ease both;
}
.banner-img {
    width: 6.22rem;
    height: 7.22rem;
    position: absolute;
    right: 1rem;
    top: -1rem;
    animation-name: fadeInUp, jump;
    animation-duration: .5s, 1.8s;
    animation-delay: .9s, 1.1s;
    animation-iteration-count: 1, infinite;
    animation-fill-mode: forwards;
    animation-timing-function: linear;
}
.info-box {
    position: relative;
    margin-top: 1.38rem;
    margin-bottom: 1.38rem;
    display: flex;
    justify-content: space-between;
}
.info-box::after {
    width: 0.02rem;
    position: absolute;
    content: "";
    top: 0;
    bottom: 0;
    right: 4.57rem;
    background-color: #e5e5e5;
}
.info-left {
    flex: 1;
    padding-right: 0.32rem;
    margin-right: 0.32rem;
}
.info-class {
    display: flex;
    background-color: #83b0ff;
    border-radius:.15rem;
    overflow:hidden;
}
.class-name {
    position: relative;
    flex:1;
    height: 0.8rem;
    line-height: 0.8rem;
    text-align: center;
    font-size: 0.3rem;
    color: #fff;
    cursor: pointer;
}
.class-name::before {
    content: "";
    position: absolute;
    width: 0.02rem;
	height: 0.36rem;
	background-color: #ffffff;
    top:50%;
    margin-top: -0.18rem;
    left: -1px;
}
.class-name:first-child::before {
    content: "";
    position: absolute;
    width: 0.02rem;
	height: 0.36rem;
	background-color: transparent;
    top:50%;
    margin-top: -0.18rem;
    left: -1px;
}
.class-name::after {
    content: "";
    position: absolute;
    width: 0.02rem;
	height: 0.36rem;
	background-color: transparent;
    top:50%;
    margin-top: -0.18rem;
    left: -0.01rem;
}
.class-name.active {
    background-color: #377df7;
}
.class-name.active::before,.class-name:last-child,.class-name.active+::before {
    width: 0;
}
.left-list {
    display: flex;
    margin-top: 0.66rem;
    flex-wrap: wrap;
}
.left-item {
    width: 4.71rem;
    margin-right: 0.3rem;
    margin-bottom: 0.42rem;
}
.left-item:nth-child(2n) {
    margin-right: 0;
}
.left-pic {
    width: 100%;
    height: 2.71rem;
    object-fit: cover;
}
.left-des {
    background-color: #f9f9f9;
    padding: 0.14rem 0.14rem 0.16rem 0.18rem;
    cursor: pointer;
}
.left-text {
    max-height: .60rem;
    line-height: .30rem;
    height: .60rem;
    font-size: .18rem;
    margin-bottom: 0.1rem;
    color: #333;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.left-time {
    text-align: right;
    font-size: .18rem;
    color: #000000;
	opacity: 0.33;
}
.info-right {
    width: 4.26rem;
    padding-bottom: 0.25rem;
}
.right-intro {
    padding: 0.4rem 0.4rem 0 0.4rem;
    height: 4.77rem;
    background: url("../images/index/bg2.jpg") ;
    background-size: 100%;
    border-radius:.15rem;
    overflow:hidden;
}
.intro-title {
    font-size: 0.35rem;
    color: #516491;
    line-height: 0.45rem;
}
.intro-sub {
    margin-top: 0.26rem;
    margin-bottom: 0.7rem;
    font-size: 0.22rem;
    color: #888b91;
    font-family:'FZLTZHUNHJW'
}
.intro-btn {
    display: block;
    margin: 0 auto;
    width: 2.51rem;
    height: 0.77rem;
    line-height:0.77rem;
    text-align:center;
    background-color: #ffffff;
    border-radius: 0.08rem;
    color: #87a1e1;
    font-size: 0.35rem;
    cursor: pointer;
}
.like-box {
    margin-top: .50rem;
}
.like-name {
    position: relative;
    padding-left: 0.16rem;
    margin-bottom: 0.26rem;
    color: #666;
    font-size: 0.3rem;
}
.like-name::before {
    position: absolute;
    content: "";
    width: 0.05rem;
    height: 0.29rem;
    background-color: #f2733b;
    top: 50%;
    left: 0;
    margin-top: -0.14rem;
}
.like-item {
    position: relative;
    padding: 0.14rem 0.14rem;
    background-color: #f9f9f9;
    margin-bottom: 0.05rem;
    cursor: pointer;
}
.like-text {
    font-size: 0.18rem;
    line-height: .30rem;
    color: #000000;
}
.like-time {
    font-size: 0.18rem;
    color: #000000;
	opacity: 0.33;
    text-align:right;
}
.pages {
    margin: 1.1rem auto 0;
    padding-bottom: 0.08rem;
    display: flex;
    justify-content: center;
}
    .pages .active {
        background-color:#efefef;
    }
.page-num,.disabled,.current,.pages span {
    width: 0.6rem;
    height: 0.6rem;
    border: 1px solid #EFEFEF;
    border-radius: 0.02rem;
    font-size: 0.2rem;
    line-height: 0.6rem;
    text-align: center;
    font-family: "Microsoft YaHei","Arial";
    color: #626262;
    margin:0 0.1rem;
}
.page-num:hover {
    cursor: pointer;
}
.page-omit:hover {
    cursor: default;
}
.page-num.active {
    background: #f8f8f8;
}
.info-item {
    display: none;
    -webkit-animation:fadeIn 1s .2s ease both;
    -moz-animation:fadeIn 1s .2s ease both;
}
.info-item.active {
    display: block;
}

.info-nav {
    height: 1rem;
    line-height: 1rem;
    font-size: .18rem;
    color: #377df7;
    font-family: "FZLTZHUNHJW";
}
.info-title, .info-content h1 {
    font-size: .36rem;
    color: #383838;
    line-height: .6rem;
}
.info-type, .info {
    display: flex;
    width: 100%;
    color: #8f8f8f;
    font-size: .18rem;
    font-family: "FZLTZHUNHJW";
}
    .info-type div {
        margin-right: .8rem;
    }
.info-tips, .desc {
    width: 100%;
    padding: .36rem;
    color: #8f8f8f;
    font-size: .18rem;
    background-color: #f8faff;
    margin: .3rem 0 .3rem;
}
.info-content, .body {
    font-size: .22rem;
    color: #383838;
    line-height: .44rem;
    font-family: "FZLTZHUNHJW";
}
.body p span {
    font-size: .22rem !important;
}
    .info-content p {
        text-indent: 2em;
        margin-top: .2rem;
    }
    .info-content img {
        width: 100%;
        height: auto;
    }
    .info-content div {
        margin: 0.2rem 0;
    }
.pre-info, .next-info {
    color: #7f7f7f;
    line-height: .4rem;
    font-size: .18rem;
    font-family: "FZLTZHUNHJW";
    cursor: pointer;
    display: flex;
}
.pre-info {
    margin-top: .6rem;
}