.wrapper {
    background-position: center top;
    background-repeat: no-repeat;
    position: relative
}

.wrapper1 {
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/bg1.jpg?v=2024-06-27-14-17-06-718);
    height: 1502px
}
.wrapper1 a.logo{
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/logo.png?v=2024-06-27-14-17-06-718);
    position: absolute;
    width: 350px;
    height: 200px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    left: 10px;
    top: 10px;
    z-index: 2;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}
.wrapper1 .links-wrapper {
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/top_nav.png?v=2024-06-27-14-17-06-718);
    position: absolute;
    width: 138px;
    height: 56px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    right: 54px;
    top: 42px;
    z-index: 2;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.wrapper1 .links-wrapper a {
    -webkit-flex-wrap: 1;
    -ms-flex-wrap: 1;
    flex-wrap: 1;
    display: block;
    width: 56px
}

.wrapper1 .title {
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/slogen.png?v=2024-06-27-14-17-06-718);
    width: 1428px;
    height: 466px;
    position: absolute;
    left: 50%;
    top: 540px;
    margin-left: -714px;
    -webkit-animation-name: fadeInDown;
    -moz-animation-name: fadeInDown;
    -o-animation-name: fadeInDown;
    animation-name: fadeInDown;
    -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;
    -webkit-animation-delay: .2s;
    -moz-animation-delay: .2s;
    -o-animation-delay: .2s;
    animation-delay: .2s
}
.wrapper1 ul.zd_pic{
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/zd_pic.png?v=2024-06-27-14-17-06-282);
    background-repeat: no-repeat;
    height: 270px;
    width: 1280px;
    position: absolute;
    left: 50%;
    margin-left: -640px;
    bottom: 90px;
    font-size:0
}
.wrapper1 ul.zd_pic li{
    width: 213px;
    height: 270px;
    display:inline-block;
    margin-right:52px;
    cursor: pointer;
}
.wrapper1 ul.zd_pic li a{
    display: block;
    width: 100%;
    height: 100%;
}
.wrapper1 ul.zd_pic li.active{
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/zd_pic_active.png?v=2024-0327-14-17-06-5);
    width: 213px;
    height: 270px;
}


.wrapper2 {
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/bg2.jpg?v=2024-06-27-14-17-06-718);
    height: 1140px
}
.wrapper2 .qa_content{
    width:1220px;
    height:750px;
    position: absolute;
    top: 260px;
    left: 50%;
    margin-left: -615px;
}
.wrapper2 .qa_content ul{
    width: 100%;
    height: 100%;
    overflow-y: auto;
    overflow-x:hidden;
    scrollbar-width:10px;
    -webkit-scrollbar-width:thin;
    scrollbar-color:#9e2e22 #fcb074;
    -webkit-scrollbar-color:#9e2e22 #fcb074;
    
}
.wrapper2 .qa_content ul li{
    padding:20px 50px 20px 50px;
    vertical-align: middle;
    border-bottom: 2px dashed #e1b474;
    
}
.wrapper2 .qa_content ul li span{
    display: block;
    
}
.wrapper2 .qa_content ul li span.font_q{
    font-size: 22px;
    font-family:"宋体";
    width: 95%;
    padding-left:70px;
    letter-spacing: 1px;
    color:#ed6633;
    vertical-align: middle;
    line-height: 51px;
    height: 51px;
    margin-bottom:15px;
    font-weight: 800;
}
.wrapper2 .qa_content ul li span.icon_q{
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/Q_A.png?v=2024-06-27-14-17-06-718);
    background-position: 0 -51px;
    background-repeat: no-repeat;
    
    
}
.wrapper2 .qa_content ul li span.font_a{
    font-size: 22px;
    font-family:"宋体";
    width: 90%;
    padding-left:70px;
    letter-spacing: 1px;
    color:#932c0e;
    vertical-align: middle;
    line-height: 30px;
    height: 51px;
    margin-bottom:30px;
    font-weight: 400;
}
.wrapper2 .qa_content ul li span.icon_a{
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/Q_A.png?v=2024-06-27-14-17-06-718);
    background-position: 0 0;
    background-repeat: no-repeat;
}




