body{font-size: 16px;} .w90{ width: 1760px; margin: 0 auto; } .pl-w90{padding-left: calc((100% - 1760px)/2);} .pr-w90{padding-right: calc((100% - 1760px)/2);} .mr-w90{margin-right: calc((100% - 1760px)/2);} .ml-w90{margin-left: calc((100% - 1760px)/2);} .w80{ width: 1560px; margin: 0 auto; } .pl-w80{padding-left: calc((100% - 1560px)/2);} .pr-w80{padding-right: calc((100% - 1560px)/2);} .mr-w80{margin-right: calc((100% - 1560px)/2);} .ml-w80{margin-left: calc((100% - 1560px)/2);} header{ position: fixed; top: 0; left: 0; width: 100%; z-index: 100 ; color: #fff; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; } header.index .logoImg{padding: 15px 0;} .oneNav{ line-height: 120px; white-space: nowrap; display: block; padding: 0 2vw; font-size: 18px; font-weight: bold;} /* .oneNav span { position: relative;} */ nav li::after{ width: 100%; height:15px; display: block; content: ''; background: url(../images/navOn.png) no-repeat center top; background-size: auto 100%; transition: all .36s; transform: scale(0,1); position: absolute; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; -webkit-transform: scale(0,1); -moz-transform: scale(0,1); -ms-transform: scale(0,1); -o-transform: scale(0,1); top: 15px; left: 0; } nav li{ position: relative;} nav li.on::after,nav li:hover::after{ transform: scale(1,1); -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -ms-transform: scale(1,1); -o-transform: scale(1,1); } nav:hover > li:not(:hover) .oneNav{ color: #333; } nav:hover > li:not(:hover)::after{ transform:scale(0,1) ; } /* nav li dl{position:absolute;text-align: center; width: 600px;top:100% ; left: 50%; background:#fff; box-shadow:0 5px 10px rgba(0,0,0,.1); border-bottom-left-radius:5px;border-bottom-right-radius:5px; } nav li dl dd{white-space: nowrap; line-height:50px; } nav li dl dd a{ padding: 0 10px; width: 100%; border-bottom: 1px solid #eee; color:#333!important; font-weight: normal!important; transition:all .36s ease;-ms-transition:all .36s ease;-o-transition:all .36s ease;-webkit-transition:all .36s ease;-moz-transition:all .36s ease;display:block } nav li dl dd a:last-child{ border-bottom: none;} nav li dl dd a:hover{ background-color: var(--blue); color: #fff !important;} nav li dl{ visibility:hidden; opacity:0; filter:alpha(opacity=0); transform:translateX(-50%) translateY(20px); -ms-transform:translateX(-50%) translateY(20px); -o-transform:translateX(-50%) translateY(20px); -webkit-transform:translateX(-50%) translateY(20px); -moz-transform:translateX(-50%) translateY(20px); transition:all .5s ease; -ms-transition:all .5s ease; -o-transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; } nav li:hover dl{ visibility:visible; opacity:1; filter:alpha(opacity=100); transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); } */ nav li dl{position:absolute;text-align: center;min-width:150px; width: auto;top:100%;left: 50%; background:#fff; -webkit-box-shadow:0 13px 42px 11px rgba(0,0,0,.15);box-shadow:0 13px 42px 11px rgba(0,0,0,.15); border-bottom-left-radius:5px;border-bottom-right-radius:5px;} nav li dl dd{white-space: nowrap;height:50px;line-height:50px;border-bottom:1px solid #eee;transition:all .36s ease;-ms-transition:all .36s ease;-o-transition:all .36s ease;-webkit-transition:all .36s ease;-moz-transition:all .36s ease} nav li dl dd:last-child{border-bottom:0} nav li dl dd a{ padding: 0 20px; font-size:14px; color:#333!important; font-weight: normal!important; transition:all .36s ease;-ms-transition:all .36s ease;-o-transition:all .36s ease;-webkit-transition:all .36s ease;-moz-transition:all .36s ease;display:block } nav li dl dd:hover{background:var(--blue)} nav li dl dd:hover a{color:#fff!important;} /* nav li dl:before{content:"";position:absolute;border-width:0 9px 9px;border-style:solid;border-color:transparent transparent #f6f1e1;top:-9px;left:50%;margin-left:-9px} */ nav li dl{pointer-events: none; visibility:hidden; opacity:0; filter:alpha(opacity=0); transform:translateX(-50%) translateY(20px); -ms-transform:translateX(-50%) translateY(20px); -o-transform:translateX(-50%) translateY(20px); -webkit-transform:translateX(-50%) translateY(20px); -moz-transform:translateX(-50%) translateY(20px); transition:all .5s ease; -ms-transition:all .5s ease; -o-transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; } nav li:hover dl{ pointer-events: auto;visibility:visible; opacity:1; filter:alpha(opacity=100); transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); } @media screen and (min-width:750px) { nav li.on .oneNav,nav li:hover .oneNav{ color: var(--blue);} } .zw{ margin-top: -100px; padding-top: 100px;} .zwHeader{ height: 100px;} header::after{ position: absolute; left: 0; bottom: 0; display: block; content: ''; transition: all .36s; width: 100%; height: 0; background-color: rgba(255, 255, 255, .15); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; } /* header.scroll,header:hover{ box-shadow: 0 0 15px rgba(0, 0, 0, .15); color: #333;} header.scroll::after,header:hover::after{ background-color: #fff; height: 100%;} header.scroll .oneNav span::after,header:hover .oneNav span::after{background: var(--blue);} header.scroll nav li.on .oneNav ,header:hover nav li:hover .oneNav { color: var(--blue);} header.scroll .searchBtn,header:hover .searchBtn{ border-color: #e5e5e5;} header.scroll .languageBtn,header:hover .languageBtn{ border-color: #e5e5e5;} */ header.scroll { box-shadow: 0 0 15px rgba(0, 0, 0, .15); color: #333;} header.scroll::after { background-color: #fff; height: 100%;} header.scroll .oneNav span::after {background: var(--blue);} header.scroll nav li.on .oneNav { color: var(--blue);} header.scroll .searchBtn { border-color: #e5e5e5;} header.scroll .languageBtn { border-color: #e5e5e5;} header.scroll .logoImg{padding: 0 !important;} header.index nav{ transform: translateY(-100%); opacity: 0; -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); } header.scroll nav{ transform: none; opacity: 1; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; } header.scroll .oneNav{ line-height: 100px;} header.scroll .logoImg img{ height: 51px;} .languageUl{ position: absolute; top: 100%; left: 0; width: 100%; box-shadow: 0 10px 10px rgba(0, 0, 0, .15); height: 0; transform: scale(1,.5); opacity: 0; transition: all .5s; -webkit-transform-origin: top center; pointer-events: none; } .languageUl a:hover{ background: var(--blue); color: #fff;} .languageBtn:hover .languageUl{ height: auto; transform: scale(1); opacity: 1; pointer-events: unset; } .searchBox{ background : var(--blue); z-index: 15; transform: translateY(-105%); transition:all .6s ; -webkit-transition:all .6s ; -moz-transition:all .6s ; -ms-transition:all .6s ; -o-transition:all .6s ; -webkit-transform: translateY(-105%); -moz-transform: translateY(-105%); -ms-transform: translateY(-105%); -o-transform: translateY(-105%); } .searchBox .form{ width: calc(100% - 80px);} .searchBox .keys{ width: 80%; background: url(../images/search-w.png) no-repeat left center; } .searchBox .submit{ width: 90px; height: 40px; border: 1px solid #fff;} .searchBox input::-webkit-input-placeholder {color:rgba(255, 255, 255, .65);} .searchBox input:-moz-placeholder {color:rgba(255, 255, 255, .65);;} .searchBox input::-moz-placeholder {color:rgba(255, 255, 255, .65);;} .searchBox input:-ms-input-placeholder {color: rgba(255, 255, 255, .65);;} .searchBox.show{ transform: translateY(0%); -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); -o-transform: translateY(0%); } .h_nav{ height: 60px; width: 60px; background-color:var(--blue); padding: 18px 8px ; align-items: flex-end; display: flex;} .h_nav .burger{ width: 100%; height: 1px ; background: #fff; transition: .8s; display:inline-block; } .h_nav .burger:first-child{ animation: long 2s linear infinite; -webkit-animation: long 2s linear infinite; } .h_nav .burger:nth-of-type(2){ width: 50%;} .h_nav .burger:nth-of-type(3){ animation: long 3s linear infinite; -webkit-animation: long 3s linear infinite; } .h_nav.close .burger:first-child{ display: none;} .h_nav.close .burger:nth-of-type(3){ display: none;} .h_nav.close .burger:nth-of-type(2) { position: relative; z-index: 1; width: 80%;} .h_nav.close .burger:nth-of-type(2):before, .h_nav.close .burger:nth-of-type(2):after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff; opacity: 0; z-index: 1;} .h_nav.close .burger:nth-of-type(2) { background: transparent; transform: rotate(-180deg); } .h_nav.close .burger:nth-of-type(2):before, .h_nav.close .burger:nth-of-type(2):after { opacity: 1; transition: all .3s; } .h_nav.close .burger:nth-of-type(2):before { transform: rotate(45deg); } .h_nav .burger:nth-of-type(2):after { transform: rotate(-45deg); } .nav{ color: #fff !important; width: 100%; height: calc(100vh - 60px) ; transition:all .6s ; transform: translateX(100%); background-color: #000; position: fixed; top: 60px; right: 0; flex-direction: column; -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); -webkit-transition:all .6s ; -moz-transition:all .6s ; -ms-transition:all .6s ; -o-transition:all .6s ; } .nav.show{ transform:translateX(0) ; -webkit-transform:translateX(0) ; -moz-transform:translateX(0) ; -ms-transform:translateX(0) ; -o-transform:translateX(0) ; } .nav li.go-child{ border-top: 1px solid rgba(255, 255, 255, 0.25); position: relative;} .nav li.go-child>a{ line-height: 60px; padding: 0 20px; font-size: 16px;} .h_nav.close{align-items: center; justify-content: center;} .erji{ width: 60px; height: 60px; position: absolute; right: 0 ; top: 0; display: flex; align-items: center; justify-content: center; font-size: 30px; z-index: 10; background: url(../images/jia.png) no-repeat center center; background-size: 40% auto;} .nav li.go-child.on .erji{ background: url(../images/jian.png) no-repeat center center; background-size: 40% auto;} .nav-down li a{ line-height: 50px; border-top: 1px solid rgba(255, 255, 255, 0.25); display: block; padding-left: 25px; font-size: 14px; opacity: 0.8; } .nav{ overflow-y: scroll; } .nav::-webkit-scrollbar {/*滚动条整体样式*/ /*高宽分别对应横竖滚动条的尺寸*/ width: 1px;} .nav::-webkit-scrollbar-thumb {/*滚动条里面小方块*/border-radius: 3px; background: #555; width: 1px; } .nav::-webkit-scrollbar-track {/*滚动条里面轨道*/border-radius: 3px; background: #000; width: 1px; } .linka a:hover{ color: var(--blue);} .idxBan{ height: 100vh;} .banner { width: 77%; } .idxBanImg{ width: 100%; height: 100vh; object-fit: cover;} .idxNav{ position: absolute; left: 0; bottom: 80px; line-height:2.4; z-index: 10;} .idxNav a{ writing-mode: vertical-rl; } .idxNav a.on{ color: var(--blue);} .idxBanText{ position: absolute; left: 0; top: 22vh; z-index: 10;} .idxBanText li{ display: none; animation: rightFloat 1s; -webkit-animation: rightFloat 1s; } .idxBanText li.on{ display: block;} .idxBan .swiper-slide-active .idxBanImg{ animation: swiper_img_move 8s linear 0s infinite normal both ; -webkit-animation: swiper_img_move 8s linear 0s infinite normal both ; } .idxBan .pagination .swiper-pagination-bullet{ transition: all .36s; width:1.5vw ; margin-right: 10px; height: 1.5vw; background: rgba(26, 85, 153, .2); opacity: 1; transform: scale(0.6); -webkit-transform: scale(0.6); -moz-transform: scale(0.6); -ms-transform: scale(0.6); -o-transform: scale(0.6); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; } .idxBan .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{ background: url(../images/paginationBg.png) no-repeat center center; background-size: 100% 100%; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); } .idxAbout{ background: url(../images/idxAboutBg.png) no-repeat left bottom #f0f6fd;} .idxAboutMore{ border-top-right-radius: 0;} .idxAboutMore:hover{ transform: translate(15px); -webkit-transform: translate(15px); -moz-transform: translate(15px); -ms-transform: translate(15px); -o-transform: translate(15px); } .idxAboutIcon{ position: absolute; top: 50%; left: -4vw; width: 8vw; z-index: 10; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .idxAbout .right::after{ display: block; content: ''; width: 40%; height: 2px; position: absolute; left: -25%; top: 10%; background:var(--blue) ; z-index: 15;} .idxAbout .kuai{ width: 9vw; height: 9vw; border-radius: 2vw; position: absolute; left: -4vw; bottom: -2vw; -webkit-border-radius: 2vw; -moz-border-radius: 2vw; -ms-border-radius: 2vw; -o-border-radius: 2vw; } .idxProlist li{width: calc((100% - 120px)/4); margin-right: 40px;} .idxProlist li:nth-child(4n){ margin-right: 0;} .idxProlist li .img{ padding-bottom:100% ; height: 0;} .idxProlist li:hover{ transform: translateY(-10px); box-shadow: 0 0 20px rgba(26, 85, 153, .2); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } .idxProlist li:hover .img img{ transform:scale(1.1) ; -webkit-transform:scale(1.1) ; -moz-transform:scale(1.1) ; -ms-transform:scale(1.1) ; -o-transform:scale(1.1) ; } .idxProcessUl .img{ height: 100px;} .idxProcessUl li{ flex: 1; position: relative;perspective: 800px;} .idxProcessUl li::after{display: block;content: '';position: absolute;left: 0;top: 0;z-index: 2;width: 100%;height: 100%;background: var(--blue);transform-origin: left center 0; transition: 0.54s; opacity: 0; visibility: hidden; transform: rotateY(60deg);-webkit-transform: rotateY(60deg);-moz-transform: rotateY(60deg); -ms-transform: rotateY(60deg); -o-transform: rotateY(60deg);} .idxProcessUl li:hover:after{ opacity: 1; transform: rotateY(0); -webkit-transform: rotateY(0); -moz-transform: rotateY(0);visibility: visible; -ms-transform: rotateY(0); -o-transform: rotateY(0); } .idxProcessUl li:hover{ color: #fff; transform:scale(1.1); z-index: 10; -webkit-transform:scale(1.1); -moz-transform:scale(1.1); -ms-transform:scale(1.1); -o-transform:scale(1.1); } /* .idxProcessUl li:hover .idxProcessIcon{filter: grayscale(100%) brightness(500%);} */ .idxYsUl li{ width: 12.5%; height: 550px;} .idxYsUl li .img img{ width: 100%;height: 550px; object-fit: cover;} .idxYsUl li::after{ display: block; content: ''; width: 100%; height: 100%; background: rgba(0, 0, 0, .3); top: 0; left: 0; position: absolute; z-index: 2;} .idxYsUl li .text{ letter-spacing: 2px; position: absolute; left: 50%; top: 50%; z-index: 4; transform: translate(-50%,-50%);writing-mode: vertical-rl; color: #fff; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); } .idxYsUl li .con{ position: absolute; bottom: 0; left: 0; z-index: 8; transform: translateY(100%); -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); } .idxYsUl li.on{ width: 43.1%;} .idxYsUl li.on::after{ background: rgba(0, 0, 0, .15);} .idxYsUl li.on .text{ top: 150%; } .idxYsUl li.on .con{ transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); } .idxNewsSwiper .img{ padding-bottom:73% ;} .idxNewsSwiper .swiper-slide:hover .img img{ transform:scale(1.1) ; -webkit-transform:scale(1.1) ; -moz-transform:scale(1.1) ; -ms-transform:scale(1.1) ; -o-transform:scale(1.1) ; } .idxNewsSwiper .swiper-slide .tit span{ /*text-decoration: underline; */background-image: linear-gradient(currentColor 0, currentColor 0); background-image: linear-gradient(currentColor 0 0); background-position: 0 calc(100% - 1px); background-size: 0 1px; background-repeat: no-repeat; transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms; -webkit-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms; -moz-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms; -ms-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms; -o-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms; } .idxNewsSwiper .swiper-slide:hover .tit span{ background-position: 100% calc(100% - 1px); background-size: 100% 1px} .sarchForm { width: 15.6vw; border-bottom: 3px solid #fff;} .sarchForm input::-webkit-input-placeholder {color:#fff;} .sarchForm input:-moz-placeholder {color:#fff;} .sarchForm input::-moz-placeholder {color:#fff;} .sarchForm input:-ms-input-placeholder {color: #fff;} .sarchForm .submit{ background: url(../images/searchbig-w.png) no-repeat center center; background-size: contain; width: 24px; height: 24px;} .footLine{ height: 4px; width: 1.3em;} footer a:hover{ color: #fff;} .footNav li{ margin-right: 6.3vw;} .footNav li:last-child{ margin-right: 0;} .subNav a{ border-color: rgba(26, 85, 153, .2); white-space: nowrap;} .subNav a::after{ display: block; content: ''; background: var(--blue); width:0; height: 100%; position: absolute; left: 0; top: 0; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; } .subNav a.on::after, .subNav a:hover::after{ width: 120%;} .subNav a.on, .subNav a:hover{ color: #fff;} .subNav:hover a:not(:hover){ color: #333;} .subNav:hover a:not(:hover)::after{ width: 0;} .line-height1-1{ line-height: 1.1;} .neiBan{ margin-top: -1px;} .neiBanImg{ max-height: 90vh; object-fit: cover; min-height: 260px;} .neiBan::after{ display: block; content: ''; background: #fff; width:100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2;-webkit-clip-path: polygon(0 15%, 0% 0, 100% 0)} .locaton { position: absolute; left: 0; top: 0; z-index: 5;} .waves { position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 1; filter: grayscale(100%); } .honorSwiper .img{ padding-bottom: 120%;} .swiperBtn{ box-shadow: 0 0 15px rgba(0, 0, 0, .15); width: 70px; height: 70px; position: absolute; top: 50%; z-index: 10; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .swiperBtn:hover{ color: #fff; background: var(--blue);} .honor .prev,.team .prev{ right: calc(100% + 25px);} .honor .next,.team .next{ left: calc(100% + 25px);} .teamSwiper .img{ padding-bottom: 100%;} .teamSwiper .swiper-slide:hover{ color: var(--blue); transform: scale(0.95); -webkit-transform: scale(0.95); -moz-transform: scale(0.95); -ms-transform: scale(0.95); -o-transform: scale(0.95); } .placeSwiper .swiper-slide{ transition: all .36s; transform: scale(0.8); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; -webkit-transform: scale(0.8); -moz-transform: scale(0.8); -ms-transform: scale(0.8); -o-transform: scale(0.8); } .placeSwiper .swiper-slide.swiper-slide-active{ transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); } .place .prev{ left: 19vw;} .place .next{ right: 19vw;} /* .styleSwiper .swiper-slide{ opacity: .8;} .styleSwiper .swiper-slide.swiper-slide-active{ opacity: 1;} */ .style .prev,.style .next{ width: 66px; height: 66px;} .style .swiper-pagination-bullet{ width: 10px; height: 10px; opacity: 1; background: rgba(26, 85, 153, .2); margin: 0 5px; } .style .swiper-pagination-bullet.swiper-pagination-bullet-active{ background: var(--blue);} .style .prev:hover,.style .next:hover{ background: var(--blue); color: #fff;} .prolist li{ width: calc((100% - 90px)/3); margin-right: 45px;} .prolist li:nth-child(3n){ margin-right: 0;} .prolist li .img{ padding-bottom:100% ; height: 0;} .prolist li:hover{ transform: translateY(-10px); box-shadow: 0 0 20px rgba(26, 85, 153, .2); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } .prolist li:hover .img img{ transform:scale(1.1) ; -webkit-transform:scale(1.1) ; -moz-transform:scale(1.1) ; -ms-transform:scale(1.1) ; -o-transform:scale(1.1) ; } .proLeft a:last-child{ margin-bottom: 0;} .proLeft a::after{ display: block; content: ''; width: 2px; height: 0; position: absolute; left: -1px; top: 0; background: var(--blue); } .proLeft a.on::after{ height: 100%;} .proLeft a.on{ color: var(--blue); font-size: 1.1em; font-weight: bold;} .proRight{ width: 80%;} .proRightOne .img{ padding-bottom:100% ; height: 0;} .proInfoTit::after{ display: block; content: ''; background: var(--blue); content: ''; width: 1.5em; height: 3px; position: absolute; bottom: -1px; left: 0;} .proPage a +a{ margin-top: 10px;} .customerList li{ width: calc((100% - 120px)/4); margin-right: 40px;} .customerList li:nth-child(4n){ margin-right: 0;} .customerList li:hover{ transform: translateY(-10px); box-shadow: 0 0 15px rgba(26, 85, 153, .2); color: var(--blue); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } .newslist li{ width: calc((100% - 90px)/3); margin-right: 45px; perspective: 800px;} .newslist li:nth-child(3n){ margin-right: 0;} .newslist li .tit{ height: 3em;} .newslist .desc{ height: 9em;} .newslist li:hover div{ color: #fff !important; border-color: rgba(255, 255, 255, .65) !important;} .newslist li::after{display: block;content: '';position: absolute;left: 0;top: 0;z-index: 2;width: 100%;height: 100%;background: var(--blue);transform-origin: left center 0; transition: 0.54s; opacity: 0; visibility: hidden; transform: rotateY(60deg);-webkit-transform: rotateY(60deg);-moz-transform: rotateY(60deg); -ms-transform: rotateY(60deg); -o-transform: rotateY(60deg);} .newslist li:hover:after{ opacity: 1; transform: rotateY(0); -webkit-transform: rotateY(0); -moz-transform: rotateY(0);visibility: visible; -ms-transform: rotateY(0); -o-transform: rotateY(0); } .newslist li:hover{ box-shadow: 0 0 20px rgba(26, 85, 153, .2); transform:translateY(10px) ; -webkit-transform:translateY(10px) ; -moz-transform:translateY(10px) ; -ms-transform:translateY(10px) ; -o-transform:translateY(10px) ; } .border-blue4{ border: 1px solid rgba(26, 85, 153, .2);} .w1200{ max-width: 1200px; width: 90%; margin: 0 auto;} /* .newsInfoOne::after{ display: block; content: ''; background: var(--blue); width:100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2;-webkit-clip-path: polygon(0 100%, 50% 0, 100% 100%);} */ .contactStyleUl{display: table;} .contactStyleUl figure{ display: table-row; } .contactStyleUl li{display: table-cell; padding-right: 2vw; } .inputRed{ position: absolute; left: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .contactMessages input ,.contactMessages .textarea{ border: 1px solid transparent;} .contactMessages input:focus ,.contactMessages .textarea:focus{ border: 1px solid var(--blue)} .contactMessages .img{ border-radius: 0 20px 20px 0; -webkit-border-radius: 0 20px 20px 0; -moz-border-radius: 0 20px 20px 0; -ms-border-radius: 0 20px 20px 0; -o-border-radius: 0 20px 20px 0; } .searcchlist li:hover{ color: var(--blue); } .srcachBox .keys{ width: calc(100% - 84px);} .srcachBox .submit{ cursor: pointer; height: 84px; width: 84px; background: url(../images/sarchbtn.png) no-repeat center center; background-size: auto 30%;}