[v-cloak] {
    display: none;
}
.product {
    padding: 0.1rem 0 0.3rem;
    border-top: 1px solid #c8c8c8;
    margin-top: 0.2rem;
}

.product::after {
    display: block;
    content: " ";
    clear: both
}
.getdata{
    background-color: #0878cc;
    padding: 0 0.3rem;
    border-radius: 14px;
    font-size: 0.35rem;
    color: #fff;
    display: block;
    text-align: center;
    margin-bottom: 0.2rem
}
.product header {
    display: inline-block;
    width: 100%;
    padding: 0.15rem 0
}

.product header i {
    width: 0.3rem;
    height: 0.3rem;
    font-size: 0.5rem
}

.product header span {
    font-size: 0.32rem
}

.product header img {
    width: 0.32rem;
    height: 0.32rem;
    margin: 0 0.1rem 0.1rem 0;
    vertical-align: middle
}

.product .prolist {
    background-color: #f3f3f3;
    padding-bottom: 0.15rem
}

.product .prolist::after {
    display: block;
    content: " ";
    clear: both
}

.product .prolist .left {
    background-color: #f3f3f3;
    width: 25%;
    float: left
}
.product .prolist .left.active{
    position: fixed;
    width: 25%;
    top: 0;
    /* max-width: 1.875rem; */
}
.product .prolist .left ul {
    padding: 0;
    margin: 0
}

.product .prolist .left li {
    padding: 0.28rem 0;
    text-align: center;
    position: relative
}

.product .prolist .left li.active {
    background: #ffffff
}

.product .prolist .left li.active a {
    color: #000000
}

