/* * Created by Edward on 23/09/18 * Copyright (c) 2023 ishutime.com All rights reserved */ * { margin: 0px; padding: 0px; box-sizing: border-box; } @font-face { font-family: 'iconfont'; src: url('iconfont.woff2?t=1663740079843') format('woff2'), url('iconfont.woff?t=1663740079843') format('woff'), url('iconfont.ttf?t=1663740079843') format('truetype'); } @font-face { font-family: SourceHanSans; /* src: url(../fonts/SourceHanSansCN-Regular.TTF); */ src: url(https://website-ishutime.oss-cn-chengdu.aliyuncs.com/SourceHanSansCN-Regular.TTF) } @font-face { font-family: montserrat; src: url(../fonts/Geometr415MdBTMedium.ttf) } html.has-scroll-smooth { overflow: hidden; position: fixed; left: 0; right: 0; top: 0; bottom: 0; } html.has-scroll-dragging, html.has-scroll-dragging * { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .has-scroll-smooth body { overflow: hidden; } .c-scrollbar { position: absolute; right: 0; top: 0; width: 11px; height: 100vh; transform-origin: center right; transition: transform 0.3s, opacity 0.3s; opacity: 0; z-index: 100; } .c-scrollbar:hover { transform: scaleX(1.45); } .c-scrollbar:hover, .has-scroll-dragging .c-scrollbar, .has-scroll-scrolling .c-scrollbar { opacity: 1; } .c-scrollbar_thumb { position: absolute; top: 0; right: 0; background-color: #e60012; width: 7px; margin: 2px; cursor: -webkit-grab; cursor: grab; } .has-scroll-dragging .c-scrollbar_thumb { cursor: -webkit-grabbing; cursor: grabbing; } html, body { font-family: 'SourceHanSans', "思源黑体", "Microsoft YaHei", '微软雅黑', "Arial"; font-size: 14px; color: #272727; } input, textarea { font-family: 'SourceHanSans', "思源黑体", "Microsoft YaHei", '微软雅黑', "Arial"; } .iconfont { font-family: "iconfont" !important; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; } @font-face { font-family: Brown; src: url(../fonts/brown/brown-regular.woff2) } .header { width: 100%; height: auto; position: fixed; left: 0%; top: 0%; z-index: 100; padding: 15px 3%; display: flex; justify-content: space-between; align-items: center; -webkit-transition: all .5s cubic-bezier(0.215, 0.610, 0.355, 1); /* -webkit-transform: translateY(0%); */ } .header.active{ /* -webkit-transform: translateY(-100%); */ padding: 5px 3%; background: #fff; box-shadow: 0px 0px 30px rgba(0, 0, 0, .1); } .header.active a, .header.active span{ color: #3e3e3e; } .header.active .langue a.active{ color: #fff; } .header.active .logo{ width: 70px; } .header a, .header span { color: #ffffff; } .slides { height: 100vh; overflow: hidden; } .slides .slide { height: 100vh; overflow: hidden; position: relative; } .slides .slide .bg { position: absolute; width: 100%; height: 100%; right: 0; top: 0; background: center center no-repeat; background-size: cover; } .slide1 { padding-left: 0 !important; } .slide1 .swiper-slide { width: 100vw; height: 100vh; overflow: hidden; background: #000; } .slide1 .swiper-slide .parallax { overflow: hidden; width: 100%; height: 100%; } .slides .slide.footer { height: auto; } .slide1 .back_img { width: 100%; height: 100%; position: absolute; left: 0%; top: 0%; background: center center no-repeat; background-size: cover; } .banner-swiper .swiper-pagination { width: auto; right: 5%; text-align: right; bottom: 3%; } .banner-swiper .swiper-pagination-bullet { background: rgba(255, 255, 255, .5); width: 75px; height: 5px; border-radius: 0px; -webkit-transition: all .5s; } .banner-swiper .swiper-pagination-bullet.swiper-pagination-bullet-active { background: rgba(255, 255, 255, 1); height: 10px; } .total_num { width: 100px; height: auto; display: flex; align-items: center; position: absolute; left: 0%; top: 50%; z-index: 2; color: rgba(255, 255, 255, .5); -webkit-transform: rotate(90deg); } .total_num p:first-child { color: rgba(255, 255, 255, 1); } .total_num p { font-family: montserrat; font-size: 30px; font-weight: bold; } .total_num b { font-weight: normal; margin-right: 5px; margin-left: 5px; } .logo { width: 100px; position: relative; -webkit-transition: all .5s; } .langue { width: 122px; height: auto; display: flex; justify-content: space-between; align-items: center; filter: url("#goo"); position: relative; } .langue span { position: relative; } .langue p { width: 45px; height: 45px; position: absolute; left: 0%; top: 0%; background: #e60012; border-radius: 50%; -webkit-transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); } .langue p.active { -webkit-transform: translateX(77px); } .header.active .langue a:hover{ color: #fff; } .langue a { width: 45px; height: 45px; position: relative; background: transparent; border-radius: 50%; text-align: center; line-height: 45px; display: block; z-index: 2; } .detail_box .dpl .singePage video,table,td,tr,tbody{ width: 100%; position: relative; display: block; height: auto; top: 0%; -webkit-transform: translateY(0%); background: #000; } .langue a.active { background: #e60012; } /* .langue a::before{ width: 100%; height: 100%; position: absolute; left: 0%; top: 0%; content: ''; background: #e60012; border-radius: 50%; z-index: -1; -webkit-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1); -webkit-transform: scale(0); opacity: 0; } .langue a.active::before,.langue a:hover::before{ -webkit-transform: scale(1); opacity: 1; } */ .nav { width: calc(100% - 400px); position: relative; } .nav ul { width: 100%; display: flex; justify-content: space-between; } .nav ul li { width: calc(100% / 8); position: relative; text-align: center; line-height: 45px; } .nav ul li .firstLab, .nav ul li .firstLab a { position: relative; width: 100%; display: block; } .nav ul li .firstLab a{ -webkit-transition: all .5s; } .nav ul li:hover .firstLab a{ letter-spacing: 1px; } .nav ul li .firstLab { font-size: 18px; } .nav ul li:hover .firstLab a {} .nav ul li .secondLab { width: 100%; height: auto; position: absolute; left: 0%; top: 65px; background: #fff; padding: 15px 5px; border-radius: 5px; font-size: 16px; opacity: 0; visibility: hidden; box-shadow: 0px 0px 30px rgba(0, 0, 0, .1); } .nav ul li:nth-child(3) .secondLab{ width: 120%; left: -10%; } .nav ul li .secondLab::before { width: 120px; height: 15px; position: absolute; left: 50%; margin-left: -60px; top: 0px; content: ''; background: url(../images/move_up.png) no-repeat; -webkit-transition: all .65s cubic-bezier(0.19, 1, 0.22, 1); background-size: cover; } .nav ul li .secondLab a { display: block; width: 100%; height: auto; line-height: 40px; color: #3e3e3e; } .nav ul li:hover .secondLab { opacity: 1; visibility: visible; top: 59px; -webkit-transition:all .5s cubic-bezier(0.215, 0.610, 0.355, 1) } .nav ul li:hover .secondLab::before { top: -14px; } .nav ul li .secondLab a:hover { color: #e60012; } .slide_txt { width: 38%; height: auto; position: absolute; left: 56%; top: 50%; -webkit-transform: translateY(-50%); color: #fff; } .slide_txt .p1 { width: 100%; display: flex; position: relative; font-size: 4vw; margin-bottom: 1vw; justify-content: flex-end; font-family: montserrat; } .slide_txt .p1 .p { margin-right: 1vw; } .slide_txt .p1 .p:last-child { margin-right: 0%; } .slide_txt .p2 { position: relative; width: 100%; line-height: 1.7; display: flex; flex-wrap: wrap; justify-content: flex-end; } .slide_txt .p2 .b { font-size: 2vw; text-transform: uppercase; font-family: montserrat; position: relative; z-index: 2; line-height: 1; margin-bottom: 1vw; font-weight: bold; } .slide_txt .p2 .b::before { width: 100%; height: 7px; position: absolute; left: 0%; bottom: 4px; content: ''; background: #e60012; z-index: -1; } .svg { display: none; } .service_swiper { position: relative; width: 100%; height: 100vh; } .service_swiper .swiper-slide { overflow: hidden; } .service_swiper .swiper-slide .pic { width: 100%; height: 100%; position: absolute; left: 0%; top: 0%; } .service_swiper .info { width: 45%; height: auto; position: absolute; left: 10%; top: 25%; color: #ffffff; } .service_swiper .info .name { font-size: 36px; position: relative; padding-bottom: 15px; margin-bottom: 25px; } .service_swiper .info .name::after { width: 35px; height: 3px; position: absolute; left: 0%; bottom: 0%; content: ''; background: #ffffff; } .service_swiper .info .des { width: 100%; font-size: 16px; line-height: 1.7; margin-bottom: 65px; } .dm_more { width: 150px; height: 46px; border: 1px solid #fff; display: block; position: relative; line-height: 44px; text-align: center; color: #ffffff; overflow: hidden; -webkit-transition: all .5s; } .dm_more.red { border: 1px solid #e60012; color: #e60012; } .dm_more.red:hover { color: #ffffff; } .dm_more p { position: relative; z-index: 2; } .dm_more span::before, .dm_more::before, .dm_more::after { background: #e60012; border-radius: 50%; -webkit-transform: scale(0); -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1); } .dm_more::before { width: 50px; height: 50px; position: absolute; right: -65px; bottom: 0%; content: ''; } .dm_more:hover::before { right: -25px; -webkit-transform: scale(3); } .dm_more::after { width: 30px; height: 30px; position: absolute; left: -35px; top: 0%; content: ''; } .dm_more:hover::after { left: -15px; -webkit-transform: scale(4); } .dm_more span::before { width: 60px; height: 60px; position: absolute; left: 50%; bottom: 100%; margin-left: -30px; content: ''; } .dm_more:hover span::before { top: 50%; -webkit-transform: scale(3); } .dm_more:hover { border-color: #e60012; } .dm_more p { -webkit-transition: all 1s cubic-bezier(0.215, 0.610, 0.355, 1); } .dm_more:hover p { letter-spacing: 4px; } .dm_more span { width: 100%; height: 100%; position: absolute; left: 0%; top: 0%; display: block; } .service_nav { width: 80%; height: auto; position: absolute; left: 10%; bottom: 10%; display: flex; z-index: 2; } .service_nav a { display: block; width: calc(100% / 6 - 1px); position: relative; height: auto; margin-right: 1px; padding: 25px 15px; padding-top: 80px; -webkit-transition: all .5s; background: rgba(255,255,255,.8); backdrop-filter: blur(10px); -webkit-transform: translateY(50px); opacity: 0; -webkit-transition: all 0.8s ease .5s; } .service_nav a:nth-child(2){ -webkit-transition-delay: .6s; } .service_nav a:nth-child(3){ -webkit-transition-delay: .7s; } .service_nav a:nth-child(4){ -webkit-transition-delay: .8s; } .service_nav a:nth-child(5){ -webkit-transition-delay: .9s; } .service_nav a:nth-child(6){ -webkit-transition-delay: 1s; } .swiper-slide-active .service_nav a{ -webkit-transform: translateY(0px); opacity: 1; } .service_nav a .s_bg { width: 100%; height: 0%; position: absolute; left: 0%; bottom: 0%; background: #ffffff; -webkit-transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1.275); overflow: hidden; } .service_nav a .s_bg::before { width: 286px; height: 200px; position: absolute; right: -120px; bottom: -75px; background: url(../images/dl.png) no-repeat; background-size: cover; content: ''; } .service_nav a:hover, .service_nav a.active { z-index: 5; box-shadow: 0px 0px 50px rgba(0, 0, 0, 1); } .service_nav a:hover .s_bg, .service_nav a.active .s_bg { background: #e60012; height: 140%; border-radius: 20px 20px 0px 0px; } .service_nav a .icon { width: 45px; height: 45px; position: absolute; left: 25px; top: 25px; margin-left: 0px; margin-top: 0px; background: url(../images/s_icons.png) no-repeat; -webkit-transition: all .5s; } .service_nav a .icon2 { width: 45px; height: 45px; background: url(../images/s_icons.png) no-repeat; -webkit-transition: all .5s; position: absolute; left: 50%; margin-left: -22.5px; top: -7.5%; background-position: 0px -45px; opacity: 0; -webkit-transform: scale(0); } .service_nav a .icon2::before { width: 85px; height: 85px; position: absolute; top: 50%; left: 50%; margin-left: -42.5px; margin-top: -42.5px; background: url(../images/lines.png) no-repeat; background-size: cover; content: ''; -webkit-animation: lineAnimate 4s linear infinite; } @-webkit-keyframes lineAnimate { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } .service_nav a:hover .icon2, .service_nav a.active .icon2 { opacity: 1; -webkit-transform: scale(1); } .service_nav a:nth-child(2) .icon2 { background-position: -45px -45px; } .service_nav a:nth-child(3) .icon2 { background-position: -90px -45px; } .service_nav a:nth-child(4) .icon2 { background-position: -135px -45px; } .service_nav a:nth-child(5) .icon2 { background-position: -180px -45px; } .service_nav a:nth-child(6) .icon2 { background-position: -225px -45px; } .service_nav a:hover .icon, .service_nav a.active .icon { opacity: 0; margin-top: -20px; } .service_nav a:nth-child(2) .icon { background-position: -45px 0px; } .service_nav a:nth-child(3) .icon { background-position: -90px 0px; } .service_nav a:nth-child(4) .icon { background-position: -135px 0px; } .service_nav a:nth-child(5) .icon { background-position: -180px 0px; } .service_nav a:nth-child(6) .icon { background-position: -225px 0px; } .service_nav a .name { width: 100%; height: auto; position: relative; bottom: 0px; -webkit-transition: all .5s; } .service_nav a:hover .name, .service_nav a.active .name { bottom: 20px; } .service_nav a .title { width: 100%; height: auto; position: absolute; text-align: center; left: 0%; bottom: 25px; opacity: 0; color: #fff; -webkit-transition: all .5s; } .service_nav a .title b{ font-size: 18px; } .service_nav a:hover .title, .service_nav a.active .title { opacity: 1; bottom: 35px; } .service_nav a .name b { display: block; font-weight: normal; position: relative; font-size: 18px; margin-bottom: 3px; } .service_nav a .name p { text-transform: uppercase; font-size: 12px; opacity: .7; } .common_top { width: 100%; display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 3vw; -webkit-transition: all .7s ease .4s; opacity: 0; -webkit-transform: translateY(30px); } .swiper-slide-active .common_top{ opacity: 1; -webkit-transform: translateY(0px); } .slide3 { display: flex; align-items: center; } .commom_title { width: 100%; height: auto; position: relative; } .commom_title b { font-size: 36px; position: relative; padding-bottom: 15px; margin-bottom: 25px; display: block; } .commom_title b::after { width: 35px; height: 3px; position: absolute; left: 0%; bottom: 0%; content: ''; background: #272727; } .commom_title.w b::after { background: rgba(255, 255, 255, .3); } .commom_title p { width: 100%; font-size: 16px; line-height: 1.7; } .newsSwiper { overflow: initial; padding-bottom: 35px; } .newsSwiper a { position: relative; width: 100%; padding: 15px; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1); -webkit-transition: all .5s ease; display: block; } .newsSwiper .swiper-slide{ position: relative; opacity: 0; top: 50px; -webkit-transition: all .8s ease .5s; } .newsSwiper .swiper-slide:nth-child(2){ -webkit-transition-delay: 0.6s; } .m_intro_map{ display: none; } .newsSwiper .swiper-slide:nth-child(3){ -webkit-transition-delay: 0.7s; } .newsSwiper .swiper-slide:nth-child(4){ -webkit-transition-delay: 0.8s; } .newsSwiper .swiper-slide:nth-child(5){ -webkit-transition-delay: 0.9s; } .swiper-slide-active .newsSwiper .swiper-slide{ opacity: 1; top: 0px; } .newsSwiper a .time { width: 100%; position: relative; line-height: 1; margin-bottom: 10px; } .newsSwiper a .time b { font-family: montserrat; font-size: 40px; display: block; opacity: .4; } .newsSwiper a .time p { opacity: .4; font-size: 12px; } .newsSwiper a .name { width: 100%; height: auto; position: relative; margin-top: 15px; margin-bottom: 5px; min-height: 48px; font-size: 16px; } .newsSwiper a .des { font-size: 12px; opacity: .4; min-height: 41px; } .newsSwiper a .icon { opacity: .5; font-size: 20px; } .swiper-horizontal>.swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal { top: auto; bottom: 0px; } .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: #e60012; } .slide4 { display: flex; align-items: center; } .slide4 .w1400 { display: flex; justify-content: space-between; align-items: center; } .slide4 .intro_right { width: calc(100% - 350px); -webkit-transition: all .7s ease .5s; opacity: 0; -webkit-transform: translateY(50px); } .slide4.swiper-slide-active .intro_right { opacity: 1; -webkit-transform: translateY(0px); } .history_list .dot{ width: 12px; height: 12px; border: 2px solid #e60012; border-radius: 50%; position: absolute; left: 50%; margin-left: -6px; top: -15px; } .history_list .dot.down{ top: auto; bottom: -15px; } .slide4 .intro_left { width: 350px; -webkit-transition: all 1s ease .35s; opacity: 0; -webkit-transform: translateY(50px); } .slide4.swiper-slide-active .intro_left{ opacity: 1; -webkit-transform: translateY(0px); } .commom_title.w { color: #ffffff; } .nums { width: 100%; margin: 1vw 0px 3vw; color: #fff; } .nums ul li { width: 100%; display: flex; align-items: center; position: relative; margin-bottom: 1vw; } .nums ul li:last-child { margin-bottom: 0vw; } .nums ul li .l { width: 100px; font-size: 70px; font-family: montserrat; color: #e60012; font-weight: bold; } .nums ul li .r { margin-left: 0px; } .nums ul li .t { font-size: 20px; } .brands { width: 400px; height: auto; position: absolute; left: 65%; top: 50%; -webkit-transition: all 1.6s ease 0.5s; opacity: 0; -webkit-transform: translateY(-45%); } .swiper-slide-active .brands{ opacity: 1; -webkit-transform: translateY(-50%); } .brands .list { position: relative; width: 90%; margin-top: 2vw; } .brands .list a { display: block; width: 100%; height: 10vh; position: relative; background: #fff; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1); margin-bottom: 1vw; } .brands .list a .pic { height: 80%; background-size: contain; top: 10%; position: absolute; width: 100%; } .partner { width: 100%; height: auto; position: relative; background: #fff url(../images/bg6.jpg) center center no-repeat; background-size: contain; padding: 5vw 0px 3vw; } .coopers{ position: relative; -webkit-transition: all .7s ease .5s; opacity: 0; -webkit-transform: translateY(50px); } .swiper-slide-active .coopers{ opacity: 1; -webkit-transform: translateY(0px); } .partner ul { width: 100%; display: flex; flex-wrap: wrap; } .partner ul li { width: 16%; height: auto; position: relative; margin-right: 0.8%; background: #fff; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1); margin-bottom: 0.5vw; } .partner ul li:nth-child(6n) { margin-right: 0%; } .footers { width: 100%; height: auto; position: relative; background: url(../images/footer_bg.jpg) center center no-repeat; background-size: cover; padding: 50px 0px 20px; color: #fff; } .footer_top { width: 100%; display: flex; justify-content: space-between; margin-bottom: 2vw; } .f_ewm { width: 135px; height: auto; position: relative; text-align: center; } .f_ewm p { margin-top: 5px; opacity: 0.5; font-size: 12px; } .f_tel { width: 200px; position: relative; } .f_nav { width: calc(100% - 400px); height: auto; position: relative; } .f_nav ul { width: 100%; position: relative; display: flex; justify-content: space-between; } .f_nav ul li { width: 12.5%; position: relative; } .f_nav ul li:nth-child(2) { width: 22%; } .f_nav ul li:nth-child(5) { width: 15.5%; } .f_nav ul li a { position: relative; line-height: 35px; display: block; width: 100%; text-align: center; color: rgba(255, 255, 255, .5); -webkit-transition: all .35s; } .f_nav ul li a:hover{ color: #fff; } .f_nav ul li a:nth-child(1) { color: #fff; } .common_top.mb1 { margin-bottom: 1vw; } .f_tel_ele { width: 100%; margin-bottom: 1vw; } .f_tel_ele a { font-family: montserrat; color: #fff; width: 100%; display: block; font-size: 24px; text-transform: uppercase; } .f_tel_ele .name { margin-bottom: 5px; } .copyright { width: 100%; position: relative; font-size: 12px; color: rgba(255, 255, 255, .5); } .sub_banner { width: 100%; height: 100vh; position: relative; background: #000; margin-top: 0px; overflow: hidden; } .sub_img{ width: 100%; height: 100%; position: absolute; left: 0%; top: 0%; background: center center no-repeat; background-size: cover; opacity: 0.5; -webkit-animation: subAnimate 2s ease 1 forwards; } @-webkit-keyframes subAnimate{ 0%{ -webkit-transform: translateY(25px) scale(1.1); } 100%{ -webkit-transform: translateY(0px) scale(1.1); } } .slogan{ width: 80%; height: auto; position: absolute; left: 10%; bottom: 15%; color: #fff; } .slogan .cn{ font-size: 2vw; position: relative; font-weight: bold; } .slogan .en{ width: 100%; font-size: 6vw; font-family: montserrat; text-transform: uppercase; font-weight: bold; } .about_box{ width: 100%; display: flex; justify-content: space-between; } .about_box .left{ width: 40%; position: relative; line-height: 1.3; font-size: 6vw; font-weight: bold; } .about_box .left .n{ font-family: montserrat; color: #e60012; text-transform: uppercase; } .about_box .right{ width: 50%; } .sub_name{ width: 100%; position: relative; } .sub_name.w{ color: #ffffff; } .sub_name.w p::after{ background: #ffffff; } .sub_name.c{ text-align: center; } .sub_name.c p::after{ left: 50%; margin-left: -20px; } .sub_name p{ position: relative; font-size: 36px; padding-bottom: 1vw; margin-bottom: 2vw; font-weight: bold; } .sub_name p::after{ width: 40px; height: 4px; position: absolute; left: 6px; bottom: 0px; content: ''; background: #3e3e3e; } .about_img{ width: 100%; margin-top: 5vw; position: relative; z-index: 2; } .history{ width: 100%; margin-top: 5vw; position: relative; } .history .mp{ width: 30%; height: auto; position: absolute; left: 0px; top: 50%; -webkit-transform: translateY(-50%); } .history_list{ width: 100%; position: relative; margin-top: 5vw; padding-top: 3vw; } .history_list .line{ width: 1px; height: 100%; position: absolute; left: 50%; top: 0%; background: rgba(0, 0, 0, 0.1); } .history_list .line span{ width: 100%; display: block; position: absolute; left: 0%; top: 0%; background: #e60012; height: 0%; } .history_list ul{ width: 100%; display: flex; flex-wrap: wrap; position: relative; } .history_list ul li{ width: 100%; display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 4vw; position: relative; } .history_list ul li::after{ width: 7px; height: 7px; position: absolute; left: 50%; margin-left: -3px; top: 10px; background: #e60012; border-radius: 50%; content: ''; } .history_list ul li .year{ width: 45%; position: relative; text-align: right; font-family: montserrat; font-size: 6vw; font-weight: bold; color: #e60012; line-height: 1; top: -1.7vw; } .history_list ul li .info{ width: 45%; position: relative; } .history_list ul li .info .name{ font-size: 18px; position: relative; line-height: 25px; margin-bottom: 1vw; } .history_list ul li .info .img{ width: 45%; position: relative; margin-bottom: 1vw; } .history_list ul li .info .des{ opacity: .6; line-height: 1.4; } .honorSwiper .pic { background-size: contain; } .honorSwiper { overflow: initial; } .hornor_box { overflow: hidden; background: url(../images/honor_bg.jpg) top center no-repeat; background-size: cover; position: relative; padding-bottom: 0px; } .hornor_box.f4{ background-image: url(../images/cp_bg.jpg); } .hornor_box::after{ width: 100%; height: 40%; position: absolute; left: 0%; bottom: 0%; content: ''; background: linear-gradient(-180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)); } .honorSwiper { padding-bottom: 200px; } .service_swiper .swiper-slide .pic::after{ width: 100%; height: 70%; position: absolute; left: 0%; bottom: 0%; content: ''; background: linear-gradient(-180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .95)); } .honor_line { width: 4000px; height: 64px; position: absolute; left: 0%; bottom: 0; display: flex; pointer-events: none; z-index: 3; } .honor_line img { width: 50%; } .honor_line.hl1 { -webkit-animation: moves 5s linear infinite; } .honor_line.hl2 { -webkit-animation: moves 5s linear infinite 2s; opacity: 0.5; } @-webkit-keyframes moves { 0% { left: 0px; } 100% { left: -2000px; } } .honorSwiper .swiper-slide { width: 385px; margin-top: 0px; -webkit-transition: all .65s; } .honorSwiper .swiper-slide:nth-child(odd) { top: 38px; } .honorSwiper .name { width: 100%; height: auto; position: relative; margin-top: 20px; font-size: 16px; text-align: center; line-height: 20px; } .honor_page { width: 100%; height: 60px; display: flex; align-items: flex-start; position: absolute; left: 0px; bottom: 70px; } .honor_page .swiper-button-next, .honor_page .swiper-button-prev { position: relative; width: 50px; height: 50px; border-radius: 50%; -webkit-transition: all .65s; border: 1px solid #e60012; color: #e60012; } .honor_page .swiper-button-next:after, .honor_page .swiper-button-prev:after { font-size: 18px; } .honor_page .swiper-button-next { right: 0px; margin-left: 25px; } .honor_page .swiper-button-prev { left: 0px; } .industry_box{ width: 100%; position: relative; display: flex; justify-content: space-between; align-items: flex-start; } .in_left{ width: 300px; height: auto; background: #fff; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1); border-radius: 10px; padding: 20px 0px; } .in_left a{ display: block; width: 100%; height: auto; position: relative; padding:12px 30px; padding-left: 50px; -webkit-transition: all .5s; cursor: pointer; } .in_left a:hover,.in_left a.active{ color: #e60012; padding-left: 60px; } .in_left a.active::before{ width: 100%; left: 0%; opacity: 1; } .in_left a::after{ width: 30px; height: 23px; position: absolute; left: 0px; top: 24px; content: ''; background: url(../images/dl_icon.png) no-repeat; background-size: cover; -webkit-transition: all .5s; opacity: 0; } .in_left a:hover::after,.in_left a.active::after{ left: 20px; opacity: 1; } .in_left a b{ display: block; width: 100%; position: relative; font-size: 18px; margin-bottom: 5px; } .in_left a p{ font-size: 14px; opacity: .7; } .in_right{ width: calc(100% - 350px); position: relative; margin-bottom: 10vw; } .in_right_row{ width: 100%; position: relative; height: auto; margin-bottom: 5vw; } .in_right_row.active{ display: block; } .singePage.c{ text-align: center; } .cooperate{ width: 100%; margin-top: 3vw; position: relative; } .cooperate ul li{ width: 100%; position: relative; margin-bottom: 7vw; } .cooperate ul li .name{ position: relative; width: 100%; text-align: center; margin-bottom: 95px; } .cooperate ul li:first-child .name{ margin-bottom: 80px; } .cooperate ul li .name b{ font-size: 28px; } .cooperate ul li .name b span{ color: #e60012; } .cooperate ul li .name p{ font-size: 16px; } .cooperate ul li .name::before{ width: 834px; height: 110px; position: absolute; left: 50%; margin-left: -417px; top: 20px; content: ''; background: url(../images/line2.png) top center no-repeat; } .coop_row{ width: 100%; display: flex; justify-content: space-between; } .coop_row .row{ width: 46%; position: relative; background-color: #fff; border-radius: 10px; box-shadow: 20px 20px 50px rgba(0, 0, 0, 0.1); overflow: hidden; } .coop_row .row .thum{ box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.1); border-radius: 10px; } .coop_row .row .info{ width: 100%; position: relative; text-align: center; padding: 20px; } .coop_row .row .info .title{ position: relative; font-size: 20px; font-weight: bold; margin-bottom: 10px; } .coop_row .row .info .des{ line-height: 1.7; font-size: 16px; } .coop_sinpge{ width: 100%; display: flex; position: relative; justify-content: space-between; background: #fff; box-shadow: 20px 20px 50px rgba(0, 0, 0, 0.1); border-radius: 10px; } .coop_sinpge .thum{ width: 46%; position: relative; -webkit-transform: scaleY(1.1); border-radius: 10px; } .coop_sinpge .thum .pic{ height: 100%; } .coop_sinpge .th{ width: 50%; position: relative; display: flex; padding:50px 35px; } .coop_sinpge .th .info{ width: 50%; position: relative; text-align: center; } .coop_sinpge .th .info:first-child::after{ width: 1px; height: 100%; position: absolute; right: 0%; top: 0%; content: ''; background: rgba(0, 0, 0, 0.05); } .coop_sinpge .th .info .title{ position: relative; font-size: 20px; font-weight: bold; margin-bottom: 10px; } .coop_sinpge .th .info .des{ line-height: 1.7; font-size: 16px; } .cooperate ul li:nth-child(3){ direction: rtl; } .cooperate ul li:nth-child(3) .coop_sinpge .th{ direction: initial; } .cooperate ul li:last-child .name{ margin-bottom: 80px; } .hzhb{ width: 100%; position: relative; } .hzhb ul{ width: 100%; display: flex; justify-content: center; margin-bottom: 1vw; } .hzhb ul li{ width: 19%; height: auto; position: relative; background: #fff; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1); border-radius: 5px; margin-right: 1.25%; -webkit-transition-delay: 0.2s; } .hzhb ul li:nth-child(2n){ -webkit-transition-delay: 0.4s; } .hzhb ul li:nth-child(3n){ -webkit-transition-delay: 0.6s; } .hzhb ul li:nth-child(4n){ -webkit-transition-delay: 0.5s; } .hzhb ul li:nth-child(5n){ -webkit-transition-delay: 0.35s; } .hzhb ul li:nth-child(5n){ margin-right: 0%; } .case_nav{ width: 100%; position: relative; text-align: center; display: flex; justify-content: center; margin-bottom: 4vw; } .case_nav a{ width: 165px; height: 122px; display: block; position: relative; background: url(../images/case_icon.png) no-repeat; margin: 0px 1vw; } .iconBox{ display: none; } .case_nav a p{ position: absolute; width: 100%; top: 50%; -webkit-transform: translateY(-50%); font-size: 20px; font-weight: bold; } .case_nav a:hover,.case_nav a.active{ color: #fff; background-position: 0px -122px; } .case_list{ position: relative; width: 100%; } .case_list ul{ width: 100%; display: flex; flex-wrap: wrap; } .case_list ul li{ width: 32%; position: relative; margin-right: 2%; margin-bottom: 2vw; -webkit-transition-delay: 0.2s; } .case_list ul li:nth-child(2n){ -webkit-transition-delay: 0.4s; } .case_list ul li:nth-child(3n){ -webkit-transition-delay: 0.6s; } .case_list ul li:nth-child(3n){ margin-right: 0%; } .case_list ul li a{ display: block; position: relative; padding: 25px 20px; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.05); -webkit-transition: all .5s; } .case_list ul li a::after{ width: 0%; height: 3px; position: absolute; left: 0%; bottom: 0%; content: ''; background: #e60012; -webkit-transition: all .5s; } .case_list ul li a:hover::after{ width: 100%; } .case_list ul li a:hover .pic{ -webkit-transform: scale(1.1); } .case_list ul li a:hover{ box-shadow: 20px 20px 50px rgba(0, 0, 0, 0.3); } .case_list ul li a .name{ width: 100%; position: relative; margin-bottom: 1vw; } .case_list ul li a .name .time{ color: #e60012; font-family: montserrat; font-size: 16px; font-weight: bold; } .case_list ul li a .name .title{ font-size: 22px; line-height: 1.4; position: relative; font-weight: bold; } .case_list ul li a .name .iconfont{ width: 45px; height: 45px; position: absolute; right: 0%; bottom: 0%; background: rgba(0, 0, 0, 0.05); line-height: 45px; text-align: center; border-radius: 50%; font-size: 24px; color: rgba(0, 0, 0, 0.3); -webkit-transition: all .5s; z-index: 2; display: none; } .case_list ul li a .name .iconfont::before{ width: 100%; height: 100%; position: absolute; left: 0%; top: 0%; background: #e60012; -webkit-transition: all .5s cubic-bezier(0.175, 0.885, 0.32, 1.275); -webkit-transform: scale(0); z-index: -1; content: ''; border-radius: 50%; } .case_list ul li a:hover .name .iconfont{ color: #fff; } .case_list ul li a:hover .name .iconfont::before{ -webkit-transform: scale(1); } .contact{ padding: 0px; overflow: hidden; } .map{ width: 100%; position: absolute; height: 100%; left: 0%; top: 0%; } .contact_box{ width: 560px; position: relative; margin-left: 50%; margin-top: 6vw; margin-bottom: 6vw; background: #fff; padding: 50px; box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.1); border-radius: 10px; } .contact_box .name{ width: 100%; position: relative; display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid #e60012; margin-bottom: 3vw; padding-bottom: 0.5vw; } .contact_box .name b{ color: #e60012; font-size: 50px; font-family: montserrat; text-transform: uppercase; } .contact_box .link{ width: 200px; display: flex; align-items: center; justify-content: space-between; } .contact_box .link a{ width: 46%; } .contact_box .list{ width: 100%; position: relative; } .contact_box .list ul li{ width: 100%; display: flex; position: relative; margin-bottom: 4vw; } .contact_box .list ul li:last-child{ margin-bottom: 0px; } .contact_box .list ul li .num{ width: 50px; color: #e60012; font-family: montserrat; font-size: 30px; line-height: 1; font-weight: bold; } .contact_box .list ul li .info{ width: calc(100% - 50px); } .contact_box .list ul li .info .title{ font-size: 18px; font-weight: bold; margin-bottom: 0.5vw; } .contact_box .list ul li .info .des{ line-height: 1.7; } .company_box{ width: 100%; display: flex; position: relative; justify-content: space-between; align-items: center; } .company_box .left{ width: 50%; position: relative; } .company_box .right{ width: 45%; position: relative; } .service_swiper .swiper-pagination{ display: none; } .sub_words{ width: 150%; font-size: 6.5vw; font-weight: bold; text-transform: uppercase; font-family: montserrat; opacity: 0.1; margin-bottom: 1vw; } .com_list{ width: 100%; position: relative; } .com_list ul li{ width: 100%; position: relative; background: #fff; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.05); padding: 20px; display: flex; align-items: center; margin-bottom: 2vw; justify-content: space-between; border-radius: 10px; } .com_list ul li .img{ width: 115px; height: auto; position: relative; } .com_list ul li .info{ width: calc(100% - 135px); line-height: 1.7; font-size: 16px; } .r_rect,.r_zfx,.r_center{ width: 100%; position: absolute; height: 100%; left: 0%; top: 0%; } .r_center{ pointer-events: none; } .r_zfx{ display: flex; flex-wrap: wrap; } .r_zfx a{ width: 50%; height: 50%; position: relative; display: block; } .r_rect img{ width: 100%; position: absolute; height: 100%; left: 0%; top: 0%; -webkit-transition: all .5s; opacity: 0.65; } .r_rect img.active{ opacity: 1; } .company_box .right>img{ position: relative; width: 100%; z-index: 5; pointer-events: none; } .r_zfx a p{ font-size: 16px; color: #fff; text-align: center; top: 45%; -webkit-transform: translateY(-50%); position: absolute; width: 100%; } .r_zfx a:nth-child(3) p,.r_zfx a:nth-child(4) p{ top: 55%; } .r_center{ z-index: 10; } .r_logo{ width: 40%; height: auto; position: absolute; left: 50%; top: 50%; -webkit-transform: translateY(-50%) translateX(-50%); z-index: 20; -webkit-perspective: 200px; } .r_logo img{ -webkit-animation: logoAnimate 4s linear infinite; } @-webkit-keyframes logoAnimate{ 0%{ -webkit-transform: rotateY(0deg); } 50%,100%{ -webkit-transform: rotateY(360deg); } } .r_animate{ width: 100%; height: 100%; position: absolute; left: 0%; top: 0%; -webkit-transform: scale(1.05); -webkit-animation: rectAnimate 10s linear infinite; } @-webkit-keyframes rectAnimate{ 0%{ -webkit-transform: rotate(0deg) scale(1.05); } 100%{ -webkit-transform: rotate(-360deg) scale(1.05); } } .news_focus{ width: 100%; display: flex; justify-content: space-between; margin-bottom: 3vw; } .news_focus .focus_left{ width: 66%; } .news_focus .focus_left a{ padding: 20px; background: #fff; position: relative; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1); display: block; } .news_focus .focus_left a:hover .pic,.news_focus .focus_right a:hover .pic,.news_list ul li a:hover .pic{ -webkit-transform: scale(1.1); } .news_focus .focus_left a:hover .info .title .name,.news_focus .focus_right a:hover .info .name,.news_list ul li a:hover .name{ color: #e60012; } .news_focus .focus_right{ width: calc(33.5% - 20px); display: flex; flex-wrap: wrap; align-content: space-between; } .news_focus .focus_right a{ position: relative; padding: 15px; background: #fff; display: block; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1); -webkit-transition: all .5s; } .news_focus .focus_left a,.news_list ul li a{ -webkit-transition: all .5s; } .news_focus .focus_right a:hover,.news_focus .focus_left a:hover,.news_list ul li a:hover,.newsSwiper a:hover{ box-shadow: 20px 20px 50px rgba(0, 0, 0, 0.3); } .news_focus .focus_right a .info{ width: 100%; display: flex; align-items: center; position: relative; margin-top: 15px; justify-content: space-between; } .news_focus .focus_right a .info .time{ text-align: center; width: 75px; position: relative; color: rgba(0, 0, 0, 0.4); line-height: 1; } .news_focus .focus_right a .info .time::after{ width: 1px; height: 100%; position: absolute; right: 0%; top: 0%; content: ''; background: rgba(0, 0, 0, 0.1); display: block; } .news_focus .focus_right a .info .time b{ display: block; position: relative; font-size: 32px; font-family: montserrat; line-height: 1; } .news_focus .focus_right a .info .time p{ font-size: 12px; } .news_focus .focus_right a .info .name{ width: calc(100% - 85px); position: relative; line-height: 1.6; } .news_focus .focus_left a .info{ width: 100%; display: flex; justify-content: space-between; margin-top: 30px; margin-bottom: 10px; } .news_focus .focus_left a .info .time{ width: 100px; text-align: center; color: rgba(0, 0, 0, 0.4); position: relative; } .news_focus .focus_left a .info .time::after{ width: 1px; height: 100%; position: absolute; right: 0%; top: 0%; content: ''; background: rgba(0, 0, 0, 0.05); } .news_focus .focus_left a .info .title{ width: calc(100% - 120px); } .news_focus .focus_left a .info .time b{ display: block; font-size: 50px; font-family: montserrat; line-height: 1; } .news_focus .focus_left a .info .time .mark{ font-size: 12px; display: inline-block; background: #e60012; color: #fff; padding: 1px 10px; } .news_focus .focus_left a .info .title .name{ font-size: 20px; position: relative; margin-bottom: 5px; } .news_focus .focus_left a .info .title .des{ width: 100%; font-size: 14px; line-height: 1.7; color: rgba(0, 0, 0, 0.4); } .news_list{ width: 100%; position: relative; } .news_list ul{ display: flex; width: 100%; flex-wrap: wrap; } .news_list ul li{ width: 32%; position: relative; margin-right: 2%; margin-bottom: 1.5vw; -webkit-transition-delay: 0.2s; } .news_list ul li:nth-child(2n){ -webkit-transition-delay: 0.4s; } .news_list ul li:nth-child(3n){ margin-right: 0%; -webkit-transition-delay: 0.6s; } .news_list ul li a::after,.news_focus .focus_left a::after,.news_focus .focus_right a::after,.newsSwiper a::after{ width: 0%; position: absolute; left: 0%; bottom: 0%; height: 3px; content: ''; -webkit-transition: all .5s; background: #e60012; } .news_list ul li a:hover::after,.news_focus .focus_left a:hover::after,.news_focus .focus_right a:hover::after,.newsSwiper a:hover::after{ width: 100%; } .newsSwiper a:hover .pic{ -webkit-transform: scale(1.1); } .newsSwiper a:hover .name{ color: #e60012; } .news_list ul li a{ padding:20px 15px; position: relative; background: #fff; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1); display: block; } .news_list ul li a .time{ position: relative; color: rgba(0, 0, 0, 0.4); line-height: 1; margin-bottom: 10px; } .news_list ul li a .time b{ display: block; position: relative; font-size: 32px; font-family: montserrat; line-height: 1; } .news_list ul li a .time p{ font-size: 12px; } .news_list ul li a .thum{ margin-bottom: 15px; } .news_list ul li a .name{ font-size: 16px; margin-bottom: 5px; min-height: 55px; } .news_list ul li a .des{ color: rgba(0, 0, 0, 0.4); margin-bottom: 5px; } .news_list ul li a .icon{ width: 100%; font-size: 28px; line-height: 30px; opacity: .4; } .mouse_icon{ width: 150px; height: auto; position: absolute; right: 3%; bottom: 10%; color: rgba(255, 255, 255, .5); text-align: center; } .mouse_icon p{ font-size: 12px; display: block; margin-bottom: 10px; } .mouse_icon .mouse{ width: 30px; height: auto; margin: 0px auto; position: relative; } .mouse_icon .mouse img{ -webkit-animation: upAnimate 2s ease infinite; } @-webkit-keyframes upAnimate{ 0%,100%{ -webkit-transform: translateY(-4px); } 50%{ -webkit-transform: translateY(4px); } } .mouse_icon .icon{ width: 18px; margin: 0px auto; } .mouse_icon .icon img{ -webkit-animation: upAnimate2 2s ease infinite; } @-webkit-keyframes upAnimate2{ 0%,100%{ -webkit-transform: translateY(-1px); } 50%{ -webkit-transform: translateY(3px); } } .hornor_box .sub_name{ margin-bottom: 5vw; } .honor_tips{ width: 60%; height: auto; position: absolute; right: 0%; top: 0%; color: #fff; } .honor_tips p{ margin-bottom: 15px; position: relative; line-height: 20px; padding-left: 15px; } .honor_tips p::after{ width: 8px; height: 8px; content: ''; background: #fff; border-radius: 50%; position: absolute; left: 0%; top: 6px; } .menu_btn { position: absolute; right: 0px; display: none; width: 60px; height: 60px; overflow: hidden; text-indent: 100%; white-space: nowrap; background: #e60012; color: transparent; border: none; } .menu_btn span { top: 29px; left: 20px; width: 20px; } .menu_btn span, .menu_btn span:after, .menu_btn span:before { position: absolute; height: 2px; background-color: #fff; border-radius: 1px; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .menu_btn span:after, .menu_btn span:before { content: ""; left: 0; -webkit-transform: translateY(0px) rotate(0deg); } .menu_btn span:before { top: -6px; width: 14px; } .menu_btn span:after { top: 6px; width: 12px; } .menu_btn.active span { background-color: transparent; } .menu_btn.active span:before { -webkit-transform: translateY(6px) rotate(-45deg); } .menu_btn.active span:after { -webkit-transform: translateY(-6px) rotate(45deg); } .menu_btn.active span:after, .menu_btn.active span:before { width: 20px; } video{ object-fit: cover; width: 100%; display: block; position: absolute; top: 50%; -webkit-transform: translateY(-50%); } @media screen and (max-width: 1650px) { .nav ul li:nth-child(3) .secondLab{ width: 140%; left: -20%; } } @media screen and (max-width: 1600px) { .nav ul li .secondLab::before { width: 80px; height: 10px; margin-left: -40px; } .nav ul li:hover .secondLab::before { top: -9px; } .nav ul li:hover .secondLab { top: 50px; } .service_nav{ width: 90%; left: 5%; } .service_nav a .name b { font-size: 16px; } .total_num { left: -1%; } } @media screen and (max-width: 1440px) { .nav { width: calc(100% - 350px); position: relative; } .nav ul li .firstLab{ font-size: 16px; } .nav ul li .secondLab{ font-size: 14px; padding: 10px 5px; } .nav ul li .secondLab a{ line-height: 30px; } .logo{ width: 90px; } .nav ul li .secondLab::before { width: 60px; height: 7.5px; margin-left: -30px; } .nav ul li:hover .secondLab::before { top: -7.5px; } .f_nav ul li a{ font-size: 12px; } /* .in_left{ width: 275px; } .in_right { width: calc(100% - 325px); } .in_left a{ padding-left: 50px; } .in_left a b{ font-size: 18px; } .in_left a:hover, .in_left a.active { color: #e60012; padding-left: 60px; } .in_left a::after{ top: 20px; } .in_left a:hover::after, .in_left a.active::after { left: 15px; opacity: 1; width: 30px; height: 23px; top: 20px; } */ .service_nav a .title b{ font-size: 16px; } } @media screen and (max-width: 1365px) { .nav { width: calc(100% - 300px); position: relative; } } @media screen and (max-width:1024px){ .menu_btn { display: block; } .nav{ height: calc(100vh - 60px); position: fixed; left: 0px; top: 60px; display: block; width: 100%; background: #fff; -webkit-transition: all .5s; opacity: 0; visibility: hidden; pointer-events: none; } .header{ background: #fff; padding: 5px 3%; box-shadow: 0px 0px 30px rgba(0, 0, 0, .1); } .logo{ width: 50px; } .langue{ margin-right: 60px; width: 70px; } .langue p{ display: none; } .langue a{ color: #3e3e3e; font-size: 14px; } .langue a{ width: 30px; height: 30px; line-height: 30px; } .langue a.active{ color: #e60012; background: transparent; } .langue span{ color: rgba(0, 0, 0, 0.4); } .header.active .logo { width: 50px; } .header.active .langue a.active { color: #e60012; } .total_num{ display: none; } .banner-swiper .swiper-pagination{ text-align: center; } .banner-swiper .swiper-pagination-bullet{ width: 45px; height: 2px; } .banner-swiper .swiper-pagination-bullet.swiper-pagination-bullet-active{ height: 5px; } .slides{ height: calc(100vh - 60px); position: relative; margin-top: 60px; } .slide_txt { width: 80%; left: 10%; top: 40%; } .slide_txt .p1{ font-size: 8vw; margin-bottom: 3vw; } .slide_txt .p2 .b{ font-size: 5vw; margin-bottom: 3vw; } .service_nav{ display: none; } .service_swiper .info { width: 90%; left: 5%; top: auto; bottom: 15vh; -webkit-transition: all .8s ease .5s; -webkit-transform: translateY(50px); opacity: 0; } .swiper-slide-active .service_swiper .swiper-slide-active .info { -webkit-transform: translateY(0px); opacity: 1; } .service_swiper .info .name{ font-size: 7vw; } .service_swiper .info .des{ font-size: 14px; margin-bottom: 15vw; } .dm_more { width: 130px; height: 42px; line-height: 40px; } .slides .slide,.slide1 .swiper-slide,.service_swiper{ height: calc(100vh - 60px); } .service_swiper .swiper-pagination{ display: block; bottom: 5%; text-align: left; padding-left: 5%; } .swiper-pagination-bullet{ background: #fff; } .swiper-pagination-bullet-active{ background: #fff; } .service_swiper .swiper-slide .pic::after{ width: 100%; height: 70%; position: absolute; left: 0%; bottom: 0%; content: ''; background: linear-gradient(-180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .95)); } .commom_title b { font-size: 7vw; margin-bottom: 3vw; } .commom_title p{ font-size: 14px; } .w1400{ width: 90%; } .common_top{ margin-bottom: 5vw; } .newsSwiper a .des{ display: none; } .newsSwiper a .name{ min-height: 82px; -webkit-line-clamp: 3; } .slide4 .intro_right,.slide4 .intro_left{ width: 100%; } .slide4 .w1400{ flex-wrap: wrap; } .nums ul li .l{ font-size: 10vw; width: 14vw; } .nums ul{ width: 100%; display: flex; flex-wrap: wrap; } .nums ul li{ width: 50%; } .nums ul li .t{ font-size: 16px; } .nums ul li .b{ font-size: 12px; } .intro_right{ display: none; } .m_intro_map{ display: block; width: 100%; margin-left: 0%; } .intro_left .dm_more{ margin-top: 5vw; } .nums{ margin-top: 5vw; } .f_nav{ display: none; } .f_tel_ele a{ font-size: 5vw; } .f_ewm{ width: 115px; } .copyright{ line-height: 1.7; } .f_tel_ele{ margin-bottom: 3vw; } .f_tel_ele:last-child{ margin-bottom: 0vw; } .common_top.mb1 { margin-bottom: 5vw; } .partner ul li{ width: 32%; margin-right: 2%; margin-bottom: 1.5vw; } .partner ul li:nth-child(6n){ margin-right: 2%; } .partner ul li:nth-child(3n){ margin-right: 0%; } .slides .slide.slide5 .bg{ background-position: 65% 50%; } .brands{ width: 65%; left: 30%; } .brands .list{ margin-top: 5vw; display: flex; flex-wrap: wrap; } .brands .list a{ margin-bottom: 2vw; } .nav.active { opacity: 1; visibility: visible; pointer-events: auto; } .nav ul{ flex-wrap: wrap; position: absolute; top: 50%; -webkit-transform: translateY(-50%); padding: 0px 5%; } .nav ul li{ width: 100%; display: flex; border-bottom: 1px solid rgba(0,0,0,.1); padding-bottom: 10px; margin-bottom: 10px; -webkit-transform: translateY(50px); opacity: 0; } .nav.active ul li{ -webkit-transition: all .6s; -webkit-transform: translateY(0px); opacity: 1; } .nav.active ul li:nth-child(2){ -webkit-transition: all .6s ease .05s; } .nav.active ul li:nth-child(3){ -webkit-transition: all .6s ease .1s; } .nav.active ul li:nth-child(4){ -webkit-transition: all .6s ease .15s; } .nav.active ul li:nth-child(5){ -webkit-transition: all .6s ease .2s; } .nav.active ul li:nth-child(6){ -webkit-transition: all .6s ease .25s; } .nav.active ul li:nth-child(7){ -webkit-transition: all .6s ease .3s; } .nav.active ul li:nth-child(8){ -webkit-transition: all .6s ease .35s; } .header a{ color: #3e3e3e; } .nav ul li .secondLab { font-size: 14px; padding: 0px; width: calc(100% - 100px); position: relative; top: 0px; opacity: 1; visibility: visible; box-shadow: none; display: flex; flex-wrap: wrap; } .nav ul li .secondLab a{ width: auto; margin-right: 10px; } .nav ul li .secondLab a:last-child{ margin-right: 0px; } .nav ul li .firstLab { font-size: 16px; width: 100px; text-align: left; line-height: 30px; font-weight: bold; padding-left: 9px; } .nav ul li:nth-child(3) .secondLab { width: calc(100% - 100px); left: 0%; } .nav ul li .firstLab::after{ width: 3px; height: 20px; position: absolute; left: 0%; top: 5px; content: ''; background: #3e3e3e; } .f_tel{ width: calc(100% - 135px); } .newsSwiper{ padding-bottom: 20px; } .newsSwiper .swiper-pagination-progressbar{ background: rgba(0,0,0,.02); } .nav ul li:hover .secondLab { top: 0px; } .sub_banner{ margin-top: 60px; height: 50vh; } .mouse_icon{ display: none; } .slogan{ width: 90%; left: 5%; } .slogan .cn{ font-size: 6vw; } .slogan .en{ font-size: 10vw; } .boxes{ padding: 15vw 0px; overflow: hidden; } .about_box{ flex-wrap: wrap; } .about_box .left{ width: 100%; font-size: 7vw; line-height: 1; margin-bottom: 3vw; } .about_box .right{ width: 100%; } .about_box .left .n:nth-child(2),.about_box .left .n:nth-child(3){ width: auto; display: inline-block; } .sub_name p{ font-size: 7vw; padding-bottom: 15px; margin-bottom: 3vw; } .history_list ul li .year{ width: 25%; top: 0%; } .history_list ul li .info{ width: 65%; } .history_list .line{ left: 30%; } .history_list .dot,.history_list ul li::after{ left: 30%; } .history_list ul li .info .name{ font-size: 16px; } .honor_tips{ width: 100%; position: relative; margin-bottom: 5vw; } .honorSwiper .swiper-slide:nth-child(odd) { top: 0px; } .honor_tips p{ margin-bottom: 10px; } .honorSwiper .name{ font-size: 14px; margin-top: 10px; } .honorSwiper { padding-bottom: 50px; } .honor_page .swiper-button-next, .honor_page .swiper-button-prev{ width: 40px; height: 40px; } .honor_page{ height: 40px; bottom: 0px; } .honor_line{ width: 2000px; height: 32px; } .in_left{ display: none; } .in_right{ width: 100%; margin-bottom: 0px; } .in_right_row{ margin-bottom: 15vw; } .case_nav a{ width: 108px; height: 80px; position: relative; background-size: cover; } .case_nav a:hover, .case_nav a.active { color: #fff; background-position: 0px -80px; } .case_nav a p{ font-size: 16px; } .case_nav{ margin-bottom: 5vw; } .case_list ul li{ width: 48%; margin-bottom: 3vw; margin-right: 4%; } .case_list ul li:nth-child(3n){ margin-right: 4%; } .case_list ul li:nth-child(2n){ margin-right: 0%; } .case_list ul li a{ padding: 0px; } .case_list ul li a .name{ padding: 15px 15px 10px; margin-bottom: 0px; } .case_list ul li a .name .time{ font-size: 14px; } .case_list ul li a .name .title{ font-size: 4vw; text-overflow: initial; white-space: inherit; } .detail_top .w100{ width: 90%; } .detail_top{ padding: 150px 0px 25px; } .detail_top .title{ font-size: 6vw; } .detail_top .info{ margin-top: 1vw; font-size: 12px; } .detail_box{ padding: 5vw; width: 100%; } .detail_box .dpr{ display: none; } .detail_box .dpl{ width: 100%; } .ndc_npnews{ flex-wrap: wrap; } .ndc_npnews .post_next, .ndc_npnews .post_prev{ font-size: 12px; width: 100%; padding: 10px; margin-bottom: 5px; } .ndc_npnews .post_next .icon, .ndc_npnews .post_prev .icon { width: 44px; } .ndc_npnews .post_next .name, .ndc_npnews .post_prev .name { width: calc(100% - 44px); } .news_focus{ flex-wrap: wrap; } .news_focus .focus_left{ width: 100%; margin-bottom: 5vw; } .news_focus .focus_left a{ padding: 10px; } .news_focus .focus_left a .info .time b{ font-size: 30px; } .news_focus .focus_left a .info .time p{ font-size: 12px; } .news_focus .focus_left a .info .time .mark{ display: none; } .news_focus .focus_left a .info .time{ width: 70px; } .news_focus .focus_left a .info .title { width: calc(100% - 70px); padding-left: 10px; } .news_focus .focus_left a .info .title .name{ font-size: 16px; } .news_focus .focus_left a .info{ margin-top: 10px; margin-bottom: 0px; } .news_focus .focus_right{ width: 100%; } .news_focus .focus_right a{ padding: 10px; margin-bottom: 5vw; } .news_list ul li{ width: 100%; margin-right: 0%; margin-bottom: 5vw; } .news_list ul li a .des,.news_list ul li a .icon{ display: none; } .news_list ul li a .name{ margin-bottom: 0px; min-height: auto; } .news_focus .focus_right a .info .name{ font-size: 16px; } .news_focus .focus_right a .info{ margin-top: 10px; } .news_list ul li a .thum{ margin-bottom: 10px; } .news_list ul li a{ padding: 10px; } #page li{ margin: 0 3px; width: 25px; } .company_box{ flex-wrap: wrap; } .company_box .left{ width: 100%; margin-bottom: 5vw; } .com_list ul li{ padding:15px 10px; margin-bottom: 5vw; } .sub_words{ display: none; } .com_list ul li .img{ width: 75px; } .com_list ul li .info{ width: calc(100% - 85px); } .company_box .right{ width: 90%; margin-left: 5%; } .r_zfx a p{ font-size: 14px; } .cooperate ul li .name::before{ display: none; } .cooperate ul li .name b{ font-size: 6vw; } .cooperate ul li .name p{ font-size: 14px; } .cooperate ul li:first-child .name{ margin-bottom: 5vw; } .cooperate ul li{ margin-bottom: 10vw; } .coop_row .row{ width: 100%; margin-bottom: 5vw; } .coop_row .row .info{ padding: 10px; } .coop_row .row .info .title{ font-size: 4vw; margin-bottom: 1vw; } .coop_row .row .info .des,.coop_sinpge .th .info .des{ font-size: 14px; } .cooperate{ margin-top: 10vw; } .cooperate ul li .name,.cooperate ul li:last-child .name{ margin-bottom: 5vw; } .coop_sinpge{ flex-wrap: wrap; } .coop_sinpge .thum{ width: 100%; height: 15vh; -webkit-transform: scaleY(1); } .coop_sinpge .th{ width: 100%; padding: 20px; } .coop_row{ flex-wrap: wrap; } .coop_sinpge .th .info .title{ font-size: 4vw; margin-bottom: 1vw; } .map{ display: none; } .contact_box { width: 90%; position: relative; margin-left: 5%; margin-top: 0vw; margin-bottom: 0vw; background: #fff; padding: 20px; box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.1); border-radius: 5px; } .contact_box .name b{ font-size: 10vw; } .contact_box .list ul li .num{ font-size: 7vw; width: 9vw; } .contact_box .list ul li .info{ width: calc(100% - 9vw); } .contact_box .list ul li{ margin-bottom: 3vw; } .contact_box .name{ margin-bottom: 5vw; } .partner{ padding: 5vw 0px; } .footer_top{ margin-bottom: 3vw; } .footers { padding-top: 25px; } .banner-swiper video{ display: block; width: 100%; height: 100%; position: absolute; object-fit: cover; } .iconBox { position: absolute; display: block; color: white; top: 45%; left: 50%; cursor: pointer; -webkit-transition: all .6s; width: 60px; height: 60px; margin-left: -30px; } .iconBox img { opacity: 1; -webkit-transition: all .5s; -webkit-animation: lineAnimate 10s linear infinite; } @-webkit-keyframes lineAnimate { 0% { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); } } @keyframes lineAnimate { 0% { transform: rotate(0deg); } to { transform: rotate(360deg); } } .iconBox::after{ position: absolute; left: 50%; top: 50%; background: url(../images/play_icon.png) no-repeat; background-size: auto 100%; content: ''; width: 50px; height: 50px; margin-left: -25px; margin-top: -25px; } .iconBox.active:after{ background-position: -50px 0px; } .iconBox.active{ opacity: .1; } .nav ul li:hover .firstLab a { letter-spacing: 0px; } }婷婷五月综合丁香久久,亚洲中文字幕无码中文,一级无码毛片免费看,黄色网站在线
  • <b id="hgy7l"></b>

  • <blockquote id="hgy7l"><wbr id="hgy7l"></wbr></blockquote>
  • <blockquote id="hgy7l"></blockquote>