/* 通用样式 */
.fitness-container{
    width: 84%;
    margin: 0 auto;
}
h1{
    color: red;
}
/* 字体样式 */
@font-face {
    font-family: youshebiaotihei;
    src: url('../../fonts/youshebiaotihei.ttf')
}
/* banner */
.fitness-banner{
    padding-top: 117px;
}
/* 第一部分 */
.fitness1-center{
    padding: 100px 0;
    display: flex;
    justify-content: center;
}
.fitness1-left{
    flex: 0 0 36%;
}
.fitness1-left>img{
    width: 100%;
}
.fitness1-right{
    padding-left: 95px;
    flex: 0 0 45%;
}
.fitness1-word p{
    font-size: 24px;
    line-height: 2;
    text-align: justify;
    padding-bottom: 20px;
}
.fitness1-word-title{
    font-size: 26px;
    padding-bottom: 28px;
    display: flex;
    align-items: center;
    font-weight: bold;
}
.fitness1-word-title::before{
    content: '';
    display: block;
    width: 30px;
    height: 30px;
    background: #fff;
    border-radius: 50%;
    margin-right: 5px;
    border: 8px solid #4a8264;
}
/* 第二部分 */
.fitness2{
    background-color: #4a8264;
}
.fitness2-center{
    display: flex;
    padding: 45px 0;
    justify-content: space-between;
    align-items: center;
}
.fitness2-left-title{
    font-size: 40px;
    line-height: 1.2;
    color: #fff;
    font-weight: bold;
    letter-spacing:4px;
}
.fitness2-left-size{
    font-size: 30px;
    line-height: 1;
    color: #fff;
}
.fitness2-right{
    display: flex;
    width: 500px;
    justify-content: space-between;
    padding: 10px;
    background: #fff;
    border-radius: 60px;
    box-shadow: 2px 2px 10px #75a089;
}
.fitness2-right-title{
    font-size: 30px;
    flex: 0 0 50%;
    text-align: center;
    padding: 24px 35px;
    color: #000;
    line-height: 1;
}
.fitness2-right>.on{
    background-color: #4aa574;
    color: #fff;
    border-radius: 40px;
}