.product .prolist .left li.active span {
    height: 0.56rem;
    width: 0.05rem;
    display: block;
    background: linear-gradient(white, #ff0505);
    position: absolute;
    right: 1.7rem
}

.product .prolist .left li a {
    font-size: 0.3rem;
    color: #777777;
    padding: 0.1rem 0;
    width: 100%;
    display: block
}

.product .prolist .right {
    background-color: #fff;
    width: 75%;
    float: right
}

.product .prolist .right img {
    width: 2.41rem;
    margin: 0 auto;
    display: block;
    margin-bottom: -0.20rem
}

.product .prolist .right p {
    font-size: 0.3rem;
    text-align: center;
    color: #333;
    margin-bottom: 0.40rem
}

.product .page {
    text-align: right;
    margin-right: 0.25rem
}

.product .page li {
    display: inline-block;
    margin: 0 0.10rem;
    font-size: 0.20rem;
}

.product .page li.thisclass {
    color: red;
}

.product .page li a {
    color: #000;
}

.product .page .crrentPage a {
    border: 1px solid #f1f1f1;
    padding: 0.05rem 0.15rem;
    border-radius: 10%
}

.product .page .crrentPage a span {
    color: red
}

.banner img {
    /* width: 7.50rem; */
    /*height: 3.74rem*/
    display: block;
    margin: 0 auto;
    max-width: 100%;
}

.product-a {
    padding: 0 0.3rem 0.15rem;
    margin-top: 0.15rem
}

.product-a::after {
    display: block;
    content: " ";
    clear: both
}

.product-a h2 {
    font-size: 0.4rem;
    margin-top: 0;
    margin-bottom: 0;
    color:#333
}

.product-a h2 img {
    width: 0.37rem;
    height: 0.43rem;
    vertical-align: middle;
    margin-right: 0.1rem
}
.product-a h2 a {
    float: right;
    background-color: #0878cc;
    padding: 0.01rem 0.3rem;
    border-radius: 14px;
    font-size: 0.35rem;
    color: #fff
}
.product-a .a1 {
    margin-bottom: 0.5rem;
    height: 2.55rem;
    position: relative
}

.product-a .a1::after {
    display: block;
    content: " ";
    clear: both
}

.product-a .a1 .a-pro1 {
    width: 5.10rem;
    height: 2.36rem;
    background: #8ac4e5;
    border-radius: 0.15rem;
    margin: 0 0.9rem;
    position: absolute;
    top: 0;
    z-index: -10;
    opacity: 0.5
}

.product-a .a1 .a-pro2 {
    width: 5.70rem;
    height: 2.36rem;
    background: #8ac4e5;
    border-radius: 0.15rem;
    margin: 0 0.6rem;
    position: absolute;
    z-index: 10;
    top: 0.15rem;
    opacity: 0.6
}

.product-a .a1 .a-pro {
    width: 6.19rem;
    height: 2.26rem;
    background-color: #1267cc;
    padding: 0 0.3rem;
    margin: 0 0.35rem;
    background: linear-gradient(to top right, #1290f3, #1068d0);
    border-radius: 0.15rem;
    position: absolute;
    z-index: 100;
    top: 0.3rem
}

.product-a .a1 .a-pro .a-pro-tex .a-pro-name {
    background-color: #1290f3;
    padding: 0.02rem 0;
    box-shadow: inset 0 0.05rem 0.5rem 0 #1984ef;
    border-radius: 0.1rem;
    width: 1.4rem;
    text-align: center;
    font-size: 0.28rem;
    margin-bottom: -0.15rem
}

.product-a .a1 .a-pro .a-pro-tex p {
    color: #fff;
    font-size: 0.20rem
}

.product-a .a1 .a-pro .a-pro-tex p:last-child {
    margin-left: 0.2rem
}

.product-a .a1 .a-pro .a-app {
    font-size: 0.20rem;
    color: #fff;
    margin-top: -0.1rem
}

.product-a .a1 .a-pro .a-app strong {
    color: #fff;
    font-size: 0.22rem
}

.product-a p {
    font-size: 0.20rem;
    color: #646464;
    line-height: 0.38rem
}

.product-a p strong {
    color: #308bf1;
    font-size: 0.22rem
}
.xq p.t {
    font-size: 0.24rem;
    padding: 0 0.3rem
}
.xq div {
    font-size: 15px;
    color: #fff;
    line-height: 24px;
    text-align: center;
    padding: 0.3rem;
    background: url(../images/product_art_bg.jpg) no-repeat center
}
.xq div p{
    padding: 0.1rem 0.35rem;
    margin: 0
}
.product-art-h2{
    color: #0878cc !important;
    font-size: 16px !important;
    text-align: center !important;
    font-weight: bold !important
}
.product-art-content,.product-art-content p{
    line-height: 24px;
    font-size: 15px;
    color: #555
}
.product-art-content p{
    padding-bottom: 0.22rem; 
    border-bottom: 1px dashed #ccc;
}
.product-art-content p:last-of-type{
    border:none
}
.product-art-content strong {
    color: #0878cc;
    margin-top: 0.2rem;
    display: inline-block
}
.product-b {
    padding: 0 0.3rem
}
.product-b::after {
    display: block;
    content: " ";
    clear: both
}

.product-b .b-block {
    position: relative;
    margin-bottom: 0.5rem
}

.product-b .b-block .b-til {
    font-size: 0.20rem;
    color: #fff;
    padding: 0.04rem 0.25rem 0.04rem 0;
    position: absolute;
    top: -0.2rem
}

.product-b .b-block .b-til img {
    vertical-align: middle;
    margin: 0 0.1rem
}

.product-b .b-block .b-til .ic1 {
    width: 0.14rem;
    height: 0.21rem
}

.product-b .b-block .b-til .ic2 {
    width: 0.22rem;
    height: 0.20rem
}

.product-b .b-block .b-til .ic3 {
    width: 0.22rem;
    height: 0.22rem
}

.product-b .b-block .b-til .ic4 {
    width: 0.27rem;
    height: 0.23rem
}

.product-b .b-block .b-block-cont {
    font-size: 15px;
    color: #484848;
    background-color: #f9f9f9;
    padding: 0.4rem 0.3rem;
    box-shadow: 0 0.02rem 0.05rem 0.05em #ccc;
    border-radius: 0.08rem;
    text-align: justify;
    line-height: 24px
}

.product-b .b-block:nth-of-type(odd) .b-til {
    background-color: #1267cb;
    border-bottom-right-radius: 0.2rem;
    border-top-right-radius: 0.2rem;
    left: 0
}

.product-b .b-block:nth-of-type(even) .b-til {
    background-color: #ff3030;
    border-bottom-left-radius: 0.2rem;
    border-top-left-radius: 0.2rem;
    float: right;
    right: 0
}

.product-c {
    padding: 0 0.3rem;
    border-bottom: 0.15rem solid #f1f1f1;
    margin-bottom: 0.20rem;
    /*margin-top: -0.25rem*/
}

.product-c::after {
    display: block;
    content: " ";
    clear: both
}

.product-c h2 {
    font-size: 0.3rem;
    color: #151515;
    font-weight: normal;
    padding: 0 0 0 0.1rem;
    margin-bottom: 0.1rem
}

.product-c h2 img {
    width: 0.36rem;
    height: 0.36rem;
    vertical-align: middle;
    margin-right: 0.1rem
}

.product-c .hr-line-div {
    margin: 0 auto;
    height: 1px;
    background: radial-gradient(#ff2022 1rem, white 3rem);
    margin-bottom: 0.1rem
}

.product-c .c-cont {
    font-size: 0.20rem;
    color: #646464;
    padding: 0.15rem 0 0;
    margin-top: -0.1rem;
    text-align: justify;
    line-height: 0.38rem
}

.product-d {
    padding: 0 0.3rem;
    margin-bottom: 0.20rem
}

.product-d::after {
    display: block;
    content: " ";
    clear: both
}

.product-d h2 {
    font-size: 0.3rem;
    color: #151515;
    font-weight: normal;
    padding: 0 0 0 0.1rem;
    margin-bottom: 0.1rem
}

.product-d h2 img {
    width: 0.33rem;
    height: 0.27rem;
    vertical-align: middle;
    margin-right: 0.1rem
}

.product-d table td {
    font-size: 0.20rem
}

.product-e {
    padding: 0 0.3rem 0.5rem
}

.product-e::after {
    display: block;
    content: " ";
    clear: both
}

.product-e h2 {
    font-size: 0.4rem;
    color: #333;
    font-weight: normal;
    padding: 0 0 0 0.1rem;
    margin-bottom: 0.2rem
}

.product-e h2 img {
    width: 0.25rem;
    height: 0.29rem;
    vertical-align: middle;
    margin-right: 0.1rem
}

.product-e .e-block img {
    width: 1.66rem;
    height: 1.58rem;
    margin: 0 auto;
    display: block
}
@media(min-width: 750px){
    .product .prolist .left.active{
        max-width: 1.875rem;
    }
}