
.breadmenu{
  padding: 7.1875vw 13.3333333333vw 3.9vw 7.864vw ;
  display: flex;
  align-items: center;
  color: #141414;
}
.breadmenu span{
  margin: 0 5px;
}
.breadmenu a:hover{
  color: #986733;
  text-decoration: underline;
  transition: 0.6s;
}
.sec1 {
  padding: 0 13.3333333333vw 5.6770833333vw 16.1458333333vw;
  display: flex;
  justify-content: space-between;
}
.sec1 .l_box {
  width: 36.7708333333vw;
}
.sec1 .l_box .swiper_box {
  width: 36.7708333333vw;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sec1 .l_box .swiper_box .btns {
  position: absolute;
  display: flex;
  gap: 43.125vw;
}
.sec1 .l_box .swiper_box .btns .jt {
  cursor: pointer;
}
.sec1 .l_box .swiper_box .btns .jt svg {
  width: 0.78125vw;
  height: unset;
}
.sec1 .l_box .swiper_box .btns .jt svg path {
  transition: 0.6s;
}
.sec1 .l_box .swiper_box .btns .jt:hover svg path {
  stroke: #986733;
  stroke-opacity: 1;
}
.sec1 .l_box .swiper_box .swiper {
  width: 100%;
}
.sec1 .l_box .swiper_box .swiper .swiper-slide {
  height: 21.9791666667vw;
  overflow: hidden;
}
.sec1 .l_box .swiper_box .swiper .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 1s;
}
.sec1 .l_box .swiper_box .swiper .swiper-slide:hover img {
  transform: scale(1.1);
}
.sec1 .l_box .small_swiper {
  width: 36.09375vw;
  margin: 1.1979166667vw auto 0;
  overflow: hidden;
}
.sec1 .l_box .small_swiper .swiper-slide {
  height: 5.2083333333vw;
  overflow: hidden;
  cursor: pointer;
  transition: 0.6s;
  position: relative;
}
.sec1 .l_box .small_swiper .swiper-slide:after {
  content: "";
  background: #986733;
  width: 100%;
  height: 0.2604166667vw;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0;
  transition: 0.6s;
}
.sec1 .l_box .small_swiper .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 1s;
}
.sec1 .l_box .small_swiper .swiper-slide.swiper-slide-thumb-active:after {
  opacity: 1;
}
.sec1 .l_box .small_swiper .swiper-slide:hover img {
  transform: scale(1.1);
}
.sec1 .r_box {
  width: 23.125vw;
  padding: 3.4895833333vw 0 0;
}
.sec1 .r_box .title {
  color: #000;
  font-weight: 300;
}
.sec1 .r_box .sort {
  margin: 0.8333333333vw 0 5.1041666667vw;
  color: #000;
  font-weight: 500;
}
.sec1 .r_box .part {
  width: 100%;
}
.sec1 .r_box .part .line {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.sec1 .r_box .part .line .h5 {
  width: 2.5vw;
  line-height: 3.5416666667vw;
  color: #986733;
  font-weight: 400;
  border-top: 0.0520833333vw solid #986733;
}
.sec1 .r_box .part .line .p {
  width: 20.1041666667vw;
  color: #333;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.0520833333vw;
  height: 3.5416666667vw;
  padding: 1.3020833333vw 0 0;
  border-top: 0.0520833333vw solid #DCDCDC;
}
.sec1 .r_box .part .line:nth-last-child(1) .h5 {
  border-bottom: 0.0520833333vw solid #986733;
}
.sec1 .r_box .part .line:nth-last-child(1) .p {
  border-bottom: 0.0520833333vw solid #DCDCDC;
}
.sec1 .r_box .colors {
  display: flex;
  gap: 1.09375vw;
  margin: 3.0729166667vw 0 0;
}
.sec1 .r_box .colors .color {
  width: 2.3958333333vw;
  height: 2.3958333333vw;
  border-radius: 50%;
  overflow: hidden;
}
.sec1 .r_box .colors .color img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.sec2 .wrap {
  width: 75.5208333333vw;
  margin: 0 auto;
}
.sec2 .wrap .title {
  text-align: center;
  margin-bottom: 3.90625vw;
}
.sec2 .wrap .title .cn {
  color: #4E4E50;
  font-weight: 300;
  margin-bottom: 0.46875vw;
}
.sec2 .wrap .title .en {
  color: #838383;
  font-family: "Aboreto";
  font-weight: 400;
  letter-spacing: 0.2864583333vw;
  text-transform: uppercase;
}
.sec2 .wrap .title1 {
  transform: translateX(-4.1666666667vw);
  margin-bottom: 2.9166666667vw;
}
.sec2 .wrap .title1 .cn {
  color: #986733;
  font-weight: 500;
  margin-bottom: 0.3125vw;
}
.sec2 .wrap .title1 .en {
  color: #838383;
  font-family: "Aboreto";
  font-weight: 400;
  text-transform: uppercase;
}
.sec2 .wrap .swiper_box {
  width: 100%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sec2 .wrap .swiper_box .btns {
  display: flex;
  gap: 83.125vw;
  position: absolute;
}
.sec2 .wrap .swiper_box .btns .jt {
  width: 1.1979166667vw;
  cursor: pointer;
}
.sec2 .wrap .swiper_box .btns .jt svg {
  display: block;
  width: 100%;
}
.sec2 .wrap .swiper_box .btns .jt svg path {
  transition: 0.6s;
}
.sec2 .wrap .swiper_box .btns .jt:hover svg path {
  stroke: #986733;
}
.sec2 .wrap .swiper_box .swiper {
  width: 100%;
}
.sec2 .wrap .swiper_box .swiper .swiper-slide {
  position: relative;
}
.sec2 .wrap .swiper_box .swiper .swiper-slide .img {
  width: 100%;
  height: 41.875vw;
  overflow: hidden;
  opacity: 0;
  transform: translateY(1.0416666667vw);
}
.sec2 .wrap .swiper_box .swiper .swiper-slide .img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sec2 .wrap .swiper_box .swiper .swiper-slide .text {
  position: absolute;
  left: 2.2395833333vw;
  bottom: 2.5vw;
  width: 24.2708333333vw;
  background: rgba(255, 255, 255, 0.87);
  padding: 1.6145833333vw 1.9791666667vw;
  opacity: 0;
  transform: translateY(1.0416666667vw);
}
.sec2 .wrap .swiper_box .swiper .swiper-slide .text .h5 {
  color: #000;
  font-weight: 300;
}
.sec2 .wrap .swiper_box .swiper .swiper-slide .text .line {
  width: 1.6145833333vw;
  height: 0.15625vw;
  background: #986733;
  margin: 2.7604166667vw 0 1.875vw;
}
.sec2 .wrap .swiper_box .swiper .swiper-slide .text .p {
  color: #333;
  font-weight: 350;
  line-height: 2.2;
}
.sec2 .wrap .swiper_box .swiper .swiper-slide.swiper-slide-active .img {
  opacity: 1;
  transform: translateY(0);
  transition: 0.6s;
}
.sec2 .wrap .swiper_box .swiper .swiper-slide.swiper-slide-active .text {
  opacity: 1;
  transform: translateY(0);
  transition: 0.6s;
  transition-delay: 0.2s;
}
.sec2 .wrap .swiper-pagination {
  margin: 2.96875vw 0 0;
  display: flex;
  justify-content: center;
  gap: 0.78125vw;
  position: unset;
  width: 100%;
}
.sec2 .wrap .swiper-pagination .swiper-pagination-bullet {
  display: block;
  width: 0.5208333333vw;
  height: 0.5208333333vw;
  border-radius: 0.5208333333vw;
  background: #E0E0E0;
  margin: 0;
  opacity: 1;
  transition: 0.6s;
  cursor: pointer;
}
.sec2 .wrap .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #986733;
}

.sec3 {
  padding: 3.1770833333vw 0 0;
}
.sec3 .wrap {
  width: 84.6875vw;
  margin: 0 auto;
}
.sec3 .wrap .title1 {
  margin: 0 0 4.6354166667vw 0;
  text-align: center;
}
.sec3 .wrap .title1 .cn {
  color: #986733;
  font-weight: 500;
  margin-bottom: 0.3125vw;
}
.sec3 .wrap .title1 .en {
  color: #838383;
  font-family: "Aboreto";
  font-weight: 400;
  text-transform: uppercase;
}
.sec3 .wrap .list .item {
  display: flex;
}
.sec3 .wrap .list .item .l, .sec3 .wrap .list .item .r {
  width: 50%;
  background: #F7F7F7;
}
.sec3 .wrap .list .item .r {
  padding: 0 9.4791666667vw 0 6.09375vw;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.sec3 .wrap .list .item .r .h5 {
  color: #000;
  font-weight: 700;
}
.sec3 .wrap .list .item .r .p {
  color: #333;
  font-weight: 350;
  line-height: 200%;
  margin: 1.1979166667vw 0 0;
}
.sec3 .wrap .list .item .l {
  height: 32.7604166667vw;
  overflow: hidden;
}
.sec3 .wrap .list .item .l img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.6s;
}
.sec3 .wrap .list .item .l:hover img {
  transform: scale(1.1);
}
.sec3 .wrap .list .item:not(:last-child) {
  margin-bottom: 2.7083333333vw;
}
.sec3 .wrap .list .item:nth-child(2n) {
  flex-direction: row-reverse;
}

.sec4 {
  padding: 5.46875vw 0 7.552vw;
}
.sec4 .wrap {
  width: 83.3333333333vw;
  margin: 0 auto;
}
.sec4 .wrap .title1 {
  margin: 0 0 3.6979166667vw;
  text-align: center;
}
.sec4 .wrap .title1 .cn {
  color: #986733;
  font-weight: 500;
  margin-bottom: 0.3125vw;
}
.sec4 .wrap .title1 .en {
  color: #838383;
  font-family: "Aboreto";
  font-weight: 400;
  text-transform: uppercase;
}
.sec4 .wrap .swiper_box {
  margin: 3.6979166667vw 0 3.9583333333vw;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sec4 .wrap .swiper_box .btns {
  position: absolute;
  display: flex;
  pointer-events: none;
  gap: 80.2604166667vw;
}
.sec4 .wrap .swiper_box .btns .jt {
  pointer-events: auto;
  cursor: pointer;
}
.sec4 .wrap .swiper_box .btns .jt svg {
  display: block;
  width: 1.1979166667vw;
}
.sec4 .wrap .swiper_box .btns .jt svg path {
  transition: 0.6s;
}
.sec4 .wrap .swiper_box .btns .jt:hover svg path {
  stroke: #986733;
}
.sec4 .wrap .swiper_box .swiper {
  /* width: 66.1979166667vw; */
  width: 90%;
  margin: 0 auto;
  overflow: hidden;
}
.sec4 .wrap .swiper_box .swiper .swiper-slide .slide_box {
  display: block;
  width: 100%;
  height: 15.8vw;
  position: relative;
}
.sec4 .wrap .swiper_box .swiper .swiper-slide .slide_box .img {
  width: 100%;
  height: 100%;
  background: #F6F6F6;
}
.sec4 .wrap .swiper_box .swiper .swiper-slide .slide_box .img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sec4 .wrap .swiper_box .swiper .swiper-slide .slide_box .img2 {
  position: absolute;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: 0.6s;
}
.sec4 .wrap .swiper_box .swiper .swiper-slide .slide_box .img2 img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sec4 .wrap .swiper_box .swiper .swiper-slide .slide_box .img2 .more {
  width: 9.375vw;
  height: 2.6458333333vw;
  background: url("/images/btn_bg.png") no-repeat;
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  color: #000;
  font-size: 0.9375vw;
  font-weight: 300;
  transition: 0.6s;
}
.sec4 .wrap .swiper_box .swiper .swiper-slide .item p{
  margin-top: 2.448vw;
  text-align: center;
}
.sec4 .wrap .swiper_box .swiper .swiper-slide .slide_box:hover .img2 {
  opacity: 1;
}
.sec4 .wrap .more {
  display: flex;
  align-items: center;
  width: fit-content;
  margin: 0 auto;
  gap: 0.5208333333vw;
}
.sec4 .wrap .more p {
  color: #986733;
  font-weight: 400;
}
.sec4 .wrap .more .jia {
  width: 1.09375vw;
  height: 1.09375vw;
  position: relative;
  transition: 0.6s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sec4 .wrap .more .jia img {
  display: block;
  width: 100%;
}

@media screen and (max-width: 768px) {
  .breadmenu{
    padding: 80px 5% 20px 5%;
    flex-wrap: wrap;
    font-size: 14px;
  }
  .sec1 {
    padding: 0  5vw 0;
    display: block;
  }
  .sec1 .l_box {
    width: 100%;
  }
  .sec1 .l_box .swiper_box {
    width: 100%;
  }
  .sec1 .l_box .swiper_box .btns {
    display: none;
  }
  .sec1 .l_box .swiper_box .swiper .swiper-slide {
    height: 52vw;
  }
  .sec1 .l_box .small_swiper {
    margin: 15px 0 0;
    width: 100%;
  }
  .sec1 .l_box .small_swiper .swiper-slide {
    height: 17vw;
  }
  .sec1 .l_box .small_swiper .swiper-slide:after {
    height: 2px;
  }
  .sec1 .r_box {
    margin: 25px 0 0;
    padding: 0;
    width: 100%;
  }
  .sec1 .r_box .title {
    font-size: 24px;
  }
  .sec1 .r_box .sort {
    margin: 6px 0 15px;
  }
  .sec1 .r_box .part .line .h5 {
    width: 70px;
    line-height: 50px;
  }
  .sec1 .r_box .part .line .p {
    height: 50px;
    width: calc(100% - 80px);
    padding: 16px 0 0;
  }
  .sec1 .r_box .colors {
    gap: 10px;
    margin: 25px 0 0;
  }
  .sec1 .r_box .colors .color {
    width: 36px;
    height: 36px;
  }
  .sec2 {
    padding: 60px 5vw 0;
  }
  .sec2 .wrap {
    width: 100%;
  }
  .sec2 .wrap .title {
    margin-bottom: 20px;
  }
  .sec2 .wrap .title .cn {
    font-size: 24px;
  }
  .sec2 .wrap .title .en {
    font-size: 15px;
  }
  .sec2 .wrap .title1 {
    transform: unset;
    margin-bottom: 15px;
  }
  .sec2 .wrap .title1 .cn {
    font-size: 20px;
  }
  .sec2 .wrap .title1 .en {
    font-size: 14px;
  }
  .sec2 .wrap .swiper_box {
    display: block;
  }
  .sec2 .wrap .swiper_box .swiper .swiper-slide .img {
    height: 48vw;
  }
  .sec2 .wrap .swiper_box .swiper .swiper-slide .text {
    position: unset;
    width: 100%;
    background: #F6F6F6;
    padding: 15px;
  }
  .sec2 .wrap .swiper_box .swiper .swiper-slide .text .line {
    width: 24px;
    height: 2px;
    margin: 15px 0;
  }
  .sec2 .wrap .swiper_box .btns {
    display: none;
  }
  .sec2 .wrap .swiper-pagination {
    gap: 8px;
    margin: 15px 0 0;
  }
  .sec2 .wrap .swiper-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 50%;
  }
  .sec3 {
    padding: 60px 5vw 0;
  }
  .sec3 .wrap {
    width: 100%;
  }
  .sec3 .wrap .title1 {
    transform: unset;
    margin: 0 0 25px;
  }
  .sec3 .wrap .title1 .cn {
    font-size: 20px;
  }
  .sec3 .wrap .title1 .en {
    font-size: 14px;
  }
  .sec3 .wrap .list .item {
    display: block;
  }
  .sec3 .wrap .list .item:not(:last-child) {
    margin-bottom: 25px;
  }
  .sec3 .wrap .list .item .l, .sec3 .wrap .list .item .r {
    width: 100%;
  }
  .sec3 .wrap .list .item .l {
    height: 70vw;
  }
  .sec3 .wrap .list .item .r {
    padding: 20px;
  }
  .sec3 .wrap .list .item .r .h5 {
    font-size: 18px;
  }
  .sec3 .wrap .list .item .r .p {
    font-size: 15px;
    margin: 10px 0 0;
  }
  .sec4 {
    padding: 60px 5vw 70px;
  }
  .sec4 .wrap {
    width: 100%;
  }
  .sec4 .wrap .title1 {
    transform: unset;
    margin: 0 0 25px;
  }
  .sec4 .wrap .title1 .cn {
    font-size: 20px;
  }
  .sec4 .wrap .title1 .en {
    font-size: 14px;
  }
  .sec4 .wrap .swiper_box {
    display: block;
  }
  .sec4 .wrap .swiper_box .swiper {
    width: 100%;
  }
  .sec4 .wrap .swiper_box .swiper .swiper-slide .slide_box {
    height: 180px;
  }
  .sec4 .wrap .swiper_box .swiper .swiper-slide .slide_box .img2 .more {
    width: 120px;
    height: 40px;
    font-size: 14px;
  }
  .sec4 .wrap .swiper_box .swiper .swiper-slide .item p{
    margin-top: 15px;
  }
  .sec4 .wrap .swiper_box .btns {
    gap: 20px;
    margin: 15px 0 0;
    position: unset;
    justify-content: center;
  }
  .sec4 .wrap .swiper_box .btns .jt svg {
    width: 8px;
    height: unset;
  }
  .sec4 .wrap .more {
    margin: 25px 0 0;
    gap: 6px;
  }
  .sec4 .wrap .more p {
    font-size: 15px;
  }
  .sec4 .wrap .more .jia {
    width: 12px;
    height: 12px;
  }
}

/*# sourceMappingURL=proInfo.css.map */
