::-webkit-scrollbar {
  position: absolute;
  right: 0;
  top: 0
}
::-webkit-scrollbar {
  width: 8px;
  height: 8px
}
::-webkit-scrollbar-thumb {
  background: #ec6756;
  -webkit-border-radius: 5px;
  border-radius: 5px
}
::-webkit-scrollbar-track {
  background: 0 0
}
#fixedNav ul li, .icon, .wrapper1 .download, .wrapper1 .logo, .wrapper1 .title, .wrapper1 ul li a, .wrapper2 .btn, .wrapper5 .btn {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/icon.png);
  background-repeat: no-repeat
}
.wrapper {
  background-position: center top;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden
}
.wrapper1 {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/1.jpg);
  height: 1080px
}
.wrapper1 .download, .wrapper1 .logo, .wrapper1 .title, .wrapper1 .pic1, .wrapper1 .pic2 {
  position: absolute;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: .6s;
  -moz-animation-duration: .6s;
  -o-animation-duration: .6s;
  animation-duration: .6s
}
.wrapper1 .logo {
  width: 130px;
  height: 104px;
  background-position: 0 0;
  left: 20px;
  top: 20px
}
.wrapper1 .title {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/title.png);
  width: 1023px;
  height: 316px;
  left: 50%;
  top: 110px;
  margin-left: -470px;
  -webkit-animation-delay: .4s;
  -moz-animation-delay: .4s;
  -o-animation-delay: .4s;
  animation-delay: .4s;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  -o-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-name: fadeInDown;
  -moz-animation-name: fadeInDown;
  -o-animation-name: fadeInDown;
  animation-name: fadeInDown
}
.wrapper1 .pic1 {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/1-pic.png);
  width: 206px;
  height: 204px;
  left: 50%;
  top: 450px;
  margin-left: 0;
  -webkit-animation-delay: .4s;
  -moz-animation-delay: .4s;
  -o-animation-delay: .4s;
  animation-delay: .4s;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  -o-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-name: fadeInDown;
  -moz-animation-name: fadeInDown;
  -o-animation-name: fadeInDown;
  animation-name: fadeInDown
}
.wrapper1 .pic2 {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/2-pic.png);
  width: 206px;
  height: 204px;
  left: 50%;
  top: 500px;
  margin-left: 180px;
  -webkit-animation-delay: .4s;
  -moz-animation-delay: .4s;
  -o-animation-delay: .4s;
  animation-delay: .4s;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  -o-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-name: fadeInDown;
  -moz-animation-name: fadeInDown;
  -o-animation-name: fadeInDown;
  animation-name: fadeInDown
}
.wrapper1 .download {
  width: 346px;
  height: 97px;
  background-position: -3PX -150px;
  left: 50%;
  margin-left: -177px;
  z-index: 2;
  bottom: 230px;
  -webkit-animation-delay: .6s;
  -moz-animation-delay: .6s;
  -o-animation-delay: .6s;
  animation-delay: .6s;
  -webkit-animation-name: fadeInUp;
  -moz-animation-name: fadeInUp;
  -o-animation-name: fadeInUp;
  animation-name: fadeInUp
}
.wrapper1 .download:hover {
  background-position: -3PX -296px
}
.wrapper1::after {
  position: absolute;
  content: "";
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/wrapper-1-filter.png);
  height: 400px;
  width: 1920px;
  left: 50%;
  bottom: 0;
  z-index: 0;
  margin-left: -960px
}
.wrapper1 ul {
  position: absolute;
  z-index: 3;
  width: 138px;
  height: 64px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  right: 50px;
  top: 20px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between
}
.wrapper1 ul li {
  width: 64px;
  position: relative
}
.wrapper1 ul li a {
  position: absolute;
  width: 100%;
  height: 100%
}
.wrapper1 ul li:nth-of-type(1) a {
  background-position: -207px 0
}
.wrapper1 ul li:nth-of-type(2) a {
  background-position: -283px 0
}
.wrapper2 {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/2.jpg);
  height: 903px
}
.wrapper2 .btn {
  position: absolute;
  width: 170px;
  height: 50px;
  background-position: -392px -265px;
  cursor: pointer;
  left: 50%;
  bottom: 150px
}
.wrapper2 .btn.btn1 {
  margin-left: -475px
}
.wrapper2 .btn.btn2 {
  margin-left: -82px
}
.wrapper2 .btn.btn3 {
  margin-left: 308px
}
.wrapper2 .btn:hover {
  background-position: -392px -325px
}
.wrapper3 {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/3.jpg);
  height: 1152px
}
.wrapper4 {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/4.jpg);
  height: 760px
}
.wrapper5 {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/5.jpg);
  height: 990px
}
.wrapper5 .btn {
  position: absolute;
  width: 190px;
  height: 46px;
  background-position: -391px -387px;
  cursor: pointer;
  left: 50%
}
.wrapper5 .btn.btn1 {
  bottom: 190px;
  margin-left: -462px
}
.wrapper5 .btn.btn2 {
  bottom: 190px;
  margin-left: -87px
}
.wrapper5 .btn.btn3 {
  bottom: 190px;
  margin-left: 282px
}
.wrapper5 .btn:hover {
  background-position: -391px -439px
}
.wrapper6 {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/6.jpg);
  height: 944px
}
.wrapper6 .slide-wrapper {
  width: 1126px;
  margin: 0 auto;
  padding-top: 390px;
}
.wrapper6 .slide-wrapper ul li {
  float: left;
  width: 120px;
  height: 555px;
  position: relative;
  overflow: hidden;
  transition: .5s;
  -webkit-transition: .5s;
  -o-transition: .5s;
  -moz-transition: .5s;
}
.wrapper6 .slide-wrapper ul li.active {
  width: 883px;
}
.wrapper6 .slide-wrapper ul li.active h1.title1 {
  width: 160px;
  background-position: 0 0;
}
.wrapper6 .slide-wrapper ul li.active h1.title2 {
  width: 160px;
  background-position: -161px 0
}
.wrapper6 .slide-wrapper ul li.active h1.title3 {
  width: 160px;
  background-position: -322px 0
}
.wrapper6 .slide-wrapper ul li h1 {
  position: absolute;
  width: 120px;
  height: 100%;
  cursor: pointer;
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/navs-bg.png);
  background-repeat: no-repeat
}
.wrapper6 .slide-wrapper ul li h1.title1 {
  background-position: -20px -555px
}
.wrapper6 .slide-wrapper ul li h1.title2 {
  background-position: -180px -555px
}
.wrapper6 .slide-wrapper ul li h1.title3 {
  background-position: -343px -555px
}
.wrapper6 .slide-wrapper ul li div {
  position: absolute;
  width: 722px;
  height: 498px;
  top: 50%;
  margin-top: -249px;
  left: 160px
}
.wrapper7 {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/7.jpg);
  height: 1694px
}
.wrapper7 .gotop {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/top_btn.png);
  position: absolute;
  width: 175px;
  height: 177px;
  left: 50%;
  margin-left: -87px;
  bottom: 0;
  cursor: pointer
}
#fixedNav {
  position: fixed;
  right: 20px;
  z-index: 2;
  top: 50%;
  margin-top: -347px;
  width: 165px;
  height: 954px;
  -webkit-transition: .3s;
  -o-transition: .3s;
  -moz-transition: .3s;
  transition: .3s;
  color: #d1b99d;
}
#fixedNav.hide {
  -webkit-transform: translateX(120%);
  -moz-transform: translateX(120%);
  -ms-transform: translateX(120%);
  -o-transform: translateX(120%);
  transform: translateX(120%);
  opacity: 0
}
#fixedNav ul {
  text-align: center;
}
#fixedNav ul li {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/right_nav.png);
  width: 89px;
  height: 89px;
  position: relative;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
}
#fixedNav ul li:nth-child(1) {
  background-position: 0 0;
}
#fixedNav ul li:nth-child(2) {
  background-position: 0 -89px;
}
#fixedNav ul li:nth-child(3) {
  background-position: 0 -178px;
}
#fixedNav ul li:nth-child(4) {
  background-position: 0 -267px;
}
#fixedNav ul li:nth-child(5) {
  background-position: 0 -356px;
}
#fixedNav ul li:nth-child(6) {
  background-position: 0 -445px;
}
#fixedNav ul li.active {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/right_nav_act.png);
  width: 165px;
  height: 159px;
}
#fixedNav ul li:nth-child(1).active {
  background-position: 0 0;
}
#fixedNav ul li:nth-child(2).active {
  background-position: 0 -159px;
}
#fixedNav ul li:nth-child(3).active {
  background-position: 0 -318px;
}
#fixedNav ul li:nth-child(4).active {
  background-position: 0 -477px;
}
#fixedNav ul li:nth-child(5).active {
  background-position: 0 -636px;
}
#fixedNav ul li:nth-child(6).active {
  background-position: 0 -795px;
}
#fixedNav .gotop {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/gototop.png);
  width: 42px;
  height: 42px;
  position: relative;
  top: 10px;
  left: 63px;
  cursor: pointer
}
.pop .content {
  background-color: transparent;
  width: 871px
}
.pop .content .close {
  right: 36px;
  top: 0;
  height: 60px;
  width: 60px;
  border: none
}
#Pop1 .content {
  width: 1044px;
  height: 802px;
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/pop-1.png)
}
#Pop2 .content {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/pop-2.png);
  width: 1044px;
  height: 802px
}
#Pop3 .content {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/pop-3.png);
  width: 1044px;
  height: 802px
}
#Pop4 .content {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/pop-4.png);
  width: 1044px;
  height: 802px
}
#Pop6 .content {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/pop-5.png);
  width: 1044px;
  height: 802px
}
#Pop5 .content {
  background-image: url(../pic/woool/woool2_act/2025/0122_NewArea/pop-6.png);
  width: 1044px;
  height: 802px
}
.code {
  background-image: url(../pic/woool/woool_act/20241225_NewArea/icon1.png);
  position: fixed;
  left: 40px;
  bottom: 30px;
  z-index: 1;
  width: 208px;
  height: 303px;
  background-position: 0 -332px;
  -webkit-transform: translateX(-120%);
  -moz-transform: translateX(-120%);
  -ms-transform: translateX(-120%);
  -o-transform: translateX(-120%);
  transform: translateX(-120%);
  -webkit-transition: .4s;
  -o-transition: .4s;
  -moz-transition: .4s;
  transition: .4s;
  opacity: 0
}
.code a {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0
}
.code.show {
  opacity: 1;
  -webkit-transition: .4s .4s;
  -o-transition: .4s .4s;
  -moz-transition: .4s .4s;
  transition: .4s .4s;
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0)
}
@media screen and (min-width:1920px) {
  .code {
    left: 50%;
    margin-left: -940px
  }
  #fixedNav {
    right: 50%;
    margin-right: -940px
  }
}