.line_swiper { width: 100%; } .xiaa { height: 11.22rem; position: relative; z-index: 9; } .map { position: absolute; z-index: 999; top: -0.87rem; } .map img { width: 13.81rem; display: block; height: 11.27rem; } #main .banner .swiper-container .banner_txt{ position: absolute; right: 1.65rem; bottom: 1.32rem; color: #fff; text-align: right; } #main .banner .swiper-container .banner_txt h6{ font-size: 0.36rem; letter-spacing: 0.015rem; margin-right: 45px; margin-bottom: 4px; } #main .banner .swiper-container .banner_txt .eng{ font-size: 0.42rem; line-height: 0.60rem; letter-spacing: 0.023rem; font-family: "GothamBold", PingFangSCR, PingFangSC-Light, PingFangSC-Regular, "SourceHanSansCN", sans-serif; text-transform: uppercase; font-weight:500; } #main .banner .banner-box .img { width: 100%; height: 100%; position: relative; } #main .banner .banner-box .img li { position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: none; } #main .banner .banner-box .img li img { display: block; max-width: 100%; } #main .banner .banner_b { background-color: #fff; position: relative; } #main .banner .banner_b .w1780 { height: .9rem; position: relative; } #main .banner .banner_b .w1780 .btn { position: absolute; right: 0; width: 1.8rem; height: 100%; } #main .banner .banner_b .w1780 .btn .but { width: 50%; line-height: .9rem; height: .9rem; cursor: pointer; text-align: center; float: left; color: #3a773f; background-color: #f4f3f0; outline: none; } #main .banner .banner_b .w1780 .btn .but-right { width: 50%; line-height: .9rem; height: .9rem; cursor: pointer; text-align: center; float: left; color: #3a773f; background-color: rgba(255, 255, 255, 0); } #main .banner .banner_b .w1780 .btn .but .iconfont { font-size: 0.16rem; } #main .banner .banner_b .w1780 .btn .but:hover { background-color: #3a773f; transition: all 0.3s ease-out; } #main .banner .banner_b .w1780 .btn .but:hover .iconfont { color: #fff; transition: all 0.3s ease-out; } .jion_btn:hover{ cursor:pointer; } .jion_btn a { display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; } #main .banner .banner_b .w1780 .btn .but i { font-size: .24rem; } #main .banner .banner_b .w1780 .banner_l { margin-right: 35.05%; position: relative; height: 100%; left: -.7rem; } #main .banner .banner_b .w1780 .banner_l .page_cur { position: absolute; right: -.8rem; top: 50%; margin-top: -.16rem; font-size: .16rem; } #main .banner .banner_b .w1780 .banner_l .page_cur span { font-family: GothamLight; font-size: .14rem; } #main .banner .banner_b .w1780 .banner_l .page_cur span.banner_cur { position: relative; top: -.08rem; font-size: .16rem; font-family: "GothamBold", PingFangSCR, PingFangSC-Light, PingFangSC-Regular, "SourceHanSansCN", sans-serif; } #main .banner .banner_b .w1780 .banner_l .bar_div { position: absolute; left: 0; top: 50%; height: 1px; width: 100%; background-color: #dddddd; } #main .banner .banner_b .w1780 .banner_l .bar_div .bar { position: absolute; left: 0; top: -1px; height: 2px; background-color: #3a773f; } #main .product { color: #233b34; z-index: 999999; position: relative; } #main .product .title { position: absolute; left: 9%; top: 16.29%; width: 3.73rem; } #main .product .title h4 { font-size: 0.70rem; line-height: 1.3; font-family: "GothamBold", PingFangSCR, PingFangSC-Light, PingFangSC-Regular, "SourceHanSansCN", sans-serif; text-align: right; } #main .product .title p { font-size: 0.36rem; line-height: 2; text-align: right; } #main .product .down .title h4 { text-align: left; color: #ffffff; } #main .product .down .title p { text-align: left; color: #ffffff; } #main .product .description { position: absolute; width: 3.40rem; right: 10.41%; bottom: 13.14%; } #main .product .description .eng_p { font-size: 0.30rem; line-height: 1.2; font-family: "GothamBold", PingFangSCR, PingFangSC-Light, PingFangSC-Regular, "SourceHanSansCN", sans-serif; margin-bottom: 0.17rem; } #main .product .description h5 { font-weight: normal; font-size: 0.24rem; line-height: 1.5; margin-bottom: 0.40rem; } #main .product .description .zh_p { font-size: 0.16rem; line-height: 1.875; margin-bottom: 0.48rem; color: #333333; font-weight: lighter; width: 2.79rem; } #main .product .description .more { width: 2.34rem; height: 0.80rem; } #main .product .description .more span.icon { float: left; width: 0.80rem; height: 100%; text-align: center; background-color: #3a773f; line-height: 0.80rem; } #main .product .description .more span.icon i { font-size: 0.20rem; vertical-align: middle; color: #fff; } #main .product .description .more div { margin-left: 0.80rem; text-align: center; line-height: 0.80rem; color: #333333; background-color: #fff; position: relative; } #main .product .description .more div span { position: relative; z-index: 2; transition: width 0.3s ease-out; display: block; } #main .product .description .more div i { position: absolute; width: 0; z-index: 0; height: 100%; left: 0; top: 0; transition: width 0.3s ease-out; background-color: #3a773f; } #main .product .description .more:hover div i { width: 100%; } #main .product .description .more:hover div span { color: #fff; } #main .product .covered { position: relative; height: 100vh; background: center no-repeat; background-size: cover; } #main .product .changeable { position: relative; z-index: 2; overflow: hidden; background: url(../static/images/132048806292017327.jpg); border: none !important; } #main .product .changeable_div { height: 100vh; background: center no-repeat; background-size: cover; position: relative; width: 19.20rem; } #main .product .changeable_div > a, #main .product .down > a{ position: relative; width: 100%; height: 100%; display: block; } #main .product .down { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 1; } #main .product .down .title { left: auto; top: auto; right: 10.41%; bottom: 13.14%; } #main .product .down .description { bottom: 1.46rem; left: 1.7rem; } #main .product .handle { position: absolute; width: 70px; height: 70px; margin-left: -35px; margin-top: -35px; border-radius: 50%; background-color: #fff; text-align: center; z-index: 3; line-height: 70px; color: #fdfaf8; background-color: #233b34; } #main .product .handle span { display: block; } #main .product .handle i { position: absolute; left: 0; transition: left 0.3s ease-out, right 0.3s ease-out; top: 50%; transform: translateY(-50%); color: #233b34; } #main .product .handle i.icon-gengduo { left: auto; right: 0; } #main .product .handle:hover i { left: -0.32rem; } #main .product .handle:hover i.icon-gengduo { left: auto; right: -0.32rem; } #main .media { height: 100vh; box-sizing: border-box; padding-top: 10.37%; position: relative; } #main .media .w1780 { position: relative; height: 100%; margin-top: 1.13rem; } #main .media .w1780 .media_con { position: absolute; bottom: 0; left: 0; /* top: 0; */ width: 100%; } #main .media .media_t { position: relative; z-index: 2; } #main .media .media_t .title { position: absolute; left: 77.16%; width: 2.95rem; } #main .media .media_t .title .eng { font-size: 0.70rem; line-height: 1.2; font-family: "GothamBold", PingFangSCR, PingFangSC-Light, PingFangSC-Regular, "SourceHanSansCN", sans-serif; color: #3a773f; text-transform: Uppercase; margin-top: 1.2rem; } #main .media .media_t .title .zh { font-size: 0.36rem; color: #233b34; text-align: right; } #main .media .media_t .title .more{ float: right; font-size: .36rem; color: #3a773f; margin-top: .2rem; } #main .media .media_t .media_t_sw { position: relative; width: 65.16%; margin-left: .8rem; padding: 0.43264rem 8.65% 0.43264rem 0; } #main .media .media_t .media_t_sw .swiper-slide { box-shadow: 0.16672rem 0.17264rem 0.26rem 0px rgba(20, 36, 48, 0.55); } #main .media .media_t .media_t_sw .swiper-slide img { display: block; max-width: 100%; } #main .media .media_t .media_btn_div { position: relative; right: 0; bottom: 0; } .media_next{ left:12.5rem!important; } #main .media .media_t .media_btn_div .media_btn { float: left; cursor: pointer; width: 1.10rem; height: 1.10rem; text-align: center; line-height: 1.10rem; color: #3a773f; background-color: #f4f3f0; transition: all 0.3s ease-out; outline: none; position: absolute; left: -.5rem; top: -3.5rem; z-index: 999; } #main .media .media_t .media_btn_div .media_btn i { font-size: 16px; } #main .media .media_t .media_btn_div .media_btn:hover { background-color: #3a773f; color: #fff; } #main .media .media_b { padding-top: 2.13264rem; padding-bottom: 7.1875%; margin-top: -1.1rem; bottom: 0; position: relative; width: 100%; } #main .media .media_b .media_b_sw { width: 65.28%; padding-right: 34.7%; margin: 0; box-sizing: initial; z-index: 3; } #main .media .media_b .media_b_sw .swiper-slide { margin: 0; padding: 0 6%; } #main .media .media_b .media_b_sw .swiper-slide .media_txt { width: 50%; } #main .media .media_b .media_b_sw .swiper-slide .media_txt .time { margin-bottom: 18px; margin-bottom: 0.18rem; font-size: 0.30rem; color: #807f85; } #main .media .media_b .media_b_sw .swiper-slide .media_txt a { display: block; } #main .media .media_b .media_b_sw .swiper-slide .media_txt .time span { margin-right: 15px; font-family: "GothamBold", PingFangSCR, PingFangSC-Light, PingFangSC-Regular, "SourceHanSansCN", sans-serif; } #main .media .media_b .media_b_sw .swiper-slide .media_txt h2 { font-size: 0.28rem; color: #807f85; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #main .media .media_b .media_b_sw .swiper-slide.swiper-slide-active .media_txt h2 { white-space: inherit; } #main .media .media_b .media_b_sw .swiper-slide.swiper-slide-active .media_txt { width: 100%; } #main .media .media_b .media_b_sw .swiper-slide.swiper-slide-active .media_txt .time { color: #3a773f; } #main .media .media_b .media_b_sw .swiper-slide.swiper-slide-active .media_txt h2 { color: #233b34; } #main .media .media_b:after { content: ''; position: absolute; right: 0; top: 0; width: 34.7%; height: 100%; background-color: #fbfbfa; z-index: 0; } .honor { background: url("/img/shoulun01.png"); background-size: 100% 100%; position: relative; z-index: 99; } .honor_t { padding-top: 1.8rem; position: relative; z-index: 10; } .honor_t p:first-child { font-family: "GothamBold", PingFangSCR, PingFangSC-Light, PingFangSC-Regular, "SourceHanSansCN", sans-serif; font-size: .7rem; color: #fff; text-align: center; letter-spacing: .1rem; } .honor_t p:nth-child(2) { font-size: .36rem; font-weight: 200; color: #f4f3f0; text-align: center; letter-spacing: 1px; } .honor_t p:nth-child(3) { font-size: .18rem; color: #d4d3d1; text-align: center; letter-spacing: 1px; margin-top: .5rem; margin-bottom: .15rem; } .honor_t p:nth-child(4) { font-size: .18rem; color: #d4d3d1; text-align: center; letter-spacing: 1px; } .green_bg { background-color: #224f25; position: absolute; top: 6.88rem; height: 7.31rem; z-index: 1; /* left:0.41rem; */ width: 12.31rem; } .green_bg img { width: 100%; position: absolute; left: 0.41rem; display: block; } .bot_bg { height: 6.35rem; position: relative; background-color: rgb(239, 238, 236); } .lianjie ul { padding: 0 .4rem; height: 100%; display: flex; margin: auto; position: absolute; top: 0; bottom: 0; right: 0; left: 0; justify-content: center; align-items: center; background-color: rgb(239, 238, 236); } .lianjie ul img { height: .94rem; margin: 0 .15rem; } .lianjie ul img.conimg { display: none; } .jion_guild { height: 4.81rem; padding-left: 1.55rem; position: absolute; top: 9.21rem; } .jion_guild img { font-size: 0.5rem; line-height: 0.80rem; color: #fff; height: 1.31rem; position: relative; z-index: 9999; } .jion_guild h3, .sale h3 { color: #f4f3f0; margin-top: 0.51rem; margin-bottom: 0.175rem; font-size: 0.33rem; line-height: 0.33rem; position: relative; z-index: 9999; } .jion_guild p, .sale p { font-size: 0.17rem; line-height: 0.3rem; color: #f4f3f0; position: relative; z-index: 9999; } .jion_btn { width: 1.69rem; height: 0.8rem; position: absolute; top: 13.39rem; color: #333333; display: flex; justify-content: center; align-items: center; left: 10.78rem; z-index: 9999; background: #fff; font-size: 0.17rem; transition:1s all; } .jion_btn p { margin-right: .06rem; } .jion_btn i { font-weight: bold; color: #3a773f; } .sale { height: 7.78rem; position: absolute; top: 3.47rem; right: 1.34rem; } .sale img { width: 100%; display: block; } .sale h3, .sale p { text-align: right; color: #233b34; } .sale p { color: #233b34; padding-left: .8rem; } .honor_banner .honor_swiper { padding-top: 1.52rem; margin: 0 4.29rem; display: flex; overflow: hidden; position: relative; justify-content: space-between; align-items: center; /*height: 2.12rem;*/ /* background-color: yellow; */ } .honor_banner .honor_swiper .swiper-slide { width: 2.23rem; height: 100%; text-align: center; padding: 0 0.55rem; overflow: hidden; /*display: flex; justify-content: center; align-items: center; flex-direction: column;*/ transform: scale(0.8); transition: transform 0.3s ease-out; } .honor_banner .honor_swiper .swiper-slide .images { position: relative; } .honor_banner .honor_swiper .swiper-slide .images .images_pos { position: absolute; width: 100%; text-align: center; left: 0; top: 0; } .honor_banner .honor_swiper .swiper-slide .images .images_pos img { opacity: 0; } .honor_banner .honor_swiper .swiper-slide { opacity: .3; } .honor_banner .honor_swiper .swiper-slide.swiper-slide-active { transform: scale(1); opacity: 1; } .honor_banner .honor_swiper .swiper-slide.swiper-slide-active .images .images_pos img { opacity: 1; display: inline-block; } .honor_banner .honor_swiper .swiper-slide.swiper-slide-active img.images_por { opacity: 0; } .honor_banner { position: relative; z-index: 10; } #honor_banner_btn1, #honor_banner_btn2 { width: 1.1rem; height: 1.1rem; background-color: #cf9200; display: flex; justify-content: center; align-items: center; position: absolute; left: 3.19rem; top: 1.47rem; opacity: 0.5; cursor: pointer; outline: none; } #honor_banner_btn1:hover, #honor_banner_btn2:hover { opacity: 1; } #honor_banner_btn2 { left: auto; right: 3.19rem; } .honor_banner .honor_swiper .swiper-slide h3 { font-size: 0.24rem; line-height: 0.18rem; margin-top: 0.28rem; margin-bottom: 0.2rem; color: #e9e8e6; opacity: 0; line-height: 1.5; } .honor_banner .honor_swiper .swiper-slide p { font-size: 0.18rem; line-height: 0.28rem; text-align: center; color: #fff; opacity: 0; } .honor_banner .honor_swiper .swiper-slide.swiper-slide-active h3, .honor_banner .honor_swiper .swiper-slide.swiper-slide-active p { opacity: 1; } .gongtong img { width: .36rem; cursor: pointer; } #map_traiangle8 { top: 8.6rem; left: 9.9rem; position: absolute; z-index: 9999; } #map_traiangle7 { top: 4.11rem; left: 7.27rem; position: absolute; z-index: 9999; } #map_traiangle6 { top: 4.75rem; left: 7.95rem; position: absolute; z-index: 9999; } #map_traiangle5 { top: 5.77rem; left: 10.6rem; position: absolute; z-index: 9999; } #map_traiangle4 { top: 6.13rem; left: 10.11rem; position: absolute; z-index: 9999; } #map_traiangle3 { top: 6.81rem; left: 10.52rem; position: absolute; z-index: 9999; } #map_traiangle2 { top: 8.46rem; left: 8.78rem; position: absolute; z-index: 9999; } #map_traiangle1 { top: 3.13rem; left: 9.75rem; position: absolute; z-index: 9999; } #triangle_word1, #triangle_word2, #triangle_word3, #triangle_word4, #triangle_word5, #triangle_word6, #triangle_word7, #triangle_word8 { display: flex; flex-direction: column; justify-content: space-between; color: #3a773f; position: absolute; bottom: .4rem; transition: 1.4s; } #triangle_word4 { right: 0; text-align: right; } #footer { box-sizing: border-box; background-color: #323338; color: #fff; } #footer .foot { padding-bottom: 24px; } #footer .foot .foot_t { padding: 4.01% 0 1.302%; border-bottom: 1px solid #515156; margin-bottom: 26px; } #footer .foot .foot_t .fr { padding-top: 26px; } #footer .foot .foot_t .fr a { color: #fff; font-size: 16px; margin-left: .68rem; } #footer .foot .foot_t .fr a:first-child { margin-left: 0; } #footer .foot .foot_b { color: rgba(255, 255, 255, 0.4); } #footer .foot .foot_b .fl { width: 840px; } #footer .foot .foot_b .fl ul li { float: left; width: 40%; margin-bottom: 14px; white-space: nowrap; } #footer .foot .foot_b .fr { padding-right: 7px; } #footer .foot .foot_b .fr .erweima { display: inline-block; text-align: center; margin-left: 40px; } #footer .foot .foot_b .fr .erweima:first-child { margin-left: 0; } #footer .foot .foot_b .fr .erweima img { display: block; margin-bottom: 30px; } #footer .foot .foot_b .fr .erweima p { font-size: 14px; color: #fff; } #footer .footer_b { font-size: 14px; line-height: 90px; background-color: #28292e; color: rgba(255, 255, 255, 0.4); text-align: center; } .line_mid { width: 100%; /* height: 0.12rem; */ display: flex; align-items: center; padding-left: 2.8rem; margin-top: .5rem; overflow: hidden; position: relative; padding-bottom: .5rem; } .line_mid .swiper-slide { letter-spacing: -7px; width: 3.10rem; padding: 0; height: auto; text-align: left; line-height: 0.5rem; } .line_mid .swiper-slide .yuan { letter-spacing: 0; display: inline-block; vertical-align: middle; margin-right: 0.06rem; width: 27%; text-align: center; margin-left:-0.2rem; } .line_mid .swiper-slide .yuan i { display: inline-block; font-style: normal; font-size: 0px; width: 0.12rem; height: 0.12rem; border-radius: 50%; border: 0.02rem solid #fff; vertical-align: middle; transition: all 0.3s ease-out; color: #fff; } .line_mid .swiper-slide.swiper-slide-active .yuan i { width: auto; border: none; height: auto; font-size: 0.3rem; font-family: "GothamBold", PingFangSCR, PingFangSC-Light, PingFangSC-Regular, "SourceHanSansCN", sans-serif; } .line_mid .swiper-slide:first-child .line_l { opacity: 0; } .line_mid .swiper-slide:last-child .line { opacity: 0; } .line_mid .swiper-slide .line_l { /* width: 11%; */ border-top: 1px solid #fff; opacity: 0.25; display: inline-block; vertical-align: middle; } .line_mid .swiper-slide .line { width: 62%; border-top: 1px solid #fff; opacity: 0.25; display: inline-block; vertical-align: middle; } .swiper-pagination-progressbar-fill { background: #3a773f !important; } .map_cls { opacity: 0; } .video-mask { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: #212121; opacity: .7; z-index: 2; } .video-honer { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; object-fit: cover; } .video-index { width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 999999998; object-fit: cover; display:none; } #animation_container{ width:1920px; height: 1080px; overflow: hidden; -webkit-transform-origin: top left;-moz-transform-origin: top left;-ms-transform-origin: top left; -o-transform-origin: top left;transform-origin: top left; } .video-hide { text-align: center; line-height: .5rem; color: #3a773f; font-size: .18rem; padding: 0 .2rem; position: fixed; right: .4rem; bottom: .4rem; z-index: 9999999999; border-radius: .3rem; background: rgba(255, 255, 255, .6); cursor: pointer; /*display:none;*/ z-index:9999999999999999 } .video-hide:hover { background: #3a773f; color: #fff; }