/* banner */ .banner { width: 100%; height: 7.05rem; position: fixed; overflow: hidden; /* z-index: -1; */ } .banner_bot { width: 100%; height: 7.05rem; } .banner .swiper { --swiper-theme-color: #f33a2f; /* 设置swiper风格 */ --swiper-navigation-color: #fff; /* 单独设置按钮颜色 */ --swiper-navigation-size: 0.22rem; /* 设置按钮大小 */ width: 100%; height: 7.05rem; position: relative; z-index: 1; } .banner .swiper .swiper-slide { width: 100%; overflow: hidden; } .swiper .swiper_img { width: 100%; height: 100%; position: relative; overflow: hidden; } .banner .swiper .swiper_img>img { /* width: 100%; */ height: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover; position: absolute; top: 0; left: -1000px; right: -1000px; margin: auto; backface-visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; } .swiper video { position: relative; height: calc(100 vh - var(--browser-address-bar, 0px)); object-fit: cover; object-position: 50% 50%; width: 100%; z-index: -1; } .banner .swiper-button-next { position: absolute; right: 0.4rem; } .banner .swiper-button-prev { position: absolute; left: 0.4rem; } .swiper-horizontal .swiper-pagination { width: 0.94rem; height: 0.015rem; margin-top: 5.76rem; margin-left: 1.95rem; background-color: #fff; } .swiper-slide { position: relative; } .banner .swiper_text, .banner .swiper_textone { /* width: 4rem; */ position: absolute; z-index: 1; top: 1.42rem; left: 1.95rem; } .banner .swiper_textone { top: 2rem; } .banner .swiper_text>h1, .banner .swiper_textone>h1 { width: 4rem; height: 0.4rem; font-size: 0.465rem; font-weight: bold; color: #ffffff; line-height: 0.5rem; } .banner .swiper_textone>h1 { margin-bottom: 0.1rem; } .banner .swiper_textone>p { /* width: 2.295rem; */ height: 0.4rem; font-size: 0.465rem; font-weight: bold; color: #ffffff; line-height: 0.5rem; } .banner .swiper_text>.english { width: 4rem; height: 0.27rem; font-size: 0.36rem; font-family: arial; font-weight: bold; color: rgba(255, 255, 255, 0.5); line-height: 0.25rem; padding: 0.2rem 0; border-bottom: 1px solid rgba(255, 255, 255, 0.5); } .banner .swiper_text>.intro { width: 4rem; font-size: 0.13rem; font-weight: 400; color: #ffffff; line-height: 0.25rem; margin: 0.2rem 0; margin-bottom: 0rem; } .banner>.more { position: absolute; z-index: 1; bottom: 0.4rem; left: 50%; transform: translatex(-50%); width: 1.5rem; height: 0.97rem; text-align: center; } .banner>.more>li:nth-child(1) { width: 100%; height: 0.1rem; font-size: 0.1rem; font-weight: bold; color: #ffffff; } .banner>.more>li:nth-child(2) { width: 0.15rem; height: 0.25rem; margin: 0.2rem auto; margin-bottom: 0rem; background: url(/uploads/image/simg/bannericon.png) no-repeat; background-size: 100% 100%; } .banner>.more>li:nth-child(3) { width: 0.11rem; height: 0.06rem; margin: 0.05rem auto; margin-bottom: 0rem; background: url(/uploads/image/simg/bannerarrow.png) no-repeat; background-size: 100% 100%; animation: arrow 2s 0s linear infinite; } .banner>.more>li:nth-child(4) { width: 0.11rem; height: 0.06rem; margin: 0.05rem auto; margin-bottom: 0rem; background: url(/uploads/image/simg/bannerarrow.png) no-repeat; background-size: 100% 100%; animation: arrow 2s 0.6s linear infinite; } .banner>.more>li:nth-child(5) { width: 0.11rem; height: 0.06rem; margin: 0.05rem auto; margin-bottom: 0rem; background: url(/uploads/image/simg/bannerarrow.png) no-repeat; background-size: 100% 100%; animation: arrow 2s 1.2s linear infinite; } @keyframes arrow { from { opacity: 1; } to { opacity: 0; } } /* news */ article { width: 100%; background: url(/uploads/image/simg/newsback.png) no-repeat; background-size: cover; overflow: hidden; background-color: #fff; position: relative; z-index: 1; } article>.news { width: 10.5rem; margin: 0 auto; } article .news_top { width: 100%; height: 1.32rem; padding-top: 0.63rem; padding-bottom: 0.37rem; box-sizing: border-box; } article .news_top>div:first-of-type { width: 3rem; font-size: 0.18rem; font-family: arial; font-weight: bold; color: #a8a8a8; line-height: 0.6rem; } article .news_top>div:first-of-type h2 { font-size: 0.36rem; font-weight: 400; color: #333333; line-height: 0.25rem; } article .news_top>div:first-of-type .red_ { width: 0.0375rem; height: 0.135rem; margin: 0rem 0.1rem 0.05rem; height: 0.15rem; } article .news_top>div:first-of-type h2, article .news_top>div:first-of-type span, article .news_top>div:first-of-type, article .news_top>div:last-of-type { display: inline-block; } article .news_top>div:last-of-type { float: right; width: 1.5rem; height: 0.375rem; text-align: center; line-height: 0.375rem; color: #fff; font-size: 0.12rem; border: 1px solid #ea222d; cursor: pointer; position: relative; z-index: 1; transition: all 0.5s; } article .news_top>div:last-of-type>span { display: block; width: 100%; height: 100%; background: #ea222d; position: absolute; top: 0; left: 0; z-index: -1; transition: all 0.5s; } article .news_top>div:last-of-type:hover { color: #ea222d; } article .news_top>div:last-of-type:hover span { height: 0; } article .news_main { width: 100%; height: 5.5rem; display: flex; justify-content: space-between; } article .news_main .news_mainleft, article .news_main .news_mainright { width: 47%; height: 100%; position: relative; } article .news_mainleft .newsswiper { width: 100%; height: 100%; } article .news_mainleft .swiper_img { width: 100%; height: 3.07rem; } article .news_mainleft img { width: 100%; } article .news_mainleft .swiper_text { position: absolute; top: 3.3rem; left: 0; width: 100%; } article .news_mainleft .swiper_text>.title { height: 0.25rem; font-size: 0.15rem; font-weight: 400; color: #333333; line-height: 0.25rem; overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; transition: 0.5s; border: none; } article .news_mainleft .swiper_text div { height: 0.25rem; font-size: 0.12rem; font-weight: 400; color: #a8a8a8; line-height: 0.25rem; margin: 0.1rem 0rem; } article .news_mainleft .swiper_text div>span { display: inline-block; width: 0.1rem; height: 0.1rem; background: url(/uploads/image/simg/newsicon.png) no-repeat; background-size: 100% 100%; margin-right: 0.1rem; } article .news_mainleft .swiper_text .content { width: 100%; font-size: 0.12rem; font-weight: 400; color: #a8a8a8; line-height: 0.25rem; border: none; overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; transition: 0.5s; } article .news_mainright li { width: 100%; border-bottom: 1px solid #e0e0e0; padding: 0.27rem 0rem; display: flex; cursor: pointer; transition: all 0.5s; } article .news_mainright li:first-of-type { padding-top: 0rem; } article .news_mainright li:last-of-type { border-bottom: none; } article .news_mainright li .img { width: 1.2rem; height: 0.73rem; overflow: hidden; flex-shrink: 0; } article .news_mainright li .img img { width: 100%; transition: all 0.5s; } article .news_mainright li>.right>p:hover { color: #a8a8a8; transition: all 0.5s; } article .news_mainright li>.right { padding-left: 0.2rem; } article .news_mainright li>.right>p { font-size: 0.15rem; font-weight: 400; color: #333333; line-height: 0.25rem; overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; transition: 0.5s; } article .news_mainright li>.right>div { height: 0.25rem; font-size: 0.12rem; font-weight: 400; color: #a8a8a8; line-height: 0.25rem; } article .news_mainright li>.right>div>span { display: inline-block; width: 0.1rem; height: 0.1rem; background: url(/uploads/image/simg/newsicon.png) no-repeat; background-size: 100% 100%; margin-right: 0.1rem; } article .news_mainright li:hover { transform: scale(1.1) } article .news_mainright li:hover img { transform: scale(1.1) } .sfq { width: 100%; height: 7.05rem; display: flex; justify-content: space-between; overflow: hidden; background-color: #fff; position: relative; z-index: 1; } .sfq>div { width: 25%; position: relative; overflow: hidden; /* transition: width .3s ease 0s; */ } .sfq>.active .sfq_defalt { background-color: rgba(234,34,45, 0.9); } .sfq>div img { height: 100%; position: absolute; top: 0; left: -400px; right: -400px; margin: auto; } .sfq>div:first-of-type { width: 50%; } .sfq>div>div, .sfq>div>ul { width: 100%; height: 100%; position: absolute; top: 0; background-color: rgba(0, 0, 0, 0.4); color: #fff; display: flex; flex-direction: column; justify-content: center; align-items: center; transition: all 0.5s; } .sfq>div>ul { background-color: rgba(0, 0, 0, 0); } .sfq>div>ul>li { opacity: 0; transition: opacity 1s; } .sfq>.box1>ul:nth-of-type(1)>li { opacity: 1; } .sfq>.box1>div:nth-of-type(1)>span { opacity: 0; } .sfq>div>div>span { display: block; transition: all 1s; } .sfq>div>div>span:nth-of-type(1) { margin-top: 2rem; width: 0.45rem; height: 0.45rem; background: url(/uploads/image/simg/sfq1icon.png) no-repeat; background-size: 100% 100%; } .sfq>div>div>span:nth-of-type(2) { margin-top: 0.5rem; font-size: 0.4rem; font-weight: bold; color: #ffffff; position: relative; } .sfq>div>div>span:nth-of-type(3) { width: 0.05rem; height: 0.15rem; margin-top: 0.1rem; position: relative; } .sfq>div>div>span:nth-of-type(4) { font-size: 0.18rem; font-family: arial; font-weight: bold; color: #ffffff; opacity: 0.2; margin-top: 1rem; position: relative; } .sfq>div:nth-of-type(2)>div>span:nth-of-type(1) { background: url(/uploads/image/simg/sfq2icon.png) no-repeat; background-size: 100% 100%; } .sfq>div:nth-of-type(3)>div>span:nth-of-type(1) { background: url(/uploads/image/simg/sfq3icon.png) no-repeat; background-size: 100% 100%; } .sfq>div>ul>li:nth-of-type(1) { font-size: 0.4rem; font-weight: bold; color: #ffffff; margin-top: 1rem; } .sfq>div>ul>li:nth-of-type(2) { width: 1rem; height: 0.15rem; margin: 0.2rem; background: url(/uploads/image/simg/sfq_line.png) 0rem 0rem no-repeat; background-size: 100% 100%; } .sfq>div>ul>li:nth-of-type(3) { font-size: 0.13rem; font-weight: 400; color: #ffffff; } .sfq>div>ul>li:nth-of-type(4) { width: 0.48rem; height: 0.48rem; margin: 0.5rem; background: url(/uploads/image/simg/sfq1icon2.png) 0rem 0rem no-repeat; background-size: 100% 100%; } .sfq>.box2>ul>li:nth-of-type(4) { width: 0.48rem; height: 0.48rem; margin: 0.5rem; background: url(/uploads/image/simg/sfq2icon2.png) 0rem 0rem no-repeat; background-size: 100% 100%; } .sfq>.box3>ul>li:nth-of-type(4) { width: 0.48rem; height: 0.48rem; margin: 0.5rem; background: url(/uploads/image/simg/sfq3icon2.png) 0rem 0rem no-repeat; background-size: 100% 100%; } .sfq>div>ul>li:nth-of-type(5) { margin-top: 0.5rem; font-size: 0.13rem; font-weight: 400; color: #ffffff; line-height: 0.5rem; border-bottom: 1px solid #fff; } /* .case { width: 100%; height: 7rem; overflow: hidden; background-color: #fff; position: relative; z-index: 1; background: url(/uploads/image/simg/caseback.png) no-repeat; background-size: 100% 100%; } .case .case_top { width: 100%; height: 1.5rem; padding-top: 0.6375rem; box-sizing: border-box; text-align: center; } .case .case_top>span { font-size: 0.36rem; font-weight: 400; color: #333333; line-height: 0.25rem; } .case .case_top>div { font-size: 0.18rem; font-family: arial; font-weight: bold; color: #a8a8a8; line-height: 0.6rem; } .case .case_top>div .red_ { margin-right: 0.1rem; vertical-align: baseline; } .case .swiper-button-next::after, .case .swiper-button-prev::after { color: #fff; font-size: 0.2rem; font-weight: bold; } .case .left .next, .case .left .prev { position: absolute; left: 50%; transform: translatex(-50%); } .case .left .next { top: 2.5rem; } .case .left .prev { top: 1.7rem; } .case .left { width: 45%; height: 5.4376rem; background-color: #ea222d; position: absolute; top: 1.6rem; right: 0; } .case .left img { width: 100%; height: 100%; } .case .left>span:nth-of-type(1) { display: block; width: 0.2rem; height: 0.05rem; position: absolute; top: 2rem; left: 50%; transform: translatex(-50%); color: #fff; font-weight: bold; font-size: 0.15rem; } .case .left>.page { position: absolute; top: 3rem; left: 50%; transform: translatex(-50%); } .case .left>.page>span:nth-of-type(1) { font-size: 0.39rem; font-family: arial; font-weight: bold; color: #ffffff; } .case .left>.page>span:nth-of-type(2) { font-size: 0.22rem; font-family: arial; font-weight: bold; color: #ffffff; opacity: 0.2; } .case .left>span:nth-of-type(2) { width: 1.4rem; height: 0.01rem; background: url(/uploads/image/simg/casebot.png) no-repeat; background-size: 100% 100%; position: absolute; top: 3.6rem; left: 50%; transform: translatex(-50%); } .case .left>.arrow_left { width: 100%; height: 2.25rem; position: absolute; bottom: 0; display: flex; overflow: hidden; } .case .left>.arrow_left>li { width: 1.71rem; height: 2.25rem; background: url(/uploads/image/simg/casearrowright.png) no-repeat; background-size: 100% 100%; flex-shrink: 0; opacity: 0; } */ .img-top { width: 100%; height: 6.0001rem; background-color: #fff; overflow: hidden; position: relative; z-index: 6; } .img-top .swiper1 { width: 100%; height: 100%; } .img-top .swiper1 .swiper-img { width: 100%; height: 100%; position: relative; overflow: hidden; } .img-top .swiper1 .swiper-img img { margin: auto; width: 100%; position: absolute; top: 0; left: -400px; right: -400px; } .img-top .swiper1 .swiper-img .text { color: #fff; position: absolute; left: 2rem; top: 3rem; } .img-top .swiper1 .swiper-img .text .name { font-size: 0.25rem; line-height: 0.25rem; } .img-top .swiper1 .swiper-img .text .bot-text { margin-top: 0.2rem; font-size: 0.15rem; line-height: 0.15rem; opacity: 0.5; } .img-top .swiper1 .prev1, .img-top .swiper1 .next1 { width: 0.5rem; height: 0.5rem; background-color: rgba(255, 255, 255, 0.2); box-shadow: 0px 0px 21px 0px rgba(0, 0, 0, 0.1); border-radius: 50%; color: #fff; transition: all 0.5s; } .img-top .swiper1 .prev1:hover, .img-top .swiper1 .next1:hover { background-color: #ffffff; color: #e84127; } .img-top .swiper1 .prev1::after, .img-top .swiper1 .next1::after { font-size: 0.165rem; } .img-top .swiper1 .btns { width: 1.3rem; position: absolute; bottom: 1.5rem; left: 1.9rem; } .img-top .img-text { position: absolute; z-index: 5; top: 0.5rem; left: 50%; transform: translatex(-50%); } .img-top .img-text .title { padding-left: 0.15rem; height: 0.3rem; border-left: 0.045rem solid #ea222d; font-size: 0.315rem; line-height: 0.315rem; font-weight: bold; color: #fff; } .video-box { width: 100%; height: 5.1rem; position: relative; background-size: auto 100%; background-repeat: no-repeat; background-position: top right; } .video-box .video-bg { width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: -1000; } .video-box .video-bg video { position: fixed; height: calc(100vh - var(--browser-address-bar, 0px)); object-fit: cover; object-position: 50% 50%; width: 100%; z-index: -1000; } .video-box .video-bg img { position: absolute; height: 100%; top: 0; left: -1000px; right: -1000px; margin: auto; display: none; } .video-box .play { width: 0.72rem; height: 0.72rem; position: absolute; top: calc(50% - 0.36rem); left: 3.675rem; cursor: pointer; } .video-box .play img { width: 100%; position: absolute; top: 0; left: 0; transition: 0.5s; } .video-box .play img.red { opacity: 0; } .video-box .play img.white { opacity: 1; } .video-box .play:hover .red { opacity: 1; } .video-box .play:hover .white { opacity: 0; } .video-box .text { position: absolute; top: 1.7775rem; right: 2.85rem; width: 4.8975rem; } .video-box .text img { width: 100%; } .popups { width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.9); position: fixed; top: 0; left: 0; z-index: 1000000000; display: none; } .popups .close { width: 50px; height: 50px; background-color: white; position: absolute; top: 20px; right: 20px; border-radius: 50%; cursor: pointer; } .popups .close img { width: 20px; height: 20px; display: block; margin: 0 auto; margin-top: 15px; } .popups .video { width: 70%; height: 60vh; margin: 0 auto; margin-top: 20vh; position: relative; } .popups .video p { width: 100%; height: 100%; } .popups .video video { width: 100%; height: 100%; } .popups .video .videobg { position: absolute; width: 100%; height: 100%; overflow: hidden; top: 0px; left: 0px; } .popups .video .videobtn { position: absolute; width: 75px; height: 75px; top: 50%; left: 50%; margin-top: -37px; margin-left: -37px; cursor: pointer; overflow: hidden; } /* @keyframes leftarrow { 0% { transform: translatex(0rem); } 100% { transform: translatex(-7rem); } } @keyframes rightarrow { 0% { transform: translatex(-7rem); } 100% { transform: translatex(0rem); } } .case .left>.arrow_right { width: 100%; height: 2.25rem; position: absolute; top: 0; display: flex; overflow: hidden; } .case .left>.arrow_right>li { width: 1.71rem; height: 2.25rem; transform: translatex(-7rem); background: url(/uploads/image/simg/casearrowleft.png) no-repeat; background-size: 100% 100%; flex-shrink: 0; opacity: 0; } .case .caseswiper { width: 6rem; height: 4.5rem; box-shadow: 0px 5px 15px 0px rgb(0 0 0 / 7%); margin-top: 0.4rem; box-sizing: border-box; position: relative; left: 20%; } .case .case_swiper { width:100%; height: 100%; } .case .caseswiper_div { width: 6rem; height: 4.5rem; background-color: #fff; overflow: hidden; } .case .caseswiper_div>.divtop { width: 100%; height: 3.8rem; overflow: hidden; position: relative; } .case .caseswiper_div>.divtop>img { margin: 0 auto; height: 100%; position: absolute; left: -500px; right: -500px; transition: all 1s; } .case .caseswiper_div>.divtop>.title { width: 100%; height: 0.4125rem; position: absolute; bottom: 0; padding-left: 0.3rem; box-sizing: border-box; background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.5)100%); } .case .swiper-slide:hover .caseswiper_div>.divtop img { transform: scale(1.1); } .case .caseswiper_div .title>p { width: 100%; font-size: 0.165rem; font-weight: 400; color: #ffffff; overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } .case .caseswiper_div>ul { width: 90%; padding: 0.25rem 0rem; margin: 0 auto; display: flex; justify-content: space-between; } .case .caseswiper_div>ul>.divleft { font-size: 0.12rem; font-weight: 400; color: #333333; } .case .caseswiper_div>ul>.divleft>span { display: inline-block; vertical-align: middle; margin-right: 0.1rem; margin-top: -0.03rem; width: 0.1275rem; height: 0.1425rem; background: url(/uploads/image/simg/caseadress.png) no-repeat; background-size: contain; } .case .caseswiper_div>ul>.divright { font-size: 0.12rem; font-weight: 400; color: #9a9a9a; } .case .caseswiper_div>ul>.divright>.red_ { width: 0.0375rem; height: 0.135rem; margin-top: -0.02rem; } */ .relax { width: 100%; height: 6rem; overflow: hidden; background-color: #fff; position: relative; background: url(/uploads/image/simg/hillback.jpg) no-repeat; background-size: cover; background-position: left bottom; z-index: 1; } .relax .relax_top { width: 100%; /* height: 2rem; */ margin-top: 0.9rem; text-align: center; position: relative; z-index: 1; } .relax .relax_top>.title { font-size: 0.39rem; font-weight: 400; color: #333333; line-height: 0.39rem; } .relax .relax_top>div { width: 100%; padding-top: 0.225rem; padding-bottom: 0.165rem; box-sizing: border-box; } .relax .relax_top>div>p { font-size: 0.12rem; font-weight: 400; color: #a8a8a8; line-height: 0.24rem; } .relax .relax_top>.red_ { width: 0.0375rem; height: 0.135rem; } .relax .hill { width: 100%; height: 4.07rem; position: relative; z-index: 1; } .relax .hill>ul { width: 100%; height: 100%; padding: 0.7rem 1rem; box-sizing: border-box; display: flex; justify-content: space-evenly; align-items: flex-start; text-align: center; } .relax .hill>ul>li>span:nth-of-type(3), .relax .hill>ul>li>span:nth-of-type(4) { display: block; } .relax .hill>ul>li:nth-of-type(4)>span:nth-of-type(2) { display: none; } .relax .hill>ul>li>span:nth-of-type(2) { font-size: 0.34rem; font-family: arial; font-weight: 900; color: #333333; line-height: 0.81rem; } .relax .hill>ul>li>span:nth-of-type(1) { font-size: 0.34rem; font-family: arial; font-weight: 900; color: #333333; line-height: 0.81rem; } .relax .hill>ul>li>span:nth-of-type(3) { font-size: 0.13rem; font-weight: 400; color: #333333; } .relax .hill>ul>li>span:nth-of-type(4) { font-size: 0.12rem; font-weight: 400; color: #333333; line-height: 0.3rem; } .relax .cloud { width: 100%; height: 100%; position: absolute; top: 0; display: flex; } .relax .cloud>span { width: 100%; height: 100%; display: block; background: url(/uploads/image/simg/cloud.png) 0rem 0rem no-repeat; background-size: 100% 100%; flex-shrink: 0; transform: translatex(-43.2rem); animation: cloud 100s linear infinite; } footer { background-color: #fff; position: relative; z-index: 1; } .sfq_m { display: none; } @keyframes cloud { 0% { transform: translatex(0); } 100% { transform: translatex(-43.2rem); } } @media screen and (max-width:1024px) { .banner, .banner_bot, .banner .myswiper { height: 100vh; } .banner video { position: relative; height: calc(100 vh - var(--browser-address-bar, 0px)); object-fit: cover; object-position: 50% 50%; height: 100%; z-index: -1; } article>.news { width: 90%; margin: 0 auto; } .news .news_mainleft { width: 100%; } .banner .swiper_text, .banner .swiper_textone { position: absolute; z-index: 1; top: 50%; left: 50%; transform: translatex(-50%) translatey(-50%); } .banner .swiper_text h1 { font-size: 0.465rem; line-height: 0.465rem; } .banner .swiper_text>p:nth-of-type(2), .banner .swiper_text>p:nth-of-type(3), .banner .swiper_textone>p { font-size: 0.23rem; line-height: 0.3rem; } .banner .swiper { --swiper-navigation-size: 0.4rem; /* 设置按钮大小 */ } .banner .swiper-horizontal .swiper-pagination { display: none; width: 0.94rem; height: 0.03rem; margin-top: 6rem; margin-left: 0.5rem; background-color: #fff; } .banner>.more { position: absolute; z-index: 1; bottom: 1rem; left: 50%; transform: translatex(-50%); width: 1.5rem; height: 0.97rem; text-align: center; } .banner>.more>li:nth-child(1) { width: 100%; height: 0.2rem; font-size: 0.2rem; font-weight: bold; color: #ffffff; } article .news_top>div:last-of-type { font-size: 0.2307rem; } article .news_top { width: 100%; height: 1.5rem; padding-top: 0.6rem; padding-bottom: 0.3rem; box-sizing: border-box; } article .news_top>div:last-of-type { float: right; width: 2rem; height: 0.5rem; text-align: center; line-height: 0.5rem; color: #fff; font-size: 0.2rem; border: 0.0075rem solid #ea222d; cursor: pointer; position: relative; z-index: 1; transition: all 0.5s; } article { width: 100%; background: ; overflow: hidden; background-color: #fff; position: relative; z-index: 1; } article .news_main { width: 100%; height: 14rem; display: block; } article .news_main .news_mainleft, article .news_main .news_mainright { width: 100%; height: 6rem; position: relative; } article .news_mainleft .swiper_img { width: 100%; height: 4rem; } article .news_mainleft .swiper_text { position: absolute; top: 4.3rem; left: 0px; width: 100%; } article .news_top>div:first-of-type h2 { font-size: 0.4rem; } article .news_top>div:first-of-type { font-size: 0.2rem; } article .news_mainleft .swiper_text>.title { height: 0.28rem; font-size: 0.28rem; overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } article .news_mainleft .swiper_text div { font-size: 0.23rem; margin: 0.2rem 0rem; } article .news_mainleft .swiper_text div>span { width: 0.18rem; height: 0.18rem; } article .news_mainleft .swiper_text .content { width: 100%; font-size: 0.25rem; line-height: 0.35rem; } article .news_mainright { margin-top: 0.5rem; } article .news_mainright li .img { width: 1.8rem; height: 1.095rem; overflow: hidden; flex-shrink: 0; } article .news_mainright li>.right>p { font-size: 0.28rem; line-height: 0.35rem; } article .news_mainright li>.right>div { font-size: 0.23rem; margin: 0.2rem 0rem; } article .news_mainright li>.right>div>span { width: 0.18rem; height: 0.18rem; } .sfq { display: none; } .sfq_m { display: block; width: 100%; background-color: #fff; position: relative; z-index: 1; padding: 0.3rem 0; } .sfq_m>div { width: 90%; margin: 0 auto; height: 4rem; margin-top: 0.3rem; position: relative; overflow: hidden; } .sfq_m>div img { width: 100%; position: absolute; top: 0; left: -100px; right: -100px; margin: auto; transition: all 1s; } .sfq_m>div>div { width: 100%; height: 100%; position: absolute; top: 0; background-color: rgba(0, 0, 0, 0.5); color: #fff; display: flex; flex-direction: column; justify-content: center; align-items: center; } .sfq_m>div>div>span { display: block; transition: all 1s; } .sfq_m .sfq_defalt>span:nth-of-type(1) { width: 0.8rem; height: 0.8rem; background: url(/uploads/image/simg/sfq1icon.png) no-repeat; background-size: 100% 100%; } .sfq_m>div>div>span:nth-of-type(2) { margin-top: 0.5rem; font-size: 0.42rem; font-weight: bold; color: #ffffff; position: relative; } .sfq_m>div>div>span:nth-of-type(3) { width: 0.05rem; height: 0.15rem; margin-top: 0.2rem; position: relative; } .sfq_m>div>div>span:nth-of-type(4) { font-size: 0.25rem; font-family: arial; font-weight: bold; color: #ffffff; opacity: 0.2; margin-top: 1rem; position: relative; } .sfq_m>div:nth-of-type(2)>div>span:nth-of-type(1) { background: url(/uploads/image/simg/sfq2icon.png) no-repeat; background-size: 100% 100%; } .sfq_m>div:nth-of-type(3)>div>span:nth-of-type(1) { background: url(/uploads/image/simg/sfq3icon.png) no-repeat; background-size: 100% 100%; } .sfq_m .sfq_defalt a { font-size: 0.25rem; margin-top: 0.5rem; border-bottom: 0.01rem solid #fff; padding-bottom: 0.1rem; } /* .case .case_top>span { font-size: 0.4rem; } .case .case_top>div { font-size: 0.2rem; } .case .left { display: none; } .case .caseswiper { width: 6rem; height: 4.5rem; box-shadow: rgb(0 0 0 / 7%) 0px 5px 15px 0px; margin-top: 0.4rem; box-sizing: border-box; position: relative; left: 50%; transform: translatex(-50%); } .case .case_swiper { width: 100%; } .case .caseswiper_div { width: 100%; height: 4.5rem; } .case .caseswiper_div>div { width: 100%; height: 3.3rem; } .case .caseswiper .next, .case .caseswiper .prev { display: none; } .case .caseswiper_div .title>p { font-size: 0.28rem; } .case .caseswiper_div>ul>.divleft { font-size: 0.25rem; } .case .caseswiper_div>ul>.divleft>span { margin-right: 0.1rem; margin-top: -0.05rem; width: 0.2rem; height: 0.22rem; } .case .caseswiper_div>ul>.divright>.red_ { height: 0.17rem; margin-top: -0.06rem; } .case .caseswiper_div>ul>.divright { font-size: 0.23rem; } */ .img-top .img { width: 100%; height: 100%; background-attachment: scroll; background-repeat: no-repeat; background-size: cover; background-position: center center; position: absolute; top: 0; left: 0; } .img-top .swiper1 .swiper-img img { margin: auto; height: 100%; width: auto; position: absolute; top: -400px; bottom: -400px; left: 0; right: auto; } .img-top .img-text { position: absolute; top: 10%; left: 50%; transform: translatex(-50%); } .img-top .img-text .title { padding-left: 0.15rem; height: 0.4rem; border-left: 0.045rem solid #ea4027; font-size: 0.4rem; line-height: 0.4rem; font-weight: bold; color: #fff; } .img-top .swiper1 .btns { width: 1.5rem; position: absolute; bottom: 1rem; left: 5%; } .img-top .swiper1 .prev1, .img-top .swiper1 .next1 { width: 0.6rem; height: 0.6rem; background-color: rgba(255, 255, 255, 0.2); box-shadow: 0px 0px 21px 0px rgba(0, 0, 0, 0.1); border-radius: 50%; color: #fff; transition: all 0.5s; } .img-top .swiper1 .prev1 { left: 0; } .img-top .swiper1 .swiper-img .text { color: rgb(255, 255, 255); position: absolute; left: 5%; top: 3rem; } .relax { height: 9rem; background-position: center!important; } .relax .relax_top { width: 100%; margin-top: 1.3rem; text-align: center; position: relative; z-index: 1; } .relax .relax_top>div>p { width: 90%; margin: 0 auto; font-size: 0.25rem; line-height: 0.4rem; } .relax .relax_top>.red_ { width: 0.05rem; height: 0.2rem; } .relax .hill>ul { padding: 0; padding-top: 0.5rem; flex-wrap: wrap; display: flex; justify-content: space-evenly; align-content: flex-start; align-items: flex-start; text-align: center; } .relax .hill>ul li { width: 30%; margin-top: 0.2rem; } .relax .hill>ul>li>span:nth-of-type(1) { font-size: 0.5rem; font-family: arial; font-weight: 900; color: rgb(51, 51, 51); line-height: 0.81rem; } .relax .hill>ul li>span:nth-of-type(3), .relax .hill>ul li>span:nth-of-type(4) { font-size: 0.25rem; } .relax .hill>ul li>span:nth-of-type(4) { display: none; } .relax .cloud { display: none; } .video-box { width: 100%; height: 6rem; position: relative; background-size: auto 100%; background-repeat: no-repeat; background-position: top right; overflow: hidden; } .video-box .play { width: 1.4rem; height: 1.4rem; position: absolute; top: calc(25% - 0.7rem); left: calc(50% - 0.7rem); cursor: pointer; } .video-box .text { position: absolute; top: 50%; right: auto; left: calc(50% - 2.44875rem); width: 4.8975rem; } .video-box .video-bg p { display: none; } .video-box .video-bg video { display: none; } .video-box .video-bg img { display: block; } .popups .video { width: 100%; } /* .relax .cloud { width: 100%; height: 100%; display: flex; } .relax .cloud span { width: 100%; height: 100%; display: block; background: url(/uploads/image/simg/cloud.png) 0rem 0rem no-repeat; background-size: 100% 100%; flex-shrink: 0; } */ }