body {
    height: 20rem;
}

#p1{
    height: calc(100vh - .92rem);
    overflow: hidden;
    position: relative;
}

.swiper-container {
    --swiper-navigation-color: #ffffff;
    --swiper-navigation-size: 50px;
}

.swiper-button-prev {
    margin-left: .2rem;
}

.swiper-button-next {
    margin-right: .2rem;
}

#p1_box, #p1_box2 {
    opacity: 1;
    position: relative;
}

#p1_bg, #p1_bg2_29 {
    left: 0;
    object-fit: cover;
    position: absolute;
    top: 0;
}

#p1_box2 {
    align-items: center;
    justify-content: center;
    display: flex;
    height: 100%;
    width: 100%;
}

#p1_slogan {
    margin-left: 2.25rem;    
    padding-top: 1.1rem;
    width: 7rem;
}

#p1_slogan_32 {
    margin-left: 2.25rem;    
    padding-top: 1rem;
    width: 6.5rem;
}

#p1_slogan_32_v2 {
    margin-left: 1.95rem;    
    padding-top: 1rem;
    width: 7.2rem;
}

#p1_slogan2_29 {
    margin: 0 auto;
    padding-top: 1.6rem;
    width: 4.6rem;
}

#p1_video2_29 {
    cursor: pointer;
    margin: 0 auto;
    width: 8.8rem;
}

#p2 {
    background: url('https://static.rbanma.com/yt/aps/images/226_p2_bg.jpg') no-repeat center center;
    background-size: cover;
    height: 11.7rem;
    width: 100%;
}

#p2_slogan {
    margin: 0 auto;
    padding: 1.5rem 0 .5rem 0;
    position: relative;
    width: 11.31rem;
}

#p2_dustfree {
    height: .5rem;
    top: 1.54rem;
    object-fit: cover; 
    position: absolute;
    left: 6.18rem;
    width: 0;
    background: url('https://static.rbanma.com/yt/aps/images/p2_dustfree.png') no-repeat left center;
    background-size: cover;
}

#p2_list {
    margin: 0 auto;
    position: relative;
    width: 15.46rem;
}

#p2_item_list {
    display: flex;
    justify-content: space-between;
}

.p2_item {
    position: relative;
    width: 4.66rem;
}

.p2_cover {
    position: absolute;
    top: 0;
    left: 0;
}

.p2_index {
    color: #6c6e6f;
    font-size: .5rem;
    font-weight: 900;
    text-align: center;
    padding-top: .3rem;
}

.p2_index.cur {
    color: #13d0c9;
}

.p2_note {
    color: #6c6e6f;
    font-size: .3rem;
    padding-top: .3rem;
    margin: 0 auto;
    text-align: center;
    width: 4.2rem;
}

.p2_note.cur {
    color: #010101;
}

.p2_note span {
    font-size: .2rem;
}

#p2_item1_icon1 {
    top: .8rem;
    left: .6rem;
    width: 1.18rem;
    position: absolute;
}

#p2_item1_icon2 {
    top: 2rem;
    left: 2.62rem;
    width: .88rem;
    position: absolute;
}

#p2_item1_icon3 {
    top: 3.9rem;
    left: 2.95rem;
    width: 1.12rem;
    position: absolute;
}

#p2_item2_icon1 {
    top: 1rem;
    left: 2.9rem;
    width: 1.03rem;
    position: absolute;
}

#p2_item3_icon1 {
    top: 3.7rem;
    left: 3rem;
    width: .96rem;
    position: absolute;
}

#p2_line {
    top: 6.5rem;
    position: absolute;
    width: 100%;
}

#p2_gray {
    height: .03rem;
    margin-top: .01rem;
    background: #d9d9d9;
    width: 100%;
}

#p2_blue {    
    background: #13d0c9;
    height: .05rem;
    position: absolute;
    top: 0;
    width: 4.66rem;
    transition: all .2s linear;
}

.p2_blue0 {
    left: 0;
}

.p2_blue1 {
    left: 5.4rem;
}

.p2_blue2 {
    left: 10.8rem;
}

#p2_note_explain {
    font-size: .2rem;
    margin: 0 auto;
    padding-top: .4rem;
    text-align: center;
}

#p3 {
    background: url('https://static.rbanma.com/yt/aps/images/226_p3_bg.jpg') no-repeat center center;
    background-size: cover;
    height: 12.9rem;
    width: 100%;
}

#p3_slogan {
    margin: 0 auto;
    padding-top: 2.1rem;
    overflow: hidden;
    position: relative;
    width: 7.58rem;
}

/* #p3_dustfree {
    height: .5rem;
    top: 1.55rem;
    object-fit: cover; 
    position: absolute;
    left: 2.12rem;
    width: 0;
    background: url('https://static.rbanma.com/yt/aps/images/p3_dustfree.png') no-repeat left center;
    background-size: cover;
} */

