.banner{
    width:100%;
    height:6rem;
}
.banner .swiper-slide a{
    display: block;
    width:100%;
    height:100%;
}
.banner .swiper-slide a img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.block{
    width:100%;
    padding:1.4rem 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.block .titlebox{
    width:12.5rem;
    display: flex;
    justify-content: space-between;
}
.block .title{
    font-size:.46rem;
    font-weight: bold;
    color:#333;
}
.block .desc{
    font-size:.18rem;
    color:#999;
}
.neirong{
    width:9rem;
    font-size:.18rem;
    color:#666;
    white-space: pre-line;
}
.jsbox .contain{
    display: flex;
    margin-top:.5rem;
}
.jsitem{
     display: flex;
     justify-content: center;
     /*align-items: center;*/
    margin-right:2.4rem;
 }
.jsitem .tit{
    font-size: .2rem;
    color:#333;
}
.jsitem .font{
    font-weight: bold;
    width:2rem;
    font-size: .2rem;
    color:#333;
    white-space: pre-line;
}
.jsimg{
    height:52px;
    margin-right:.2rem;
}
.banner2{
    width:100%;
    height:8.1rem;
}
.slide{
    height:100%;
    width:100%;
    background-size:cover;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
}
.banner2 .block{
    width:0;
    height:0;
    justify-content: flex-start;
    overflow: hidden;
    position: relative;
    opacity: 0;

}
.banner2 .nblock{
    width:12.5rem;
    height:100%;
    opacity: 1;
    transition: opacity 1s;
}
.banner2 .block div{
    color:#fff;
}
.lichengbox{
    width:100%;
    position: relative;
}
.lichengbox .monthb{
    font-size:1.2rem;
    position: absolute;
    font-weight:bold;
    opacity: .2;
    left:0;
    top:0;
    line-height:1;
    transform: translateY(.5rem);
}
.licheng{
    width:5.25rem;
    font-size:.18rem;
    margin-top:1rem;
}


.ondslide{

}
.foryearwrap{
  width: 17rem;
  height: 100%;
  position: absolute;
}
.showwinbiu{
  width: 100%;
  /*width: 17rem;*/
  /*height: 1px;*/
  position: absolute;
  margin: 0 auto;
  transform:translate(-50%,-50%) rotate(-35deg);
  left:50%;
  bottom:50%;
  /*overflow: hidden;*/
}
.linediv {
    /*width: 17rem;*/
    /*width: 26rem;*/
    width: 17rem;
    height: 1px;
    background: #fff;
    padding: 0 1.5rem;
    /*padding: 0 2rem 0 1.5rem;*/
    display: flex;
    justify-content: space-around;
    position: relative;
    transition: all .3s;
}
.linediv .yuan{
    width:18px;
    height:18px;
    background: #fff;
    border-radius: 100%;
    border:4px solid #ddd;
    transform: translateY(-50%) rotate(35deg);
    position: relative;
}
.linediv .endyuan{
  /*width: 20%;*/
  width: 3rem;
  display: flex;
  justify-content: center;
}
.linediv .yuan{
  cursor: pointer;
  transition:all .3s;
}
.linediv .actyuan{
    border: 4px solid rgba(233,233,233,.4);
    box-shadow: 0 0 5px #FFff00;
    background: #FFff00;
}
.linediv .yuan:hover{
  border: 4px solid rgba(233,233,233,.4);
  box-shadow: 0 0 5px #ffff00;
  background: #FFff00;
}
.linediv .yuan .month{
    font-size:.16rem;
    transform:translate(0rem,.4rem);
    position: absolute;
    bottom:0;
    left:0;
    white-space:nowrap;
    color:#fff;
}
.linediv .actyuan .month{
    color: #FFff00;
}
.banner2 .swiper-button{
    background-image: none;
    width:.63rem;
    height:1.36rem;
    margin-top: -.68rem;
}

/*
  <div class="photobox">
    <img src="public/img/p1.png" class="pt1">
    <img src="public/img/p2.png" class="pt2">
    <img src="public/img/p3.png" class="pt3">
    <img src="public/img/p4.png" class="pt4">
    <img src="public/img/p5.png" class="pt5">
    <img src="public/img/p6.png" class="pt6">
    <img src="public/img/p7.png" class="pt7">
    <img src="public/img/p8.png" class="pt8">
    <img src="public/img/p9.png" class="pt9">
  </div>

*/
.photobox{
    width:12.5rem;
    height:5.3rem;
    position: relative;
    margin-top: .5rem;
}
.photobox .pt1{
    position: absolute;
    top:0;
    left:0;
    width:2.4rem;
    height:3.5rem;
    object-fit: cover;
}
.photobox .pt2{
    position: absolute;
    top:0;
    left:2.5rem;
    width:4.9rem;
    height:3.5rem;
    object-fit: cover;
}
.photobox .pt3{
    position: absolute;
    top:0;
    left:7.5rem;
    width:4.9rem;
    height:1.7rem;
    object-fit: cover;
}
.photobox .pt4{
    position: absolute;
    top:3.6rem;
    left:0;
    width:2.4rem;
    height:1.7rem;
    object-fit: cover;
}
.photobox .pt5{
    position: absolute;
    top:3.6rem;
    left:2.5rem;
    width:2.4rem;
    height:1.7rem;
    object-fit: cover;
}
.photobox .pt6{
    position: absolute;
    top:3.6rem;
    left:5rem;
    width:2.4rem;
    height:1.7rem;
    object-fit: cover;
}
.photobox .pt7{
    position: absolute;
    top:1.8rem;
    left:7.5rem;
    width:2.4rem;
    height:3.5rem;
    object-fit: cover;
}
.photobox .pt8{
    position: absolute;
    top:1.8rem;
    left:10rem;
    width:2.4rem;
    height:1.7rem;
    object-fit: cover;
}
.photobox .pt9{
    position: absolute;
    top:3.6rem;
    left:10rem;
    width:2.4rem;
    height:1.7rem;
    object-fit: cover;
}
.clasphoto{
  display: flex;
  /*justify-content: space-between;*/
}
.clasphoto >div{
  margin-right: 0.1rem;
}
.clasphoto img{
  object-fit: cover;
  display: block;
  margin-bottom: 0.1rem;

}
.clasphoto .photoboxleft{
  width: 59.1%;

}
.clasphoto >div:last-child{
  margin-right:0;
}
.clasphoto .photoboxleft .photop{
  display: flex;
  justify-content: space-between;
}
.clasphoto .photoboxleft .phobom{
  display: flex;
  justify-content: space-between;

}
.clasphoto .photoboxright{
  display: flex;
  flex-direction: column;
}

.clasphoto .photoboxright .photop{

}
.clasphoto .photoboxright .phobom{
  display: flex;
  justify-content: space-between;
}
.clasphoto .in1{
  width: 2.4rem;
  height: 3.5rem;
}
.clasphoto .in2{
  width:4.9rem;
  height:3.5rem;
}
.clasphoto .in3{
  width:4.9rem;
  height:1.7rem;
}
.clasphoto .in4{
  width:2.4rem;
  height:1.7rem;
}
.clasphoto .in5{
  width:2.4rem;
  height:1.7rem;
}
.clasphoto .in6{
  width:2.4rem;
  height:1.7rem;
}
.clasphoto .in7{
  width:2.4rem;
  height:3.5rem;
}
.clasphoto .in8{
  width:2.4rem;
  height:1.7rem;
}
.clasphoto .in9{
  width:2.4rem;
  height:1.7rem;
}
.photobox >img{
  transition: all .3s;
}
.photobox >img:hover{
  box-shadow: 1px 2px 9px 3px rgb(0 0 0 / 30%);
  transform:scale(1.1);
  z-index: 2;
}



.banner3{
    width:100%;
    height:6.48rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size:cover ;
}
.chengdu{
    width:1rem;
    border-bottom: 2px solid #fff;
    font-size:.2rem;
    font-weight: bold;
}
.chengdub{
    font-size:1.2rem;
    font-weight: bold;
    line-height:1;
    opacity: .2;
    position: absolute;
    top:0;
    left:0;
    transform: translateY(-50%);
}
.addrbox .block{
    padding-top:0;
    padding-bottom:.5rem;
}
.banner3 .contain{
    width:12.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.banner3 .desc{
    width:3.6rem;
    font-size:.18rem;
    margin-top:.6rem;
}
.addritem{
    font-size:.16rem;
    margin-top:1rem;
}
.addritem img{
    height:18px;
    margin-right:.05rem;
}
.banner3 div{
    color:#fff!important;
}
.map{
    width:7.24rem;
    height:4.71rem;
}
@media (max-width: 1500px) {

}
@media (max-width: 1100px) {
    .block{
        padding:.8rem .5rem;
    }
    .block .titlebox{
        width:100%;
        flex-wrap: wrap;
    }
    .block .desc {
        font-size: .28rem;
    }
    .neirong{
        width:15rem;
        font-size:.28rem;
    }
    .jsbox .contain{
        margin-top:.5rem;
    }
    .jsitem{
        margin-right:1.5rem;
    }
    .jsitem .tit{
        font-size: .32rem;
    }
    .jsitem .font{
        width:5.5rem;
        font-size: .28rem;
    }
    .banner2 .block{
        padding:0
    }
    .banner2 .nblock{
        width:100%;
        padding:.8rem .5rem .8rem 1.2rem;
    }
    .linediv {
        /*transform: translateY(.3rem) rotate(-35deg);*/
    }
    .licheng {
        width: 7rem;
        font-size: .28rem;
    }
    .linediv .yuan .month {
        transform: translate(0rem,.6rem);
    }
    .photobox{
        width:100%;
        height:8.6rem;
    }
    .photobox .pt1{
        position: absolute;
        top:0;
        left:0;
        width:4.2rem;
        height:5.65rem;
        object-fit: cover;
    }
    .photobox .pt2{
        position: absolute;
        top:0;
        left:4.3rem;
        width:8.4rem;
        height:5.65rem;
        object-fit: cover;
    }
    .photobox .pt3{
        position: absolute;
        top:0;
        left:12.8rem;
        width:8.1rem;
        height:2.7rem;
        object-fit: cover;
    }
    .photobox .pt4{
        position: absolute;
        top:5.75rem;
        left:0;
        width:4.2rem;
        height:2.7rem;
        object-fit: cover;
    }
    .photobox .pt5{
        position: absolute;
        top:5.75rem;
        left:4.3rem;
        width:4.15rem;
        height:2.7rem;
        object-fit: cover;
    }
    .photobox .pt6{
        position: absolute;
        top:5.75rem;
        left:8.55rem;
        width:4.15rem;
        height:2.7rem;
        object-fit: cover;
    }
    .photobox .pt7{
        position: absolute;
        top:2.8rem;
        left:12.8rem;
        width:4rem;
        height:5.65rem;
        object-fit: cover;
    }
    .photobox .pt8{
        position: absolute;
        top:2.8rem;
        left:16.9rem;
        width:4rem;
        height:2.75rem;
        object-fit: cover;
    }
    .photobox .pt9{
        position: absolute;
        top:5.7rem;
        left:16.9rem;
        width:4rem;
        height:2.75rem;
        object-fit: cover;
    }
  .clasphoto{

   }
  .clasphoto .photoboxleft{
    width: 61%;
  }
  .clasphoto .photoboxright{

  }
  .clasphoto .in1{
    width:4.2rem;
    height:5.65rem;
  }
  .clasphoto .in2{
    width:8.49rem;
    height:5.65rem;
  }
  .clasphoto .in3{
    width:8.1rem;
    height:2.7rem;
  }
  /*.clasphoto .in4{*/
    /*width:4.05rem;*/
    /*height:2.7rem;*/
  /*}*/
  /*.clasphoto .in5{*/
    /*width:4.05rem;*/
    /*height:2.7rem;*/
  /*}*/
  /*.clasphoto .in6{*/
    /*width:4.05rem;*/
    /*height:2.7rem;*/
  /*}*/
  .clasphoto .in4 , .clasphoto .in5 , .clasphoto .in6{
    width:4.2rem;
    height:2.7rem;
  }
  .clasphoto .in7{
    width:4rem;
    height:5.65rem;
  }
  .clasphoto .in8{
    width:4rem;
    height:2.8rem;
  }
  .clasphoto .in9{
    width:4rem;
    height:2.75rem;
  }


    .banner3{
        padding:0 .5rem;
    }
    .banner3 .contain{
        width:100%;
        justify-content: space-around;
    }
    .banner3 .desc{
        width:5.6rem;
        font-size:.28rem;
    }
    .chengdu{
        font-size:.36rem;
        font-weight: bold;
    }
    .addritem{
        font-size:.24rem;
    }
}
@media (max-width: 900px) {


}
@media (max-width: 850px) {
  .neirong{
    width:100%;
  }
  .jsitem {
     margin-right: 0;
  }
  .clasphoto{
    flex-wrap: wrap;
    height: auto;
  }
  .clasphoto .photoboxleft{
    width: 100%;
  }
  .clasphoto .photoboxright{
    width: 100%;

  }
  .clasphoto .in1{
    /*width:4.2rem;*/
    /*height:5.65rem;*/
    width: 6.7rem;
    height: 8.65rem;
  }
  .clasphoto .in2{
    /*width:8.49rem;*/
    /*height:5.65rem;*/
    width: 13.57rem;
    height: 8.65rem;
  }
  .clasphoto .in3{
    /*width:8.1rem;*/
    /*height:2.7rem;*/
    width: 100%;
    height: 6rem;
  }
  .clasphoto .in4 , .clasphoto .in5 , .clasphoto .in6{
    /*width:4.2rem;*/
    /*height:2.7rem;*/
    width: 6.7rem;
    height: 4.7rem;
  }
  .clasphoto .in7{
    width:4rem;
    height:5.65rem;
  }
  .clasphoto .in8{
    width:4rem;
    height:2.8rem;
  }
  .clasphoto .in9{
    width:4rem;
    height:2.75rem;
  }
  .photoboxright>.phobom >div{
    flex: 1;
  }
  .photoboxright>.phobom >div img{
    width: 100%;
  }
}
@media (max-width: 850px) {
    .block{
        padding:.5rem;
    }
    .neirong{
        width:100%;
        font-size:.28rem;
        margin-top:.3rem;
    }
    .jsbox .contain {
        flex-direction: column;
        margin-top:0;
    }
    .jsitem{
        width:100%;
        padding-top:.5rem;
        justify-content: flex-start;
    }
    .jsitem .tit{
        font-size:.32rem;
    }
    .jsitem .font{
        width:100%;
        font-size: .28rem;
    }
    .jsimg {
        height: auto;
        width:1rem;
        margin-right: .4rem;
    }
    .licheng {
        font-size: .28rem;
    }
    .banner2 .nblock{
        width:100%;
        /*padding:.5rem;*/
    }
    .linediv .yuan .month {
        font-size: .28rem;
    }
    .photobox{
        width:100%;
        height:21.7rem;
    }
    .photobox .pt1{
        position: absolute;
        top:0;
        left:0;
        width:4.6rem;
        height:6.1rem;
        object-fit: cover;
    }
    .photobox .pt2{
        position: absolute;
        top:0;
        left:4.7rem;
        width:9.3rem;
        height:6.1rem;
        object-fit: cover;
    }
    .photobox .pt3{
        position: absolute;
        top:6.2rem;
        left:0;
        width:4.6rem;
        height:3rem;
        object-fit: cover;
    }
    .photobox .pt4{
        position: absolute;
        top:6.2rem;
        left:4.7rem;
        width:4.6rem;
        height:3rem;
        object-fit: cover;
    }
    .photobox .pt5{
        position: absolute;
        top:6.2rem;
        left:9.4rem;
        width:4.6rem;
        height:3rem;
        object-fit: cover;
    }
    .photobox .pt6{
        position: absolute;
        top:9.3rem;
        left:0;
        width:14rem;
        height:4rem;
        object-fit: cover;
    }
    .photobox .pt7{
        position: absolute;
        top:13.4rem;
        left:0;
        width:6.9rem;
        height:8.3rem;
        object-fit: cover;
    }
    .photobox .pt8{
        position: absolute;
        top:13.4rem;
        left:7rem;
        width:7rem;
        height:4.1rem;
        object-fit: cover;
    }
    .photobox .pt9{
        position: absolute;
        top:17.6rem;
        left:7rem;
        width:7rem;
        height:4.1rem;
        object-fit: cover;
    }
    .clasphoto{

    }
    .clasphoto .photoboxleft{

    }
    .clasphoto .photoboxright{

    }
    .banner3 .contain{
        justify-content: space-between;
    }
}
@media (max-width: 660px) {
    .foryearwrap{
      display: none;
    }
    .block{
        padding:.5rem .3rem;
    }
    .block .desc{
        font-size:.24rem;
    }
    .banner{
        height:3.6rem;
    }
    .neirong{
        width:100%;
        margin-top:.3rem;
    }
    .jsbox .contain{
        margin-top:.1rem;
        flex-wrap: wrap;
    }
    .jsitem{
        width:100%;
        padding-top:0;
        margin:.2rem 0 0;
    }
    .jsimg{
        height:auto;
        width:.72rem;
    }
    .jsitem .font {
        width: 5.6rem;
        font-size: .28rem;
    }
    .banner2{
        height:6.5rem;
    }
    .banner2 .nblock{
        width:100%;
        padding:.5rem .3rem;
    }
    .linediv {
        width:12rem;
        transform: translate(-50%,-80%) rotate(-10deg);
        bottom:20%;
    }
    .linediv .yuan {
        width: 10px;
        height: 10px;
        border: 2px solid #ddd;
    }
    .licheng {
        width: 5.6rem;
        font-size: .18rem;
        margin: .5rem auto 0;
    }
    .lichengbox .monthb {
        font-size: 1.2rem;
        position: absolute;
        font-weight: bold;
        opacity: .2;
        left: 50%;
        /*bottom: 0;*/
        /*top:auto;*/
        line-height: 1;
        transform: translate(-50%,0);
    }
    .linediv .yuan .month {
        /*transform: translate(-50%,-50%) rotate(25deg);*/
        transform: translate(0rem,.5rem) rotate(-25deg);
        font-size:.24rem;
    }
    .banner2 .swiper-button {
        width: .5rem;
        height: 1rem;
    }
    .photobox{
        width:100%;
        height:11.8rem;
    }
    .photobox .pt1{
        position: absolute;
        top:0;
        left:0;
        width:2.2rem;
        height:3.3rem;
        object-fit: cover;
    }
    .photobox .pt2{
        position: absolute;
        top:0;
        left:2.35rem;
        width:4.55rem;
        height:3.3rem;
        object-fit: cover;
    }
    .photobox .pt3{
        position: absolute;
        top:3.45rem;
        left:0;
        width:2.2rem;
        height:1.6rem;
        object-fit: cover;
    }
    .photobox .pt4{
        position: absolute;
        top:3.45rem;
        left:2.35rem;
        width:2.2rem;
        height:1.6rem;
        object-fit: cover;
    }
    .photobox .pt5{
        position: absolute;
        top:3.45rem;
        left:4.7rem;
        width:2.2rem;
        height:1.6rem;
        object-fit: cover;
    }
    .photobox .pt6{
        position: absolute;
        top:5.2rem;
        left:0;
        width:6.9rem;
        height:2.55rem;
        object-fit: cover;
    }
    .photobox .pt7{
        position: absolute;
        top:7.9rem;
        left:0;
        width:3.375rem;
        height:4.35rem;
        object-fit: cover;
    }
    .photobox .pt8{
        position: absolute;
        top:7.9rem;
        left:3.525rem;
        width:3.375rem;
        height:2.1rem;
        object-fit: cover;
    }
    .photobox .pt9{
        position: absolute;
        top:10.15rem;
        left:3.525rem;
        width:3.375rem;
        height:2.1rem;
        object-fit: cover;
    }
    .banner3{
        padding:0 .3rem;
    }
    .banner3 .desc {
        width: 100%;
    }
    .map{
        display: none;
    }
}