/*  综合健身器  */
.fitness-box-center{
    display: none;
}
.fitness-box-center-on{
    display: block;
}
.synthesize-container{
    width: 83%;
    margin: 0 auto;
}
/* 通用标题 */
.synthesize3{
    padding: 140px 0;
}
.synthesize3-tbox>.synthesize3-title{
    font-size: 46px;
    /* font-size: 2.39vw; */
    line-height: 1;
    text-align: center;
    font-weight: bold;
}
.synthesize3-tbox>.synthesize3-color{
    width: 100px;
    height: 8px;
    margin: 25px auto;
    background-color: #4a8264;
}
.synthesize3-tbox>p{
    font-size: 30px;
    line-height: 1.5;
    text-align: center;
}
/* JSQ-第四部分 */
.synthesize4{
    background-color: #efefef;
    padding: 50px 0;
    margin-bottom: 40px;
}
.synthesize4-container{
    display: flex;
    padding: 0 5%;
    justify-content: space-between;
}
.synthesize4-left{
    flex: 0 0 38%;
}
.synthesize4-left>img{
    width: 100%;
}
.synthesize4-right{
    flex: 0 0 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.synthesize4-box{
    display: flex;
    align-items: center;
    width: 60%;
    padding: 10px 0;
    border-bottom: 2px solid #ccc;
}
.synthesize4-title{
    font-size: 22px;
    color: #000;
    font-weight: bold;
    line-height: 1.2;
}
.synthesize4-box>p{
    font-size: 20px;
    line-height: 1.2;
}
/* JSQ-第五部分 */
.synthesize5-1{
    padding: 70px 0;
}
.synthesize5-1-container{
    display: flex;
    justify-content: space-between;
}
.synthesize51-left{
    flex:  0 0 40%;
}
.synthesize51-top{
    height: 12vw;
}
.synthesize51-top>img{
    height: 100%;
}
.synthesize51-title{
    padding-top: 30px;
    padding-bottom: 50px;
}
.synthesize51-title>p{
    font-size: 26px;
    line-height: 1.5;
    color: #75a089;
    font-weight: bold;
}
.synthesize51-center>p{
    font-size: 22px;
    line-height: 1.8;
    color: #000;
}
.synthesize51-right{
    flex: 0 0 46%;
}
.synthesize51-right>img{
    width: 100%;
}
/* JSQ-第六部分 */
.synthesize6-top{
    display: flex;
    height: 12vw;
    justify-content: center;
    align-items: center;
    margin-bottom: 105px;
}
.synthesize6-top>img{
    height: 100%;
}
.synthesize6-bom{
    display: flex;
    flex-wrap: wrap;
    justify-content: sp;
}
.synthesize6-top-phone{
    display: none;
}
.synthesize6-box{
    flex: 0 0 32%;
    height: 17vw;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 34px;
    line-height: 1;
    color: #000;
    font-weight: bold;
}
.synthesize6-box>img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* JSQ-第七部分 */
.synthesize7{
    margin:  95px 0;
    padding: 125px 0;
    background-image: url('./img/synthesize7-bg1.jpg');
    background-size: 100%;
    background-repeat: no-repeat;
}
.synthesize7-top{
    height: 12vw;
}
.synthesize7-top>img{
    height: 100%;
}
.synthesize7-title{
    padding-bottom: 60px;
}
.synthesize7-title>p{
    font-size: 28px;
    color: #4a8264;
    line-height: 1.8;
    font-weight: bold;
}
.synthesize7-size>p{
    font-size: 24px;
    line-height: 1.8;
}
.synthesize7-size{
    padding-bottom: 60px;
}
.synthesize7-size2{
    color: #ccc;
    font-size: 14px;
}
/* JSQ-第八部分 */
.synthesize8{
    padding-bottom: 100px;
}
.synthesize8-container{
    display: flex;
    justify-content: space-between;
}
.synthesize8-left{
    flex: 0 0 30%;
}
.synthesize8-left>img{
    width: 100%;
}
.synthesize8-right{
    flex: 0 0 70%;
    padding-left: 70px;
    background-image: url('./img/synthesize8-bg1.jpg');
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: left 80%;
}
.synthesize8-top{
    margin-top: 70px;
    height: 2.7vw;
    margin-bottom: 40px;
}
.synthesize8-top>img{
    height: 100%;
}
.synthesize8-title>p{
    font-size: 36px;
    line-height: 1.5;
    color: #498764;
    font-weight: bold;
}
.synthesize8-title{
    padding-bottom: 45px;
}
.synthesize8-size>p{
    font-size: 22px;
    line-height: 1;
    color: #000;
}
/* JSQ-第九部分 */
.synthesize9 .synthesize8-right{
    background-image: url('./img/synthesize9-bg1.jpg');
}
/* JSQ-第十部分 */
.synthesize10 .synthesize8-right{
    background-image: url('./img/synthesize10-bg1.jpg');
}
/* JSQ-底部 */
.synthesize-bom{
    height: 32.5vw;
    background-image: url('./img/synthesize-bom-bg1.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative;
}
.synthesize-bom-box{
    position: absolute;
    bottom: 20%;
}
.synthesize-bom-title{
    font-size: 36px;
    font-weight: bold;
    color: #fff;
    line-height: 2;
    padding-bottom: 40px;
}
.synthesize-bom-box>p{
    color: #fff;
    font-size: 22px;
    line-height: 1;
}
/* 蹦床--------------------------------------------------------------------------- */
/* BC-第三部分 */
.fitness-title{
    display: flex;
}
.fitness-title-left{
    width: 20px;
    height: 80px;
    background-color: #4a8264;
}
.fitness-title-right{
    display: flex;
    flex-direction: column;
    padding-left: 10px;
    justify-content: space-between;
}
.fitness-title-right>p:nth-of-type(1){
    font-size: 40px;
    line-height: 1.2;
    text-align: left;
    font-weight: bold;
}
.fitness-title-right>p:nth-of-type(2){
    font-size: 22px;
    line-height: 1.2;
    text-align: left;
    letter-spacing: 2px;
}
.trampoline4-box1{
    background-color: #f9f9f9;
    border-radius: 20px;
    margin: 50px 0;
    padding: 40px 0;
    display: flex;
    justify-content: center;
}

.trampoline4-box1-left{
    flex: 0 0 32%;
    display: flex;
    justify-content: center;
}
.trampoline4-box1-left>img{
    width: 100%;
}
.trampoline4-box1-right{
    flex: 0 0 50%;
    padding: 0 190px;
    display: flex;
    justify-content: center;
}
.trampoline4-title-box{
    display: flex;
    width: 100%;
    flex-direction: column;
    justify-content: center;
}
.trampoline4-title{
    font-size: 30px;
    line-height: 1;
    color: #4a8264;
    padding-bottom: 70px;
    font-weight: bold;
}
.trampoline4-p{
    display: flex;
    width: 95%;
    border-bottom: 2px solid #ccc;

}
.trampoline4-p>p{
    font-size: 22px;
    line-height: 2;
}
.trampoline4-p>p:nth-of-type(1){
    color: #000;
    font-weight: 600;
}
.trampoline4-size{
    display: flex;
    width: 95%;
    align-items: center;
    border-bottom: 2px solid #ccc;
}
.trampoline4-size>p{
    font-size: 20px;
    line-height: 2;
}
.trampoline4-size>p:nth-of-type(1){
    width: 10px;
    height: 10px;
    margin-right: 5px;
    border-radius: 50%;
    background-color: #4a8264;
}
/* 蹦床通用列表 */
.trampoline-a-box{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.trampoline-a-box-center{
    display: flex;
    height: 560px;
    flex:  0 0 49%;
    background: linear-gradient(74deg, #E9E9E9, #FAFAFA);
    box-shadow: 0px 10px 10px 0px rgba(0,0,0,0.1);
    border-radius: 30px;
    margin-bottom: 40px;
}
.trampoline-a-box-center>.trampoline4-box1-right{
    padding: 0;
    flex: 1;
    display: flex;
    justify-content: center;
    padding: 0 30px;
}
.trampoline-a-box-center>.trampoline4-box1-right .trampoline4-title{
    padding: 0;
    font-size: 28px;
    padding-bottom: 40px;
}
.trampoline-a-box-left{
    flex:  0 0 39%;
    margin:  0 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.trampoline-a-box-left>img{
    width: 100%;
}
/*  BC-第五部分  */
.trampoline5 .trampoline-a-box{
    margin-top: 40px;
}
.trampoline4-size-bom{
    padding-top: 20px;
}
/* BC-第六部分 */
.trampoline6 .trampoline-a-box{
    margin-top: 40px;
}
/* BC-第七部分 */
.trampoline7{
    width: 100%;
}
.trampoline7>img{
    width: 100%;
    margin-top: 50px;
}
/*  -----------------------------------移动端 --------------------------------------------- */
@media (max-width:1200px) {
     /* 补 */
    .trampoline4-size-bom-phone{
        display: none;
    }
    /* banner图 */
    .fitness-banner{
        padding-top: 99px;
    }
    .web-banner.page-banner-3 img{
        width: 100%;
        margin-left: 0;
    }
    /* 第一部分 */
    .fitness1-center{
        padding: 40px 0;
        width: 95%;
        margin:0 auto;
        flex-direction: column;
    }
    .fitness1-left{
        flex: 0 0 100%;
    }
    .fitness1-left>img{
        width: 100%;
    }
    .fitness1-right{
        padding-left: 0;
    }
    .fitness1-word{
        padding-top: 40px;
    }
    .fitness1-word p{
        font-size: 16px;
        line-height: 1.8;
    }
    .fitness1-word-title{
        font-size: 24px;
        line-height: 1.4;
    }
    .fitness1-word-title::before{
        height: 15px;
        width: 15px;
    }
    /* 第二部分 */
    .fitness-container{
        width: 95%;
    }
    .fitness2-left-title{
        font-size: 28px;
    }
    .fitness2-left-size{
        font-size: 18px;
    }
    .fitness2-right{
        width: 60%;
    }
    .fitness2-right-title{
        font-size: 20px;
        padding: 10px 5px;
    }
    /* 第三部分 */
    .synthesize3{
        padding: 40px 0;
    }
    .synthesize3-tbox>.synthesize3-title{
        font-size: 30px;
    }
    .synthesize3-tbox>.synthesize3-color{
        margin: 20px auto;
        width: 80px;
    }
    .synthesize3-tbox>p{
        font-size: 20px;
    }
    /* JSQ-第四部分 */
    .synthesize-container{
        width: 95%;
    }
    .synthesize4-container{
        padding: 0;
    }
    .synthesize4-left{
        flex: 0 0 38%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .synthesize4-left>img{
        width: 100%;
    }
    .synthesize4-right{
        padding-top: 40px;
        flex: 0 0 60%;
    }
    .synthesize4-box{
        width: 90%;
    }
    .synthesize4-title{
        font-size: 16px;
    }
    .synthesize4-box>p{
        font-size: 14px;
    }
     /* JSQ-第五部分 */
     .synthesize5-1{
        padding: 40px 0;
     }
     .synthesize51-top{
        width: 100%;
     }
     .synthesize51-right{
        flex: 0 0 60%;
     }
     .synthesize51-right>img{
        width: 100%;
     }
     .synthesize51-title{
        padding: 20px 0;
     }
     .synthesize51-title>p{
        font-size: 18px;
     }
     .synthesize51-center>p{
        font-size: 16px;
        margin: 20px 0;
     }
     .synthesize51-center{
        width: 250%;
     }
     /* JSQ-第六部分 */
     .synthesize6-top{
        margin-bottom: 40px;
     }
     .synthesize6-box{
        flex: 0 0 50%;
        height:200px;
        font-size: 20px;
        margin-bottom: 20px;
     }
     .synthesize6-box:nth-of-type(3){
        order: 4;
     }
     .synthesize6-box:nth-of-type(4){
        order: 3;
     }
     .synthesize6-box:nth-of-type(5){
        order: 5;
     }
     .synthesize6-box:nth-of-type(6){
        order: 6;
     }
     .synthesize6-top{
        display: none;
     }
     .synthesize6-top-phone{
        height: 12vw;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 40px;
    }
    .synthesize6-top-phone>img{
        height: 100%;
    }
    .synthesize6-top-phone-title{
        font-size: 18px;
        padding: 0 6px;
        line-height: 1.5;
        color: #75a089;
        font-weight: bold;
    }
     /* JSQ-第七部分 */
     .synthesize7{
        margin: 40px 0;
        padding: 40px 0;
        background-position: right bottom;
        background-color: #c6c4c6;
        background-image: url('./img/synthesize7-bg1-phone.jpg');
     }
     .synthesize7-title{
        padding-bottom: 0;
     }
     .synthesize7-title>p{
        font-size: 20px;
     }
     .synthesize7-size>p{
        font-size: 16px;
        color: #fff;
     }
     .synthesize7-size{
        padding-bottom: 20px;
     }
     .synthesize7-size2{
        color: #fff;
        font-size: 12px;
     }
     /* JSQ-第八部分 */
     .synthesize8{
        padding-bottom: 40px;
     }
     .synthesize8-left{
        flex: 0 0 40%;
     }
     .synthesize8-left>img{
        width: 100%;
     }
     .synthesize8-right{
        padding-left: 10px;
        flex: 0 0 60%;
        background-position: -1% 95%;
     }
     .synthesize8-top{
        padding: 10px 0;
        height: auto;
        margin: 0;
     }
     .synthesize8-top>img{
        width: 10%;
     }
     .synthesize8-title{
        padding-bottom: 20px;
     }
     .synthesize8-title>p{
        font-size: 20px;
     }
     .synthesize8-size>p{
        font-size: 16px;
        line-height: 1.2;
     }
     /* JSQ-底部 */
     .synthesize-bom{
      height: 280px;
      background-position: left top;
      background:url('./img/synthesize-bom-bg1.jpg') no-repeat,linear-gradient(to bottom, #fff 0%,#fff 41%,#4a8264 42% ,#4a8264 100%);
      background-size: 100%;
     }
     .synthesize-bom-box{
        width: 95%;
        bottom: 28%;
     }
     .synthesize-bom-title{
        font-size: 20px;
        padding-bottom: 0;
     }
     .synthesize-bom-box>p{
        font-size: 16px;
        line-height: 1.2;
     }
     /* BC-第四部分 */
     .trampoline4-box1{
        padding: 20px 0;
        margin: 20px  0;
        justify-content: space-between;
     }
     .fitness-title-left{
        width: 10px;
        height: 60px;
     }
     .fitness-title-right>p:nth-of-type(1){
        font-size: 24px;
     }
     .fitness-title-right>p:nth-of-type(2){
        font-size: 20px;
     }
     .trampoline4-box1-left{
        flex:  0 0 39%;
        padding: 10px;
        margin: 10px;
        align-items: center;
     }
     .trampoline4-box1-left>img{
        /* width: 100%; */
        width: 148px;
        height: 183px;
     }
     .trampoline4-box1-right{
        padding: 10px;
        flex:  1;
     }
     .trampoline4-title{
        font-size: 18px;
        padding-bottom: 20px;
     }
     .trampoline4-p1{
        flex-direction: column;
     }
     .trampoline4-p>p{
        font-size: 15px;
     }
     .trampoline4-size>p{
        width: 90%;
        font-size: 15px;

     }
     .trampoline-a-box-center{
        display: flex;
        padding: 15px 0;
        flex: 0 0 100%;
        height: auto;
        border-radius: 10px;
     }
     .trampoline-a-box-left{
        width: 100%;
        padding: 10px;
        margin: 10px;
     }
     .trampoline-a-box-left>img{
        width: 100%;
        height: 90%;
        object-fit:contain;
     }
     .trampoline4-title-box{
        justify-content: flex-start;
     }
     .trampoline-a-box-center>.trampoline4-box1-right{
        padding: 10px;
        align-items: center;
     }
     .trampoline-a-box-center>.trampoline4-box1-right .trampoline4-title{
        font-size: 18px;
        padding-bottom: 20px;
     }
     .trampoline-a-box .trampoline4-p:nth-of-type(3){
        flex-direction: column;
     }
     /* BC-第五部分 */
     .trampoline4-size-bom>img{
        width: 100%;
     }
     .trampoline4-p-phone{
        flex-direction: column;
     }
     /* BC-第七部分 */
     .trampoline7>img{
        margin-top: 20px;
     }
     /* 文档调整补： */
     .trampoline4-size>p:nth-of-type(1){
        align-self: flex-start;
        margin-top: 4%;
     }
}
/* 特殊的区间 125%*/
@media screen and (min-width: 1401px) and (max-width: 1700px) {
    /* JSQ */
    .synthesize7{
        padding: 70px 0 170px 0;  
    }
    .synthesize7-title{
        padding-bottom: 30px;
    }
    /* BC */
    .fitness1-word p{
        font-size: 16px;
    }
    .fitness1-word-title{
        font-size: 20px;
    }
    .trampoline4-p>p{
        font-size: 16px;
    }
    .trampoline4-size>p{
        font-size: 16px;
    }
    .trampoline4-box1-right{
        padding:  0 80px;
    }
    .trampoline4-size-bom>img{
        width: 70%;
    }
    .trampoline-a-box-center{
        height: 420px;
    }
    .trampoline4-p-phone{
        flex-direction: column;
    }

}
/* 特殊的区间 150%*/
@media screen and (min-width: 1200px) and (max-width: 1400px) {
    .fitness1-right{
        padding-left: 40px;
    }
    
    .fitness1-word p{
        font-size: 16px;
    }
    .fitness1-word-title{
        font-size: 20px;
        padding-bottom: 20px;
    }
    .fitness1-center{
        padding: 50px 0;
    }
    /* JSQ */
    .synthesize3{
        padding: 80px 0;
    }
    .synthesize4-box{
        width: 90%;
    }
    .synthesize51-title{
        padding-bottom: 30px;
    }
    .synthesize51-title>p{
        font-size: 24px;
    }
    .synthesize51-center>p{
        font-size: 16px;
    }
    .synthesize6-box{
        font-size: 24px;
    }
    .synthesize7{
        padding: 40px 0;
    }
    .synthesize8-top{
        margin-top: 20px;
        margin-bottom: 40px;
    }
    .synthesize8-title{
        padding-bottom: 30px;
    }
    .synthesize7-title>p{
        font-size: 24px;
    }
    .synthesize7-title{
        padding-bottom: 40px;
    }
    .synthesize7-size>p{
        font-size: 20px;
    }
    .synthesize8-title>p{
        font-size: 20px;
    }
    .synthesize8-size>p{
        font-size: 18px;
    }
    /* BC */
    .trampoline4-box1-right{
        padding: 0 40px;
    }
    .trampoline-a-box-center{
        height: 420px;
    }
    .trampoline-a-box-center>.trampoline4-box1-right{
        padding: 0 10px;
    }
    .trampoline-a-box-center>.trampoline4-box1-right .trampoline4-title{
        padding-bottom: 20px;
        font-size: 20px;
    }
    .trampoline4-p-phone{
        flex-direction: column;
    }
    .trampoline4-title{
        font-size: 20px;
        padding-bottom: 50px;
    }
    .trampoline4-p>p{
        font-size: 15px;
    }
    .trampoline4-size>p{
        font-size: 16px;
    }
    .trampoline4-size-bom>img{
        width: 70%;
    }
}