#p3_dustfree {
    height: .53rem;
    top: 2.11rem;
    position: absolute;
    left: 1.89rem;
    width: 3.51rem;
    overflow: hidden;
}

#p3_video {
    cursor: pointer;
    margin: 0 auto;
    margin-top: .9rem;
    width: 9.76rem;
}

#video_box {
    border-radius: .4rem;
    margin: .9rem 0 0 4.72rem;
    height: 5.53rem;
    width: 9.76rem;
}

#p3_note {
    margin: 0 auto;
    padding-top: .6rem;
    width: 12.2rem;
}

#p3_explain {
    margin: 0 auto;
    padding-top: .6rem;
    width: 5.06rem;
}

#p4 {
    overflow: hidden;
    position: relative;
    width: 100%;
}

#p4_bg {
    position: absolute;
}

#p4_slogan {
    margin: 0 auto;
    padding-top: 1.95rem;
    position: relative;
    width: 10.69rem;
}

#p4_note {
    margin: 0 auto;
    padding-top: .7rem;
    position: relative;
    width: 10.44rem;
}

#p4_box {
    display: flex;
    padding-top: .7rem;
    position: relative;
    width: 100%;
}

#p4_line {
    top: 1.84rem;
    position: absolute;
    width: 100%;
}

#p4_line1 {
    background-color: #efefef;
    height: 1.79rem;
    width: 100%;
}

#p4_line2 {
    background-color: #e6e6e6;
    height: 1.79rem;
    width: 100%;
}

#p4_line3 {
    background-color: #ebebeb;
    height: 1.79rem;
    width: 100%;
}

#p4_colorline {
    height: 1.8rem;
    width: 100%;
    position: absolute;
    transition: all .2s linear;
}

#p4_structure {
    display: flex;
    position: relative;
}

#p4_type {
    margin-top: 1.17rem;
    width: 7.11rem;
}

#p4_type li {
    align-items: center;
    justify-content: center;
    display: flex;
    flex-direction: column;
    color: #ffffff;
    font-size: .35rem;
    height: 1.78rem;
    padding-left: 1.65rem;
    text-align: center;
}

#p4_type li div {
    display: flex;
}

#p4_type li .symbol {
    font-size: .25rem;
    margin-top: .02rem;
}

#p4_type li .o3 {
    font-size: .2rem;
    margin-top: 0.15rem;
}

#p4_chart_box {
    width: 10.44rem;
    position: relative;
}

.p4_chart {
    width: 10.44rem;
}

.p4_item {
    display: flex;
}

.p4_item li {
    display: flex;
    justify-content: center;
    width: 3.46rem;
}

.p4_item_box {
    width: 2.46rem;
}

.p4_item1 {
    margin: 0 auto;
    width: 2.26rem;
}

.p4_item2 {
    margin: 0 auto;
    width: 2.02rem;
}

.p4_item3 {
    margin: 0 auto;
    width: 1.12rem;
}

#p4_bar {
    height: .03rem;
    background-color: #e6e6e6;
    margin: .28rem 0 .53rem 0;
    width: 100%;
}

#p4_colorbar {
    height: .05rem;
    background-color: #31d2bb;
    width: 2.45rem;
    top: .56rem;
    position: absolute;
    transition: all .2s linear;
}

.p4_colorline0 {
    top: 0;
}

.p4_colorline1 {
    top: 1.79rem;
}

.p4_colorline2 {
    top: 3.58rem;
}

.p4_colorbar0 {
    left: .5rem;
}

.p4_colorbar1 {
    left: 3.96rem;
}

.p4_colorbar2 {
    left: 7.42rem;
}

#p4_bottom {
    background: url('../images/625_p4_bottom.jpg') no-repeat center center;
    background-size: cover;
    height: 2.96rem;
    position: relative;
    width: 100%;
}

#p4_bottom_note {
    margin: 0 auto;
    padding-top: .7rem;
    position: relative;
    width: 15.29rem;
}

#p5 {
    background: url('https://static.rbanma.com/yt/aps/images/47_p5_bg.jpg') no-repeat center center;
    background-size: cover;
    height: 11.3rem;
    width: 100%;
    position: relative;
}

#p5_slogan {
    padding: 1.81rem 0 0 2rem;
    width: 7.1rem;
    box-sizing: content-box;
}

#p5_note {
    padding: .7rem 0 0 2rem;
    width: 7.38rem;
}

#p5_circle {
    position: absolute;
    width: 7.67rem;
    top: 4.06rem;
    left: 10.7rem;
}

/* #p5_logo {
    width: 1.24rem;
    position: absolute;
    top: 5.67rem;
    left: 3.87rem;
} */

/* #p6_p7 {
    background: url('https://static.rbanma.com/yt/aps/images/29_p6_p7_bg.jpg') no-repeat center center;
    background-size: cover;
    height: 21.86rem;
    width: 100%;
    position: relative;
} */

