*{ margin: 0; padding: 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
html{font-size: calc( 100vw / 750 * 100);}
body{ position: relative; width: 100vw; height: auto;font-size: 16px; color: #ffffff;}
img{display: block;}
a{ text-decoration: none;}
.pr{ position: relative;}

.page{ position: relative; width: 100%; min-height: 100vh; z-index: 1;}
.page img{ display: block;}
.part{ position: relative; z-index: 3; width: 6.78rem; background-color: #ffffff; padding: .2rem .15rem; margin: .22rem auto 0;}
.part_flex{position: absolute; top:50%; left: 0; z-index: 3; transform: translateY(-50%);/*width: 100vw; height: 100vh; justify-content: center; flex-wrap: wrap;*/}
.title{ margin-bottom: .2rem;}
.title img{ width: 2.26rem; margin: 0 auto; }

.page1{ background: url(1_3.png) no-repeat top center #f5f4f3; background-size: 100%; overflow: hidden;}
.page1 .part1{ width: 6.71rem; height: 2.55rem; margin: 5.71rem auto 0;}
.page1 .part1 .swiper-slide{border-radius: .1rem; overflow: hidden;}
.page1 .part1 .swiper-slide a{ display: block; width: 100%; height: 100%;}
.page1 .swiper-pagination-bullet{ background-color: #d1d1d1; opacity: 1;}
.page1 .swiper-pagination-bullet-active{ background-color: #d7000f;}
.page1 .part2 .list{ justify-content: space-between;}
.page1 .part2 .list a{ display: block; width: 1.5rem;}
.page1 .part2 .list a img{ width: 100%;}
.page1 .part3 .swiper-container{ width: 6.16rem; margin: 0 auto; height: 1.77rem; border-radius: .2rem;}
.page1 .part4 .flex{ width: 6.16rem; margin: 0 auto; justify-content: space-between;}
.page1 .part4 .flex img{ width: 2.96rem;}
.page1 .part5{ position: relative; z-index: 3; width: 4.39rem; margin: .44rem auto .36rem;}
.part_bottom{ position: absolute; bottom: 0; left: 0; z-index: 0; width: 100%;}


.return{ width: 1.25rem; position: absolute; top:.37rem; left: .46rem; z-index: 2;}
.page2{ height: auto; background: url(bg1.png) no-repeat top center #edecec; background-size: 100%; overflow: hidden; padding-top: 16.29rem;}
.page2 .part2{ margin-bottom: .5rem;}
.page2 .part4{ width: 6.16rem; margin: 0 auto;}

.page6 .part1{ width: 100%;}
.page6 .part2{ width: 100%; margin-bottom: .3rem;}

/* .swiper-container{ width: 6.32rem; height: 3.55rem; box-shadow: 0px 5px 20px 5px rgba(0,0,0,0.08);} */
.swiper-slide{ width: 100%; height: 100%;}
.swiper-slide img,.swiper-slide video{ width: 100%; height: 100%; object-fit: cover;}
.swiper-slide .play{ position: absolute; top:0; left: 0; z-index: 1; width: 100%; height: 100%; background: url(play.png) no-repeat center center; background-size: 1.11rem;}
.swiper-button-prev{ left: 5px; width: .21rem; height: .45rem; top:57%; background: url(2_7_1.png) no-repeat center center; background-size: contain;}
.swiper-button-next{ right:5px; width: .21rem; height: .45rem; top:57%; background: url(2_7_2.png) no-repeat center center; background-size: contain;}
.swiper-button-prev::after,.swiper-button-next::after{ content: '';}
.swiper-pagination{ width: 100%;}
.swiper-pagination-bullet-active{ background-color: #00525a;}
.swiper-pagination-bullet{ margin: 0 .05rem;}

.part_list{ width: 6.3rem; margin: 0 auto;}
.part_list .item{ justify-content: space-between; align-items: center; background-color: #ffffff; box-shadow: 0px 5px 20px 5px rgba(0,0,0,0.08); margin-bottom: .2rem; padding: 0.07rem; text-decoration: none;}
.part_list .item_img{ width: 1.58rem; height: 1.58rem; margin-right: .2rem;}
.part_list .item_img img{ width: 100%; height: 100%; object-fit: cover;}
.part_list .item_box{ color: #4c4c4c; font-size: .26rem;}
.part_list .item_box p{ font-weight: bold; margin-bottom: .1rem;}

.page3{padding-top:4rem; background: url(2_2.png) no-repeat top center #f5f4f3; background-size: 100%; overflow: hidden;}
.page3 .part{ padding: .3rem .1rem;}
.page3 .part1{ margin-bottom: .5rem;}
.page3 .part3{ border-radius: .2rem;}
.page3 .container1 { width: 5.83rem;}

.page4{ padding-top: 14.66rem; background: url(3_1.png) no-repeat top center #f5f4f3; background-size: 100%; overflow: hidden;}
.page4 .part1{}
.page4 .part2{ margin: .2rem auto;}
.page4 .box{ width: 6.14rem; margin: 0 auto .5rem; background-color: #ffffff; border-radius: .13rem;}
.page4 .box_main{ border:1px solid #489336; border-radius: .13rem;}
.page4 .box1{ color: #d6000f; font-size: .28rem; padding: .4rem; font-weight: bold;}
.page4 .box1 img{ width: 100%; margin-top: .3rem;}
.page4 .part4{ position: relative; margin: .8rem auto 0;}
.page4 .part4 img:first-child{ margin-top: .3rem;}
.page4 .part4 .code{ position: absolute; top:41.4%; left: 50%; z-index: 1; width: 3rem; transform: translate(-50%);}
.page4 .part5 .box_main{ padding: .5rem .3rem .1rem; justify-content: space-between; flex-wrap: wrap;}
.page4 .part5 .item{ display: block; width: 2.53rem; margin-bottom: .4rem;}
.page4 .part5 .item .img{ position: relative; width: 100%; height: 3.95rem; overflow: hidden; background-color: #000000;}
.page4 .part5 .item .play{ position: absolute; top:0; left: 0; z-index:5; width: 100%; height: 100%; background: url(play.png) no-repeat center center; background-size: 1.11rem;}
.page4 .part5 .item video{ position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover;}
.page4 .part5 .item .text{  width: 100%; height: .8rem; background-color: #fdebec; color: #d6000f; align-items: center; justify-content: center; font-weight: bold; font-size: .24rem; padding: 0 .1rem;}
.page4 .part5 .item p{ text-align: center;}
.page4 .part6{ width: 100%; margin-bottom: .2rem; margin-top: .4rem;}

.page5{padding-top:4rem; background: url(4_1.png) no-repeat top center #f5f4f3; background-size: 100%; overflow: hidden;}
.page5 .part3{ border-radius: .2rem; margin-bottom: .5rem;}
.page5 .part3_1{ margin-bottom: .5rem;}
.page5 .part3_1 input{ position: absolute; top:.02rem; left: 1rem; outline: none; background-color: inherit; width: 4.3rem; padding-left: .5rem; height: .65rem; line-height: .65rem; border: none; border-radius: .2rem;}
.page5 .part3 .search{ width: 1.2rem; height: .7rem; position: absolute; right: 0; top:0;}

.page4.page6{ height: auto; background: url(bg5.jpg) no-repeat top center #d6000f; background-size: 100%; overflow: hidden; padding-top: 17rem;}
.listmx{ width: 6.1rem; margin: 0 auto;}
.litotal{ border-radius: 4vw;list-style-type: none;background: #fff;height: 47.6vw;margin-bottom: 6.67vw; box-shadow: 0px 5px 20px 5px rgba(0,0,0,0.08);}
.topVideo{
    /* width: 85.33vw; */
    /* border: 2px solid #ffc083; */
    border-radius: 4vw;
    height: 38.27vw;
    overflow: hidden;
    object-fit: cover;
    position: relative;
    cursor: pointer;
    margin: 0 auto;
}
.topVideo video,.topVideo .topImg,.topImg .img{display: block;width: 100%;height: 100%;object-fit: cover;}
.topImg{position: absolute;left: 0;top: 0;z-index: 1;border-radius:4vw;overflow:hidden;}
.topImg .playImg{width: 20px;position: absolute;left: 50%;bottom: 50%; transform: translate(-50%,0);}
.listzhanshi{
    display: flex;
    justify-content: space-between;
    padding: 0vw 4.66vw;
    margin-top: .18rem;
}

.listzhanshi div{font-size: 3vw; color: #000;}
.lovestyle{ display: inline-block !important; width: 3.5vw;vertical-align: middle; margin-right: .1rem;}
.spanshow{
    display: inline-block;
    color: #fff;
    background: #ff8f2d;
    text-align: center;
    border-radius: 3.5vw;
    padding: 0.3vw 0.8vw;
}

#mMusic{ display: none!important;}

@keyframes rotate {
  from{
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}
.rotate {
  animation: rotate 3s infinite linear;
  -webkit-animation: rotate 3s infinite linear;
  -moz-animation: rotate 3s infinite linear;
  -o-animation: rotate 3s infinite linear;
  -ms-animation: rotate 3s infinite linear;
}

.page7{}
.page7 .part2{ width: 100%; padding: .15rem .3rem; justify-content: space-between; align-items: center; margin-top: .2rem;}
.page7 .part2_1 img{ width: 2rem;}
.page7 .part2_2 img{ width: 2.4rem;}
#video{ width: 100%;}