.wrapper3 {
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/bg3.jpg?v=56);
    height: 1062px
}
.wrapper3 .long_pic{
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/long_pic.png?v=54);
    width:375px;
    height: 976px;
    position: absolute;
    top: 30px;
    left: 50%;
    margin-left: -780px;
    z-index:10
}

.wrapper3 .video_box{
    width: 1170px;
    height: 638px;;
    position: absolute;
    top: 280px;
    left: 50%;
    margin-left: -595px;
    overflow: hidden;
}
.wrapper3 .video_box a.video_btn{
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/video_btn.png?v=3);
    width:165px;
    height: 165px;
    display: block;
    top: 50%;
    left: 50%;
    margin-top:-83px ;
    margin-left:-83px ;
    position: absolute;
    -webkit-animation: zoomInOut 2s infinite;
    animation: zoomInOut 2s infinite;
}



.wrapper4 {
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/bg4.jpg?v=2024-06-27-14-17-06-718);
    height: 856px;
}
.wrapper4 .inner {
    padding-top: 100px;
    width: 1700px;
    position:absolute;
    left: 50%;
    margin-left: -850px;
}
.wrapper4 .inner .swiper-btn {
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/rl_btn.png?v=2024-06-27-14-17-06-718);
    position: absolute;
    width: 75px;
    height: 133px;
    top: 165px;
    cursor: pointer;
}

.wrapper4 .inner .swiper-btn.prev-btn {
    left: 0;
    background-position: 0 0;
}

.wrapper4 .inner .swiper-btn.next-btn {
    right: 0;
    background-position: -75px 0;
}

.wrapper4 .inner .swiper-container {
    width: 1470px;
    margin: 0 auto;
}
.wrapper4 .inner .swiper-container .swiper-slide{
    width:440px;
    margin-right:30px;
}

.wrapper4 .inner .swiper-container .pagination {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 60px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.wrapper4 .inner .swiper-container .pagination .swiper-pagination-bullet {
    opacity: 1;
    width: 12px;
    height: 12px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: 0 0;
    border: 2px solid #e1b474;
    margin: 0 10px;
}

.wrapper4 .inner .swiper-container .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: #e1b474;
}

#fixedNav {
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20240719_woool/right_nav.png?v=2024-06-27-14-17-06-718);
    height: 500px;
    width: 310px;
    right: 0;
    top: 50%;
    z-index: 5;
    margin-top: -155px;
    position: fixed;
    -webkit-transition: .3s;
    -o-transition: .3s;
    -moz-transition: .3s;
    transition: .3s;
    font-size: 16px;
}

#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 {
    position: absolute;
    z-index: 2;
    left: 73px;
    top:50px;
}

#fixedNav ul li {
    width: 182px;
    height: 44px;
    cursor: pointer;
    margin-bottom: 25px;
}
.mask{
    position:absolute;
    width:100%;
    height:100%;
    left:0;
    top:-10px;
    z-index:9;
    display: none;
}
.mask.show{
    display: block;
}
.mask .btn{
    position:absolute;
    width:.32rem;
    height:.58rem;
    top:50%;
    margin-top:-.29rem;
    cursor:pointer;
    z-index:3
}
.mask .btn.btn-close{
    width:.6rem;
    height:.6rem;
    right:.4rem;
    top:0;
    margin-top:0;
    color: aliceblue;
}
.mask .video-container{
    display:-webkit-box;
    display:-webkit-flex;
    display:-moz-box;
    display:-ms-flexbox;
    display:flex;
    width:100%;
    height:100%;
    position:relative;
    -webkit-box-pack:center;
    -webkit-justify-content:center;
    -moz-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-align:center;
    -webkit-align-items:center;
    -moz-box-align:center;
    -ms-flex-align:center;
    align-items:center
}


@keyframes zoomInOut {
    0%, 100% {

        transform: scale(1);
    }
 
    50% {

        transform: scale(1.1);
    }
}
@-webkit-keyframes zoomInOut {
    0%, 100% {

        transform: scale(1);
    }
 
    50% {

        transform: scale(1.1);
    }
}