#p6 {
    background: url('https://static.rbanma.com/yt/aps/images/226_p6_p7_bg.jpg') no-repeat center center;
    background-size: cover;
    height: 17.77rem;
    width: 100%;
    position: relative;
    z-index: 1;
}

#p6_gif_box_29 {
    position: absolute;
    top: 0;
}

#p6_slogan {
    margin: 0 auto;
    position: relative;
    padding-top: 6.06rem;
    width: 7.48rem;
}

#p6_slogan_29 {
    /* margin: 0 auto; */
    position: absolute;
    /* padding-top: 7rem; */
    top: 2.8rem;
    left: 8.6rem;
    width: 5.97rem;
}

#p6_slogan_311 {
    /* margin: 0 auto; */
    position: absolute;
    /* padding-top: 7rem; */
    top: 2.5rem;
    left: 8.6rem;
    width: 5.84rem;
}

#p6_dustfree {
    height: .5rem;
    top: 6.95rem;
    object-fit: cover; 
    position: absolute;
    left: 1.86rem;
    width: 0;
    background: url('https://static.rbanma.com/yt/aps/images/p6_dustfree.png') no-repeat left center;
    background-size: cover;
}

#p6_list {
    justify-content: space-between;
    display: flex;
    margin: 0 auto;
    padding-top: 6rem;
    width: 15.9rem;
}

#p6_list li {
    width: 5.11rem;
}

/* #p7 {
    background: url('https://static.rbanma.com/yt/aps/images/29_p7_bg.png') no-repeat center center;
    background-size: cover;
    height: 9.03rem;
    width: 100%;
    position: relative;
    margin-top: -3.5rem;
} */

#p7_bg_29 {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1;
}

#p7_logo {
    margin: 0 auto;
    padding-top: 2.4rem;
    width: 5.18rem;
}

#p7_click {
    pointer-events: auto;
    display: block;
    cursor: pointer;
    width: 7.82rem;
    height: 7.74rem;
    position: absolute;
    top: .33rem;
    left: 5.69rem;
}

#p7_icon_box_29 {
    padding-top: 1.6rem;
    margin: 0 auto;
    width: 11.45rem;
    height: 3.35rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#p7_slogan_29 {
    width: 5.48rem;
}

#p7_note_29 {
    margin-top: .25rem;
    width: 2.13rem;
}

#p7_icon_29 {
    margin-right: .41rem;
    cursor: pointer;
    width: 3.2rem;
}

#p8 {
    background: url('https://static.rbanma.com/yt/aps/images/417_p8_bg.jpg') no-repeat center center;
    background-size: cover;
    height: 17.68rem;
    width: 100%;
    position: relative;
}

#p8_slogan {
    margin: 0 auto;
    position: relative;
    padding-top: 1.8rem;
    width: 8.16rem;
}

#p8_dustfree {
    height: .5rem;
    top: 4.11rem;
    object-fit: cover; 
    position: absolute;
    left: 2.46rem;
    width: 0;
    background: url('https://static.rbanma.com/yt/aps/images/p8_dustfree.png') no-repeat left center;
    background-size: cover;
}

#p8_note {
    margin: 0 auto;
    padding-top: .6rem;
    width: 8.38rem;
}

#p8_list {
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    padding-top: .65rem;
    width: 15.9rem;
}

#p8_list li {
    width: 5.13rem;
}

.p8_item {
    color: #000000;
    font-size: .4rem;
    font-weight: bold;
    text-align: center;
    padding-top: .35rem;
}

.p8_button {
    pointer-events: auto;
    margin: 0 auto;
    margin-top: .2rem;
    width: 2.28rem;
    cursor: pointer;
}

#p8_message {
    margin: 0 auto;
    width: 15.91rem;
    margin-top: 1rem;
}

#p8_message img {
    width: 15.53rem;
}

/* animation */
.obj_enlarge {
    animation: obj_enlarge .2s linear both;
}

@keyframes obj_enlarge {
    0% {transform: scale(1, 1);}
    100% {transform: scale(1.1, 1.1);}
}

.obj_reduce {
    animation: obj_reduce .2s linear both;
}

@keyframes obj_reduce {
    0% {transform: scale(1.1, 1.1);}
    100% {transform: scale(1, 1);}
}

.video_enlarge {
    animation: video_enlarge .2s linear both;
}

@keyframes video_enlarge {
    0% {transform: scale(1, 1);}
    100% {transform: scale(1.05, 1.05);}
}

.video_reduce {
    animation: video_reduce .2s linear both;
}

@keyframes video_reduce {
    0% {transform: scale(1.05, 1.05);}
    100% {transform: scale(1, 1);}
}



.logo {
   animation: logo 5s infinite linear both; 
}

@keyframes logo {
    0% {transform: translateY(-8px);}
    50% {transform: translateY(8px);}
    100% {transform: translateY(-8px);}
}