/*-------------------------------------------------- project:ygsoft producer:Chan. date:2023-2-17 up:2023-2-17 --------------------------------------------------*/ /* 初始化 */ body{ margin: 0; padding: 0; width:100%; height: 100%; font-family: Arial, 'Microsoft YaHei'; background: #fff; position: relative;} h1,h2,h3,h4,h5,h6,ul,ol,li,p,figure{list-style: none; padding: 0; margin: 0;} a,a:hover{text-decoration: none;} .font-blue{ color: #005bac !important;} .font-green{ color: #00b050 !important;} .font-red{ color: #e62131 !important;} .linearBg{background-image: linear-gradient(to right, #26cfff, #e62131);} .linearBgW{background-image: linear-gradient(to right, #fff, #f0f3f9);} .linearBgGray{background-image: linear-gradient(to right, #fafafa, #f0f3f9);} .bg-blue{ background-color: #005bac !important;} .bg-red{ background-color: #e62131 !important;} .textCenter{text-align: center !important;} .marginTop20{margin-top: 20px !important;} .marginTop30{margin-top: 30px !important;} .marginTop40{margin-top: 40px !important;} .marginTop60{margin-top: 60px !important;} .marginTop80{margin-top: 80px !important;} .marginTop100{margin-top: 100px !important;} .marginTop120{margin-top: 120px !important;} .marginB10{margin-bottom: 10px !important;} .marginB20{margin-bottom: 20px !important;} .marginB30{margin-bottom: 30px !important;} .marginB40{margin-bottom: 40px !important;} .marginB60{margin-bottom: 60px !important;} .marginB-20{margin-bottom: -20px !important;} .marginB-40{margin-bottom: -40px !important;} .marginB-60{margin-bottom: -60px !important;} .tiAlgin{line-height: 1.2em; height: 2em;} .borderRadius-30{border-radius: 30px;} .width900{width: 900px;} .width1000{width: 1000px;} .width1200{width: 1200px;} .slide-tips{display: none;} .textcolorGray{color: #777;} .textcolorBlue{color: #005bac !important;} .norpadBox{padding: 50px; border-radius: 20px; margin-top: 60px;} /* 滚动条美化 */ @media screen and (min-width: 769px){ ::-webkit-scrollbar {width:10px;} /*滚动条的滑轨背景颜色,可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。*/::-webkit-scrollbar-track {background-color:#ddd;-webkit-box-shadow:inset 0 0 3px rgba(0,0,0,0.1);border-radius:5px;} /* 滑块颜色 */::-webkit-scrollbar-thumb {background-color:rgba(0,0,0,0.3);border-radius:5px;} /*滚动条两端的按钮。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。*/::-webkit-scrollbar-button {background-color:#eee;display:none;} /* 横向滚动条和纵向滚动条相交处尖角的颜色 */::-webkit-scrollbar-corner {background-color:black;} } #newBridge #nb_icon_wrap{display:none} /*-------------------------------------------------- 组件 --------------------------------------------------*/ /* container */ .container{ width: 1540px; padding: 0; max-width: 1540px;} .mainbox{padding: 50px 0;} .mainbox.mainboxGray{background: #f6f6f6;} .mainbox.mainboxBlue{background: #005bac;} .mainbox.mianboxPicture{width: 100%; background-size: cover; background-repeat: no-repeat; position: relative; background-position: center 0;} .template-ti{font-size: 48px; color: #747474; text-align: center; position: relative;} .mainbox.mianboxPicture.mianboxPictureOpacity::after{content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(229, 230, 236, 0.3); z-index: 0;} .template-ti.borderBottom{padding-bottom: 20px;} .template-ti.borderBottom::after{content: ''; position: absolute; left: 50%; bottom: 0; width: 100px; height: 5px; background: #e62131; transform: translateX(-50%);} .template-ti-b{font-size: 30px; color: #747474; text-align: center;} .template-sti{font-size: 18px; color: #777; text-align: center; margin: 25px 0 0; line-height: 1.8em;} .tem-more{min-width: 144px; line-height: 44px; background: #005bac; border-radius: 5px; text-decoration: none; font-size: 14px; color: #fff; display: table; transition: all .5s; text-align: center; margin-top: 30px; padding: 0 20px;} .tem-more:hover{background: #005bac; color: #fff; transform: scale(1.2);} .tem-more.center{margin: 30px auto 0;} .tem-more.red{background: #e62131;} .index-more{margin: 46px auto 0 !important ; position: relative; } .index-more::after{content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 10px; background: rgba(0, 91, 172, .35); z-index: 0; opacity: 0;;transform: translateY(0); filter: blur(10px); border-radius: 50%; transition: all .3s;} .index-more:hover::after{transform: translateY(250%); opacity: 1;} .index-more .iconfont{position: relative; font-weight: bold; padding: 0 1px; margin-left: 2px;} .index-more .iconfont::after{content: ''; width: 1.5px; height: 77%; position: absolute; left: 0; top: 10%; background: #005bac; transition: all .3s;} .tem-more.red .iconfont::after{background: #fff;} .index-more:hover .iconfont::after{ background: #fff; transform: translate(16px,0);} .inPageTi{font-size: 42px; color: #363030; text-align: center; letter-spacing: 2px; word-spacing: 0.3em;} .inPageBti{font-size: 28px; margin-top: 20px; text-align: center;} .inPageMti{font-size: 24px; margin-top: 20px; text-align: center;} .inPageSti{font-size: 18px; color: #888; text-align: center; margin-top: 20px;} .inPageBti.left ,.inPageMti.left, .inPageSti.left{text-align: left !important;} .linearBlueBgfont{background-image: linear-gradient(to right, #26cfff, #e62131); color: #fff; padding: .5em 1em; display: table; margin: 0 auto !important; border-radius: 10px;} .fontRed{color: #e62131;} .mainbox .intro p{color: #777; text-align: justify;} .mainbox .intro.center{text-align: center;} .mainbox.mainboxBlue .inPageTi{color: #fff;} .mainbox.mainboxBlue .intro p{color: #fff;} .mainbox.mainboxMini{padding: 50px 0;} p.textCenter{text-align: center;} /* header */ .header{position: fixed; top: 0; left: 0; width: 100%; height: 90px; background-color: #fff; z-index: 9999; display: flex; padding: 0 50px; justify-content: space-between; align-items:center; border-bottom: 1px solid #e0e0e0;} .header>.menu{display: flex;} .header>.menu>li{padding: 0 20px; position: relative; z-index: 901;} .header>.menu>li>a{display: block; line-height: 90px; font-size: 17px; color: #666; position: relative; z-index: 901;} .header>.menu>li>a::before{content: ''; position: absolute; left: 50%; bottom: 0; background: #e62131; width: 0; height: 5px; transform: translateX(-50%); opacity: 0; transition: all .2s;} .header>.menu>li>a.active{color: #e62131; opacity: 1;} .header>.menu>li>a.active::before{ opacity: 1; width: 20px; } .header>.menu>li>a .iconArrow{font-size: 12px; display: inline-block; transition: all .3s;} .header .menu .submenu{z-index: -1;} .header .menu .submenu .ti{font-size: 24px; border-bottom: 1px solid #ddd; padding-bottom: 20px;} .header .menu .submenu .sti{font-size: 20px; margin-right: 30px;} .header .menu .submenu{position: absolute; top: 90px;z-index: -1; visibility: hidden; opacity: 0; transition: ease .2s; background: #f6f6f6; box-shadow: 0 2px 6px rgba(45, 48, 53, 0.2);} .header .menu .submenu.aboutSub{ width: 1390px; left: 0; top: 90px; transform: translate(-20%,-10px); padding: 80px 160px; display: flex; justify-content: space-between;} /* .header .menu .submenu.aboutSub .menuList{width: inherit; padding: 0 20px;} */ .header .menu .submenu.aboutSub.short{width: 1000px; padding: 80px 100px;} .header .menu .submenu.aboutSub li{margin-bottom: 20px;} .header .menu .submenu.aboutSub a{display: block; font-size: 18px; color: #666666;} .header .menu .submenu.aboutSub a.ti{font-size: 24px; color: #000; line-height: 1.3em;} .header .menu .submenu.aboutSub .ygzb{width: 380px;} .header .menu .submenu.aboutSub .ygzb img{width: 380px;} .header .menu .submenu.groupSub{ width: 1160px; left: 0; top: 90px; transform: translate(-20%,-10px); padding: 80px 80px; display: flex; justify-content: space-between; } .header .menu .submenu.groupSub .menuList{flex: 0 0 28%; } .header .menu .submenu.groupSub .cloud{flex: 0 0 66%; } .header .menu .submenu.groupSub .dap{width: 212px; display: block; margin-bottom: 15px; transition: all .2s;} .header .menu .submenu.groupSub li{border-bottom: 1px solid #d9d9d9;} .header .menu .submenu.groupSub li:last-child{border-bottom: none;} .header .menu .submenu.groupSub .menuList a{display: block; padding: 20px 30px; font-size: 18px; color: #666;} .header .menu .submenu.groupSub.flexfull{flex-wrap: wrap;} .header .menu .submenu.groupSub.flexfull .SDmenu{flex: 1 1 100%;} .header .menu .submenu.groupSub.flexfull .SDmenu:nth-child(1){margin-bottom: 40px;} .header .menu .submenu.groupSub.flexfull .SDmenu:nth-child(2){flex: 0 0 50%;} .header .menu .submenu.groupSub.flexfull .SDmenu:nth-child(3){flex: 0 0 50%;} .header .menu .submenu.groupSub .SDmenu{ padding-right: 40px; } .header .menu .submenu.groupSub .SDmenu .ti{margin-bottom: 20px; } .header .menu .submenu.groupSub .SDmenu ul{display: flex; flex-wrap: wrap; margin: 0 -15px -40px;} .header .menu .submenu.groupSub .SDmenu li{border: none; margin-bottom: 40px; padding: 0 15px;} .header .menu .submenu.groupSub .SDmenu:nth-child(1) li{flex: 0 0 14.28%; } .header .menu .submenu.groupSub .SDmenu a{display: block; text-align: center; color: #666;} .header .menu .submenu.groupSub .SDmenu a.ti{text-align: left; } .header .menu .submenu.groupSub .SDmenu a.ygbrain span{font-size: 12px;} .header .menu .submenu.groupSub .SDmenu a.ygbrain span i{transform: scale(1);} .header .menu .submenu.groupSub .SDmenu img{background: #fff; padding: 10px; max-width: 100%; height: 100px; display: table; border-radius: 10px; margin: 0 auto 10px; object-fit: contain; transition: all .3s;} .header .menu .submenu.groupSub .SDmenu:nth-child(2) img{height: 120px;} .header .menu .submenu.groupSub .SDmenu:nth-child(3) img{height: 120px;} .header .menu .submenu.groupSub .cloud{ border-left: solid 1px #d9d9d9; padding-left: 60px;} .header .menu .submenu.groupSub .title{font-size: 24px; color: #666666; border-bottom: 1px solid #d9d9d9; display: block;padding-bottom: 10px; margin-bottom: 20px;} .header .menu .submenu.groupSub .li{display: flex; margin-bottom: 20px; border-bottom: 1px dashed #d9d9d9;} .header .menu .submenu.groupSub .li:last-child{border: none;} .header .menu .submenu.groupSub .li .ti{flex: 0 0 25%; font-size: 18px; color: #1758a7;} .header .menu .submenu.groupSub .SDmenu a.ti img{ background: none; height: unset; display: inline-block; margin-bottom: 0;} .header .menu .submenu.groupSub .cloudMenu{display: flex; flex-wrap: wrap; flex: 0 0 75%;} .header .menu .submenu.groupSub .cloudMenu li{border: none; flex: 0 0 20%; margin-bottom: 30px;} .header .menu .submenu.groupSub .cloudMenu img{display: block; margin-right: 0; transition: all .2s; margin: 0 auto 10px;} .header .menu .submenu.groupSub .cloudMenu a{font-size: 16px; color: #666; display: block; text-align: center;} .header .menu .submenu.normalMenu{width: 720px; transform: translate(-20%,-10px); padding: 30px 50px;} /* .header .menu .submenu.normalMenu{width: 800px;} */ .header .menu .submenu.normalMenu .menuList{display: flex; flex-wrap: wrap; margin: 0 -20px;} .header .menu .submenu.normalMenu .menuList li{flex: 0 0 50%; padding: 0 20px;} .header .menu .submenu.normalMenu .menuList a{display: block; padding: 15px 0; font-size: 18px; color: #666;} .header .menu .submenu.normalMenu .menuList a.ti{font-size: 24px; padding-top: 0; color: #000;} .header .menu .submenu.normalMenu .menuList a.sti{font-size: 14px;} .header .menu .submenu.normalMenu .menuList a:hover{color: #e62131;} .header .menu .submenu.normalMenuB{width: 600px; background: #f6f6f6; transform: translate(-20%,-30px); padding: 40px 60px 60px;} .header .menu .submenu.normalMenuB .ti{font-size: 24px; color: #666;padding: 20px 0;} .header .menu .submenu.normalMenuB li{display: flex; gap: 60px; border-bottom: 1px solid #d9d9d9;} .header .menu .submenu.normalMenuB li:last-child{border: none;} .header .menu .submenu.normalMenuB li a{display: block;;padding: 20px 0; color: #666; font-size: 18px;} .header .menu .submenu.normalMenuB.SC{width: 850px; left: unset; right: 0; transform: translate(20%,-10px);} .header .menu .submenu.normalMenu.Join{width: 600px; left: unset; right: 0; transform: translate(40%,-10px);} .header .searchBox{text-align: right;} .header .searchBox input{ width: 260px; height: 36px; float: left; border: none; background: #f5f5f5; border-radius: 5px 0 0 5px; padding: 0 15px; font-size: 14px; outline: none;} .header .searchBox .search-button{width: 36px; line-height: 36px; display: inline-block; text-align: center; background: #0061ae; color: #fff; border-radius: 0 5px 5px 0; cursor: pointer;} .header .searchBox .lang{margin-bottom: 5px;} .header .searchBox .lang span{font-size: 14px;color: #666; padding: 0 2px;} .header .searchBox .lang .langBt{cursor: pointer;} .header .searchBox .lang .langBt.active{color: #0061ae; font-weight: bold;} @media screen and (min-width: 1023.5px) { .header .menu .submenu.aboutSub a:hover{color: #e62131;} .header .menu .submenu.groupSub .title:hover{color: #e62131;} .header>.menu>li:hover>a .iconArrow{transform: rotate(-180deg);} .header>.menu>li:hover>a{color: #e62131;} .header>.menu>li>a:hover::before{width: 20px; opacity: 1;} .header>.menu>li:hover .submenu{visibility: visible; opacity: 1; transform: translate(-20%,0); z-index: 90;} .header>.menu>li:hover .submenu.normalMenuB.SC{transform: translate(20%,0); z-index: 90;} .header>.menu>li:hover .submenu.normalMenu.Join{transform: translate(40%,0); z-index: 90;} .header .menu .submenu.normalMenuB li a:hover{color: #e62131;} .header .menu .submenu.groupSub .cloudMenu a:hover{color: #e62131;} .header .menu .submenu.groupSub .cloudMenu a:hover img{transform: translateY(-5px);} .header .menu .submenu.groupSub .li .ti:hover{color: #e62131;} .header .menu .submenu.normalMenuB a.ti:hover{color: #e62131;} .header .menu .submenu.groupSub .SDmenu a:hover{color: #e62131;} .header .menu .submenu.groupSub .SDmenu a:hover img{transform: translateY(-5px);} .header .menu .submenu.groupSub .menuList a:hover{color: #e62131;} .header .menu .submenu.groupSub .menuList a:hover .dap{transform: translateY(-5px);} .moblieMenuBt{display: none;} .mask{display: none;} } /* index-banner */ .index-banner{ position: relative; z-index: 1000;} .index-banner .swiper-container{width: 100%; height: auto; padding-top: 80px;} .index-banner img{width: 100%; height: auto; object-fit: cover;} .index-banner video{width: 100%; height: 100%; object-fit: cover; filter: brightness(0.96);} .index-banner .swiper-button-next,.index-banner .swiper-button-prev{background: rgba(246, 246, 246, 0.5) ; width: 30px; height: 48px; line-height: 48px; text-align: center; opacity: 0; transition: all .3s; box-shadow: 0 2px 6px rgba(45, 48, 53, 0.2);} .index-banner .swiper-button-next:hover,.index-banner .swiper-button-prev:hover{background: rgba(255, 255, 255, 1) ; } .index-banner .swiper-button-next{right: 0; border-radius: 10px 0 0 10px;} .index-banner .swiper-button-prev{left: 0; border-radius: 0 10px 10px 0;} .index-banner .iconfont{font-size: 22px; font-weight: 700; opacity: .5; transition: all .3s; color: #0061ae;} .index-banner .swiper-button-next:hover .iconfont,.index-banner .swiper-button-prev:hover .iconfont{opacity: 1; color: #0061ae;} .index-banner .swiper-pagination-bullets{bottom: 20px;} .index-banner .swiper-pagination-bullet{background: #fff; width: 8px; height: 8px; opacity: .5; outline: #0061ae;} .index-banner .swiper-pagination-bullet-active{width: 32px; border-radius: 8px; opacity: 1;} .index-banner:hover .swiper-button-next,.index-banner:hover .swiper-button-prev{opacity: 1;} .index-banner .swiper-button-next:focus ,.index-banner .swiper-button-prev:focus{border: none; outline: none;} .index-banner .swiper-button-next:after,.index-banner .swiper-button-prev:after{display: none;} /* index-solution */ .index-solution .srow{display:flex;flex-wrap:wrap} .index-solution .srow a{margin-right:30px;border:1px solid #888888;border-radius:40px;padding-left:35px;padding-right:35px;padding-top:5px;padding-bottom:5px;font-size:24px;margin-bottom:8px;color:black;} .index-solution .srow a:nth-child(1){border:1px solid white;padding-left:0px;font-weight:bold;} .index-solution .srow a:nth-child(1) img {padding-left:20px; } .index-solution .srow a:nth-child(n+2):hover { cursor: pointer; color: white; background-color: #005bac } .index-solution .sbanner{padding-top:15px} .index-solution .sbanner div a img:hover{transform:scale(1.1);transition:all 1s} .index-solution .sbanner div a{display:block;width:100%;overflow:hidden;border-radius:20px;margin-top:5px;} .index-solution .sbanner div a img{width:100%;transition:all 1s} /* index-about */ .index-about{text-align: center; padding: 120px 0;background:url(/images/index/bg0909.jpg) no-repeat;background-size:100% 100%;} .index-about .template-ti{font-size: 50px; font-weight: bold;} .index-about .template-sti{font-size: 22px; color: #666; margin: 40px 0 0;} .index-about .index-more{margin: 60px auto 0 !important;} .index-about .row{margin-top:60px} .index-about .number{font-size:95px;color:#005bac} .index-about .sub{font-size:23px;color:#666666} .index-data1{transform:translateY(-30vh);opacity:0;transition:all 1s} .index-data2{transform:translateY(-30vh);opacity:0;transition:all 1s} .index-data3{transform:translateY(-30vh);opacity:0;transition:all 1s} .row1 .active { transform: translateY(0); opacity: 1; } .index-data2 { border-left:1px solid #ccc; border-right:1px solid #ccc; } /* index-Recommend */ .index-Recommend .container { width: 1540px; } .index-Recommend .box{box-shadow: 0 0 15px rgb(195 204 220 / 50%); border-radius: 15px; border-radius: 20px; overflow: hidden; } .index-Recommend .row .box{position: relative; padding-bottom: 90px; background: #fff;} .index-Recommend .img{transition: all .2s; overflow: hidden;} .index-Recommend .img img{width: 100%; border-radius: 15px 15px 0 0; transition: all .3s;} .index-Recommend .row{margin: 80px -50px 0;} .index-Recommend .col-lg-6{padding: 0 50px;} .index-Recommend .con{padding: 50px; text-align: left; background: #fff; border-radius: 0 0 15px 15px;} .index-Recommend .con h5{font-size: 30px; color: #585858; margin-bottom: 30px; font-weight: bold; transition: all .3s;} .index-Recommend .con p{font-size: 16px; color: #999; line-height: 1.8em; text-align: justify;} .index-Recommend .box .tem-more{position: absolute; left: 50%; bottom: 50px; transform: translateX(-50%);} .index-Recommend .col-lg-6:hover .img{ transform: translate(0,-8px);box-shadow: 0 8px #005bac;} .index-Recommend .col-lg-6:hover .img img{transform: scale(1.03);} .index-Recommend .col-lg-6:hover h5{color: #e62131;} .ZTPD {display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:2fr 2fr;grid-column-gap:40px;grid-row-gap:40px; margin-top: 100px;} .ZTPD .box{width: 100%; height: 100%; background-size: cover; border-radius: 10px; position: relative;} .ZTPD .box img{width: 100%; height: 100%; object-fit: cover; border-radius: 10px; transition: all .3s;} .ZTPD .boxA {grid-area:1 / 1 / 3 / 2;background:#111;} .ZTPD .boxB {grid-area:1 / 2 / 2 / 3;background:#333;} .ZTPD .boxC {grid-area:1 / 3 / 2 / 5;background:#666;} .ZTPD .boxD {grid-area:2 / 2 / 3 / 4;background:#999;} .ZTPD .boxE {grid-area:2 / 4 / 3 / 5;background:#CCC;} .ZTPD .more{position: absolute; left: 0; top:0; background: rgba(0, 91, 172, 0.75); width: 100%; height: 100%; cursor: pointer; visibility: hidden; opacity: 0; transition: all .2s; border-radius: 10px;} .ZTPD .more .bt{border: solid 1px #e6e6e6; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-35%); padding: 5px 15px; border-radius: 10px; color: #fff; font-size: 18px; transition: all .2s; transition-delay: .1s; opacity: 0; background: none;} .ZTPD .more .bt:hover{background: #fff; color: #005bac;} .ZTPD .more .bt:hover::before{background: #005bac;} .ZTPD .more .bt .iconfont::after{background: #fff;} .ZTPD .more .bt:hover .iconfont::after{background: #005bac;} .ZTPD .box:hover .more{visibility:visible; opacity: 1;} .ZTPD .box:hover .more .bt{transform: translate(-50%,-100%); opacity: 1;} .ZTPD .box:hover img{transform: scale(1.03);} /* index-products */ .index-products {padding-bottom: 0;} .index-products .content{ padding: 100px 0; margin-top: 60px; position: relative;} .index-products .content .bg{position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 0;} .index-products .imgBg{position: relative; z-index: 2;} .index-products .nav-pills{margin-right: 250px !important; position: relative; z-index: 1;} .index-products .nav-pills .nav-link{display: flex; width: 300px; height: 100px; justify-content: center; align-items: center; gap: 20px; background: rgba(255, 255, 255, 0.4); margin-bottom: 30px; border-radius: 10px; transition: all .3s; position: relative; border: none; outline: none;} .index-products .nav-pills .nav-link:last-child{margin-bottom: 0;} .index-products .nav-pills .nav-link p{font-size: 36px; font-weight: bold; color: #fff; text-shadow: rgba(188, 188, 188, 0.5);} .index-products .nav-pills .nav-link img{filter: grayscale(100%) brightness(1000%);} .index-products .nav-pills .nav-link.active{background: rgba(255, 255, 255, 1); width: 340px;} .index-products .nav-pills .nav-link.active p{color: #0061ae;} .index-products .nav-pills .nav-link.active img{filter: grayscale(0) brightness(100%);} .index-products .nav-pills .nav-link::after{content: ''; width: 100%; height: 100%; box-shadow: inset 0 0 2px rgba(255, 255, 255, 0.85); position: absolute; left: 0; top: 0; border-radius: inherit; opacity: 0; transition: all .3s;} .index-products .nav-pills .nav-link:hover{ background: rgba(255, 255, 255, 0.5);} .index-products .nav-pills .nav-link:hover::after{opacity: 1;} .index-products .nav-pills .nav-link.active:hover{ background: rgba(255, 255, 255, 1);} .index-products .con{text-align: left;} .index-products .con h5{font-size: 60px; font-weight: bold; color: #fff;} .index-products .con p{font-size: 18px; color: #fff; margin: 30px 0; line-height: 1.8em;} .index-products .con .index-more{margin: 40px 0 0 !important; background: rgba(255, 255, 255, 0); border: solid 1px #fff;} .index-products .con .index-more:hover{ background: rgba(255, 255, 255, 1 ); color: #0061ae; transform: none;} .index-products .index-more .iconfont::after{background: #fff;} .index-products .con .index-more:hover .iconfont::after{background: #0061ae;} .index-products .pdtext{margin-top: 40px; display: flex; flex-wrap: wrap;} .index-products .pdtext .li{padding-right: 30px ;border-right: solid 1px #fff; margin-right: 30px; margin-bottom: 30px;} .index-products .pdtext h6{font-size: 30px; color: #fff; font-weight: bold;} .index-products .pdtext .pddt{margin-top: 20px;} .index-products .pdtext .pddt li{font-size: 16px; color: #fff; line-height: 2em;} /* index-news */ .index-news .content{overflow: hidden; display: flex; column-gap: 60px;} .index-news .container{width: 1680px; max-width: 1680px;} .index-news .borderBottom{margin-bottom: 60px;} .index-news .left{ display: flex; flex-wrap: wrap; margin: 0 -15px; width: 1100px;} .index-news .left .con{padding: 0 15px; flex: 0 0 50%; max-width: 50%; margin-bottom: 30px;} .index-news .left .con .img{overflow: hidden; border-radius: 10px; position: relative; padding-bottom: 43%;} .index-news .left .con img{width: 100%;height: 100%; transition: all .3s; border-radius: 10px; position: absolute; left: 0; top: 0; object-fit: cover; object-position: center;} .index-news .left .con .title{font-size: 20px; color: #585858; line-height: 1.5em; height: 3em; margin-top: 15px; transition: all .3s;} .index-news .left .con:hover img{transform: scale(1.05);} .index-news .left .con:hover .title{color: #e62131;} .index-news .right{max-width: 580px;} .index-news .right .list{border-top: 1px solid #e0e0e0;} .index-news .right .list a{padding: 5px 0; display: block;} .index-news .right .list .time{font-size: 14px; color: #999999;} .index-news .right .list .title{font-size: 20px; color: #585858; line-height: 1.5em; height: 3em; margin-top: 5px; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2; /*这里设置几行*/overflow: hidden;} .index-news .right .list:hover{background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(230,230,230,0.4) 100%);} .index-news .right .list:hover .title{color: #e62131;} /* customers */ .customers{position: relative; background: url('../images/index/cusbg.jpg') no-repeat; width: 100%; background-size: cover; overflow: hidden; background-attachment: fixed;} .customers .template-ti{margin-bottom: 70px; color: #fff; position: relative; z-index: 3;} .customers .logoArea{display: flex; flex-wrap: wrap; position: relative; z-index: 2; margin: 0 -20px -40px;} .customers .logoArea .li{flex: 0 0 12.5%; max-width: 12.5%; padding: 0 20px; margin-bottom: 40px;} .customers .logoArea .box{transition: all .3s;} .customers .logoArea .box:hover{transform: translateY(-10px);} .customers .logoArea .img{margin: 0; padding: 0;} .customers .logoArea img{width: 100%; opacity: .80; border-radius: 10px 10px 0 0 ; transition: all .3s;} .customers .logoArea .name{background: #fff; text-align: center; line-height: 40px; border-radius: 0 0 10px 10px ; margin: 0; transition: all .3s;} .customers .logoArea .box:hover img{opacity: 1;} .customers .tem-more{position: relative; z-index: 3;} .customers #canvas { width: 100%; height: 100%; position: absolute; display: block; top: 0; left: 0; z-index: 1; background: rgba(0, 0, 0, 0.3); } /* footer */ .footer{background: #013161;} .footer .container{width: 1460px;} .footer .top{padding: 72px 0; overflow: hidden; width: 100%; display: flex; justify-content: space-between;} .footer .menu-list{} .footer .menu-list:last-child{float: right; margin-right: 0;} .footer .menu-list h5{font-size: 20px; color: #fff; margin-bottom: 30px; line-height: 1em; display: block; transition: all .3s;} .footer .menu-list a.link{font-size: 20px; color: #fff; margin-bottom: 30px; line-height: 1em; display: block; transition: all .3s;} .footer .menu-list a.link:hover{color: #0061ae;} .footer .menu-list h5.link{display: none;} .footer .menu-list ul{} .footer .menu-list ul li{line-height: 2em; margin-bottom: 5px; font-size: 14px; color: #72bcf6;} .footer .menu-list ul li a{font-size: 14px; color: #72bcf6; transition: all .2s;} .footer .menu-list ul li a:hover{color: #ddd;} .footer .bottom{overflow: hidden; line-height: 66px; border-top: 1px solid #005bac;} .footer .bottom .copy{float: left;} .footer .bottom .copy p,.footer .bottom .copy a{display: inline-block; font-size: 14px; color: #c4c9cf; margin-right: 15px; transition: all .2s ;} .footer .bottom .copy a:hover{color: #ddd;} .footer .bottom .LM{float: right;} .footer .bottom .LM a{display: inline-block; font-size: 14px; color: #c4c9cf; margin-right: 15px; transition: all .2s;} .footer .bottom .LM a:hover{color: #ddd;} .footer .bottom .LM a:last-child{margin-right: 0; position: relative;} .footer .bottom .LM a:last-child::before{content: ''; background: #353f4d; width: 1px; height: 14px; position: absolute; left: 0; top: 50%; transform: translate(-10px,-7px);} /* abouts */ .pageBanner{width: 100%; background-repeat: no-repeat; margin-top: 80px; background-size: cover; background-position: center;} .pageBanner.abouts{height: 480px;} .pageBanner .title{font-size: 48px; color: #fff; font-weight: bold; padding-top: 120px; text-align: center; letter-spacing: 0.3em; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);} .pageBanner .intro{width: 1280px; display: table; margin: 30px auto 0; background: rgba(0, 0, 0, 0.3); padding: 20px; border-radius: 10px; backdrop-filter: blur(10px); max-width: 100%;} .pageBanner .intro p{color: #fff; line-height: 2em;} .pageBanner h6{font-size: 20px; color: #fff; text-align: center; margin-top: 20px;} .aboutMenu{background: #f6f6f6; position: sticky ; top: 90px; z-index: 99; border-bottom: 1px solid #ddd;} .aboutMenu .menu{} .aboutMenu .menu a{line-height: 60px; display: inline-block; font-size: 18px; color: #888; position: relative; padding: 0 20px;} .aboutMenu .menu a.active{color: #000;} .aboutMenu .menu a::after{content: ''; width: 80px; height: 3px; background: #005bac; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);display: none;} .aboutMenu .menu a.active::after{display: block;} .aboutMenu .menu a:hover{background: #e6e6e6;} .aboutMenu.dropMenu .menu{display: flex; flex-wrap: nowrap;} .aboutMenu.dropMenu .li{position: relative; width: auto; display: flex;} .aboutMenu.dropMenu .li .drop{position: absolute; left: 0; top: 100%; width: 240px; background: #e6e6e6; visibility: hidden; opacity: 0; transform: translateY(-10px); transition: all .3s;} .aboutMenu.dropMenu .li .drop a{display: block; font-size: 14px;line-height: 1.5em; padding: 15px 20px;} .aboutMenu.dropMenu .li .drop a:hover{background: #005bac; color: #fff;} .aboutMenu.dropMenu .iconDown{font-size: 10px; margin-left: 10px;} .aboutMenu.dropMenu .li:hover .drop{visibility: visible; opacity: 1; transform: translateY(0);} /* aboutPage */ .aboutPage{text-align: center; overflow: hidden;} .aboutPage .video{width: 1160px; border: solid 10px #ffffff; box-shadow: 10px 10px 30px rgba(110, 112, 145, 0.5); display: inline-block; margin-bottom: 120px;} .aboutPage .video video{width: 100%;} .aboutPage .intro {width: 940px; display: inline-block; text-align: left; margin-top: 50px;} .aboutPage .intro p{font-size: 18px; color: #777; line-height: 1.8em; margin-bottom: 30px;} .aboutPage.company{background: url('../images/about/companybG.jpg') no-repeat; width: 100%; background-size: cover; background-attachment: fixed;} .aboutPage.company .row{margin: 60px -20px -20px;} .aboutPage.company .col-lg-3{padding: 0 20px; } .aboutPage.company .col-12{margin-bottom: 30px;} .aboutPage.company .box{background: #fff;text-align: center; position: relative; box-shadow: 0 0 2px #e5edf6; transition: all .3s; height: 100%; padding: 50px 20px; border-radius: 20px; transition: all .3s;} .aboutPage.company .box:hover{background: #fff; box-shadow: 0 0 20px #e5edf6;} .aboutPage.company .box:hover::before{width: 60px; opacity: 1;} .aboutPage.company .box .logo{margin: 0 auto 20px;} .aboutPage.company .box .logo img{max-height: 50px; max-width: 100%;} .aboutPage.company .box h5{font-size: 16px; color: #35456f; font-weight: bold; line-height: 1.8em; margin-bottom: 15px; transition: all .3s;} .aboutPage.company .box p{font-size: 14px; color: #666; text-align: left;} .aboutPage.company .box .more{width: 120px; line-height: 30px; background: #1758a7; color: #fff; display: inline-block; border-radius: 10px; margin-top: 20px;} .aboutPage.company .box:hover{transform: translateY(-10px);} .aboutPage .leader{display: flex; margin: 80px -30px 60px;} .aboutPage .leader .pic{flex: 0 0 50%; position: relative;} .aboutPage .leader .pic img{width: 660px; position: relative; border-radius: 20px;} .aboutPage .leader .con{flex: 0 0 50%; padding: 0 30px;} .aboutPage .leader .con p{font-size: 18px; color: #777; line-height: 1.8em; text-align: justify; margin-bottom: 30px;} .honorPage{padding:100px 80px;} .honorPage .cardRow{margin: 80px -40px -60px;} .honorPage .cardRow .col-12{padding: 0 40px; margin-bottom: 80px; } .honorPage .card {cursor:pointer;width: 100%; height: 350px; background: none; border: none;} .honorPage .front,.honorPage .back {width:100%;height:100%;overflow:hidden; backface-visibility:hidden;position:absolute;transition:transform .6s linear; text-align: center; border-radius: 20px; background: linear-gradient(145deg, #f1f4f9, #ffffff); box-shadow: inset 10px 10px 25px #e8ebf1, -10px -10px 30px #ffffff; padding: 40px 40px 0; height: 100%;;} .honorPage .front .DSbox{ } .honorPage .front .DSbox h5{margin-top: 40px; font-weight: bold; font-size: 1rem; line-height: 1.5em;} .honorPage .front .img{ margin: 0 auto;} .honorPage .front img {max-width: 100%;max-height: 210px;/* mix-blend-mode: multiply; */} .honorPage .front { transform:perspective(600px) rotateY(0deg);} .honorPage .sm { margin:20px 0;} .honorPage .sm a { display:inline-flex;width:40px;height:40px;justify-content:center;align-items:center;color:#2c3e50;font-size:18px;transition:0.4s;border-radius:50%;} .honorPage .sm a:hover { font-size:25px;background:#2c3e50;color:white;} .customer-page{background: none;} .customer-page .logoArea .img{background: #fafafb;border-radius: 10px 10px 0 0;} .customer-page .logoArea img{opacity: 1; mix-blend-mode: multiply; border-radius: 10px 10px 0 0;} .customer-page .logoArea .name{background: #e8e8e8; font-size: 14px; line-height: 1.5em; padding: 1em .5em;} .customer-page .template-text{width: 1000px; display: table; margin: 0 auto 60px;} .customer-page .template-text p{font-size: 18px; color: #777; line-height: 1.8em;} .customer-page .nav{justify-content:center; margin-bottom: 60px !important; } .customer-page .nav .nav-link{padding: .8em 2em; border-radius: 10px; background: #f6f6f6; color: #000; font-size: 18px; margin: 0 3px;} .customer-page .nav .nav-link img{max-width: 20px; max-height: 20px; object-fit: cover; transform: translateY(-2px); margin-right: 5px;} .customer-page .nav .nav-link.active{background: #0061ae; color: #fff;} .customer-page .nav .nav-link.active img{filter: brightness(10000) !important; } /* newsMenu */ .newsMenu{background: #fff; padding: 30px 0;} .newsMenu ul{display: flex; margin: 0 auto; align-items: center; justify-content: center;} .newsMenu ul li{margin: 0 20px; color: #000;} .newsMenu ul a{display: block; line-height: 50px; color: #666; position: relative;} .newsMenu ul a::before{content: ''; position: absolute; left: 50%; bottom: 0;transform: translateX(-50%); width: 20px; height: 5px; border-radius: 5px; background: #005bac; display: none;} .newsMenu ul a.active{color: #005bac; } .newsMenu ul a.active::before{display: block;} .newsArea{} .newsArea .top{margin-bottom: 60px;} .newsArea .top a{display: block; padding: 30px; background: #f6f6f6; display: flex; border-radius: 20px; transition: all .3s;} .newsArea .top .pic{max-width: 50%; flex: 0 0 50%; overflow: hidden; border-radius: 20px; } .newsArea .top .pic img{width: 100%; transition: all .3s;} .newsArea .top .con{max-width: 50%; flex: 0 0 50%; padding: 30px; position: relative;} .newsArea .top .con .ti{font-size: 24px; color: #000; margin-bottom: 40px; transition: all .3s;} .newsArea .top .con p{font-size: 18px; color: #888; overflow: hidden; line-height: 1.8em; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;} .newsArea .top .bottom{position: absolute; left: 0; bottom: 0; padding: 30px 30px 0; display: flex; align-items: flex-end; justify-content: space-between; width: 100%;} .newsArea .top .bottom .date{font-size: 14px; color: #888;} .newsArea .top .bottom .nt{font-size: 14px; color: #fff; background: #e62131; padding: 10px 30px; border-radius: 20px;} .newsArea .top a:hover .ti{ color: #e62131;} .newsArea .top a:hover img{transform: scale(1.05);} .newsList{display: flex; margin: 0 -30px -60px; flex-wrap: wrap;} .newsList .li{padding: 0 30px; margin-bottom: 60px; max-width: 33.333333%; flex: 0 0 33.333333%; } .newsList a{display: block; height: 100%;background: #f6f6f6; border-radius: 20px; transition: all .3s;} .newsList .pic{width: 100%; overflow: hidden;border-radius: 20px 20px 0 0; position: relative; padding-bottom: 43%;} .newsList .pic img{width: 100%; height: 100%; position: absolute; left: 0; top: 0; transition: all .3s; object-fit: cover; object-position: center;} .newsList .con{ padding: 40px 30px;} .newsList h5{font-size: 20px; color: #000; margin-bottom: 20px; transition: all .3s;} .newsList p{font-size: 16px; line-height: 1.8em;;color: #888; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;} .newsList a:hover {transform: translateY(-5px);} .newsList a:hover img{transform: scale(1.05);} .newsList a:hover h5{color: #e62131; } .newsDetail{display: flex; flex-wrap: nowrap; gap: 60px;} .newsDetail .menuCon{flex: 1 1 20%;} .newsDetail .menuCon .menu{background: #fff; padding: 20px; border-radius: 20px; margin-bottom: 20px;} .newsDetail .menuCon .ti{font-size: 20px; padding: 10px; border-radius: 10px; color: #000; font-weight: bold;} .newsDetail .menuCon .menu a{display: block; padding: 10px; margin-top: 20px; border-bottom: 1px solid #e6e6e6; color: #666;} .newsDetail .menuCon .menu a.active{background: #f6f6f6; border-radius: 10px; color: #fff; background: #005bac;} .newsDetail .newsList{margin: 0; display: block; padding: 20px; background: #fff; border-radius: 20px;} .newsDetail .newsList .li{padding: 0; max-width: unset; margin: 20px 0 0;} .newsDetail .newsList .li a{background: none;} .newsDetail .newsList .con{padding: 20px 0;} .newsDetail .newsList h5{margin-bottom: 0; font-size: 16px;} .newsDetail .newsList .pic img{border-radius: 10px;} .newsDetail .content{flex: 1 1 80%; background: #fff; border-radius: 20px; padding: 60px;} .newsDetail .content .top{padding-bottom: 20px; border-bottom: solid 1px #e6e6e6; margin-bottom: 40px;} .newsDetail .content .top .title{font-size: 30px; line-height: 1.5em; font-weight: 500; padding-bottom: 15px; text-align: center;} .newsDetail .content .top .info{ display: flex; justify-content: center;} .newsDetail .content .top .info li{ font-size: 14px; color: #888; margin-right: 2em;} .newsDetail .content .pic{margin: 50px auto; display: table;} .newsDetail .content .pic img{max-width: 100%; border-radius: 20px;} .newsDetail .content .PointTi{font-size: 20px; display: table; margin: 0 auto 30px; color: #005bac; position: relative; padding: 0 20px; font-weight: bold;} .newsDetail .content .PointTi::before ,.newsDetail .content .PointTi::after{content: ''; width: 8px; height: 8px; background: #005bac; border-radius: 50%; position: absolute; top: 50%; transform: translateY(-50%);} .newsDetail .content .PointTi::before{left: 0;} .newsDetail .content .PointTi::after{right: 0;} .newsDetail .content .normalTi{font-size: 20px; font-weight: bold; margin-bottom: 30px;} .newsDetail .content .normalTi.center{text-align: center;} .newsDetail .content p{line-height: 1.8em; margin-bottom: 1em; text-indent: 2em; color: #666;} .newsDetail .content p.focus{background: #005bac; color: #fff; padding: 20px; border-radius: 20px;} .newsDetail .content p img{display: block; margin: 0 auto;} .newsDetail .content .prevNext{ margin: 60px 0 0; border-top: solid 1px #ddd; padding-top: 20px;} .newsDetail .content .prevNext a{ text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; font-size: 16px; line-height: 2em; color: #888; margin-top: 10px;} .newsDetail .content .prevNext a:hover{color: #e62131;} .newsDetail .content .prevNext a.prev::before{content: '上一篇：';} .newsDetail .content .prevNext a.next::before{content: '下一篇：';} .SearchPageArea{width: 50vw; margin: 60px auto;} .search-area{width: 100%; position: relative; border-radius: 20px; overflow: hidden;} .search-area .input{width: 100%; height: 60px; outline: none; padding-left: 60px; border: none; background: #f6f6f6; padding-right: 220px;} .search-area .iconfont{ width: 60px; line-height: 60px; position: absolute; left: 0; top: 0; font-size: 30px; color: #005bac; display: block; text-align: center;} .search-area .button{width: 200px; height: 60px; position: absolute; right: 0; top: 0;} .search-area button{width: 100%; height: 100%; background: #005bac; color: #fff; border: none; outline: none;} /* pagiGroup */ .pagiGroup{display: table; margin:0 auto 0;} .pagiGroup.left{margin: 30px 0 0 ;} .pagiGroup li{display: inline-block; margin: 0 5px;} .pagiGroup li a{width: 36px; line-height: 36px; background: #e0e4ef; color: #8f9dc1; border-radius: 50%; display: block; text-align: center; transition: all .3s;} .pagiGroup li a:hover{background: #e4ecff;} .pagiGroup li .active{background: #005bac; color: #fff;} .pagiGroup li .active:hover{-webkit-filter: brightness(1.2); background: #005bac;} /* responsibility-page */ .responsibility-page{} .responsibility-page .row{margin: 80px -30px -40px; justify-content: center;} .responsibility-page .col-lg-6{padding: 0 30px;} .responsibility-page .col-lg-3{padding: 0 30px; margin-bottom: 60px;} .responsibility-page .col-lg-4{padding: 0 30px; margin-bottom: 60px;} .responsibility-page .box{background: #f6f6f6; height: 100%; border-radius: 20px; transition: all .3s;} .responsibility-page .img{margin-bottom: 0; border-radius: 20px 20px 0 0;} .responsibility-page .img img{width: 100%; border-radius: 20px 20px 0 0;} .responsibility-page .box p{font-size: 18px; color: #666; line-height: 1.8em; text-align: justify; padding: 20px;} .responsibility-page .col-lg-3 p{font-size: 16px;} .responsibility-page.mainboxGray .box{background: #fff;} .responsibility-page .box:hover{transform: translateY(-10px);} .investor{} .investor .form{margin-top: 60px;} .investor .form{display: flex; flex-wrap: wrap; margin: 60px -30px 0;} .investor .form .ul{flex: 0 0 33.33333%; max-width: 33.33333%; font-size: 16px; color: #666; padding: 0 30px; margin-bottom: 30px;} .investor .form li{margin-bottom: 20px;} .investor .form p{position: relative; background: #f6f6f6; line-height: 60px;border-radius: 10px; text-align: left; padding-left: 170px;} .investor .form .red{background: #da242b; color: #fff; width: 150px; position: absolute; left: 0; top: 0; border-radius: 10px 0 0 10px; padding: 0 0 0 20px;} .investor .shares{display: flex; margin: 60px -40px 0;} .investor .shares .shares-li{flex: 0 0 50%; max-width: 50%; padding: 0 40px; border-radius: 20px;} .investor .shares h5{background: #da242b; color: #fff; text-align: center; line-height: 72px; border-radius: 20px 20px 0 0; font-size: 24px;} .investor .shares .img{padding: 60px 40px; background: #fff; border-radius: 0 0 20px 20px;} .investor .shares img{width: 100%;} .investor .one-pic{width: auto; display: table; margin: 60px auto 0;} .investor .one-pic img{max-width: 100%;} .investor .record-sheet{} .investor .record-sheet .row{margin: 60px -30px 0;} .investor .record-sheet .col-xl-4{padding: 0 30px; margin-bottom: 60px;} .investor .record-sheet .con{ display: block; height: 100%;} .investor .record-sheet .time{background: #da242b; display: inline-block; padding: 10px 20px; color: #fff; border-radius: 10px 10px 0 0;} .investor .record-sheet .ti{background: #fff; padding: 20px; } .investor .record-sheet .ti h5{ color: #000; font-size: 16px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.8em;} .investor .notice{} .investor .notice .row{margin:0 -30px 0;} .investor .notice .col-lg-6{padding: 0 30px; margin-bottom: 40px;} .investor .notice .template-ti{font-size: 30px; margin-bottom: 60px;} .investor .notice-list{} .investor .notice-list li{width: 100%; margin-bottom: 20px; line-height: 60px;} .investor .notice-list a{position: relative; display: block; padding: 0 20px; background: #f6f6f6; font-size: 14px; border-radius: 15px;} .investor .notice-list p{color: #23252a; position: relative; padding: 0 90px 0 20px; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden; height: 60px;} .investor .notice-list p::after{content: ''; width: 5px; height: 5px; background: #da242b; border-radius: 50%; position: absolute; left: 0; top: 50%; transform: translate(0,-50%);} .investor .notice-list .time{position: absolute; right: 20px; top: 0; color: #888;} .investor .notice-list a:hover{background: #da242b;} .investor .notice-list a:hover p::after{background: #fff;} .investor .notice-list a:hover p,.investor .notice-list a:hover .time{color: #fff;} .investorInpage .notice{} .investorInpage .notice .row{margin:0 -15px 0;} .investorInpage .notice .col-xl-6{padding: 0 15px; margin-bottom: 30px;} .investorInpage .notice .template-ti{font-size: 30px; margin-bottom: 60px;} .investorInpage .notice-list{} .investorInpage .notice-list li{width: 100%; margin-bottom: 20px; line-height: 60px; border-radius: 10px; overflow: hidden;} .investorInpage .notice-list a{position: relative; display: block; padding: 0 20px; background: #f6f6f6; font-size: 14px;} .investorInpage .notice-list p{color: #23252a; position: relative; padding: 0 90px 0 20px; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden; height: 60px;} .investorInpage .notice-list p::after{content: ''; width: 5px; height: 5px; background: #da242b; border-radius: 50%; position: absolute; left: 0; top: 50%; transform: translate(0,-50%);} .investorInpage .notice-list .time{position: absolute; right: 20px; top: 0; color: #888;} .investorInpage .notice-list a:hover{background: #da242b;} .investorInpage .notice-list a:hover p::after{background: #fff;} .investorInpage .notice-list a:hover p,.investorInpage .notice-list a:hover .time{color: #fff;} .investorInpage .Inpage-area{display: flex;} .investorInpage .Inpage-area .left-area{flex: 0 0 75%; max-width: 75%;} .investorInpage .Inpage-area .top-item{overflow: hidden; margin-bottom: 30px; border-bottom: 2px dashed #e6e6e6; } .investorInpage .Inpage-area .top-item li{float: left;} .investorInpage .Inpage-area .top-item .link{display: block; width: 120px; line-height: 50px; background: #f6f6f6; text-align: center; color: #333; box-shadow: 0 0 5px rgba(0, 13, 27, .1); transition: all .3s;} .investorInpage .Inpage-area .top-item .link:hover{color: #e62131;} .investorInpage .Inpage-area .top-item .link.active{background: #e62131; color: #fff; border-radius: 10px 10px 0 0 ;} .investorInpage .Inpage-area .top-item .ti{line-height: 50px; font-size: 18px;} .investorInpage .Inpage-area .left-area .text{margin-bottom: 30px; overflow: hidden;} .investorInpage .Inpage-area .left-area .text p{line-height: 1.8em; text-indent: 2em; color: #666; margin-bottom: 10px;} .investorInpage .Inpage-area .left-area .text strong{line-height: 1.8em; margin-bottom: 10px; display: block;} .investorInpage .Inpage-area .left-area .text .PDF{float: right;} .investorInpage .Inpage-area .left-area .text .PDF img{width: 24px; margin-right: 10px;} .investorInpage .Inpage-area .left-area .table{text-align: left; margin-top: 0; border-radius: 10px; overflow: hidden;} .investorInpage .Inpage-area .w140{width: 140px;} .investorInpage .Inpage-area .left-area .table th{background: #005bac; color: #fff;} .investorInpage .Inpage-area .left-area .table td{font-size: 14px;} .investorInpage .Inpage-area .notice-list li{ box-shadow: 0 0 5px rgba(0, 13, 27, .08);} .investorInpage .Inpage-area .right-area{margin-left: 60px; flex: 0 0 25%; min-width: 25%;} .investorInpage .Inpage-area .right-area .nav{margin-bottom: 30px; background: #f6f6f6; padding: 10px ; border-radius: 20px; overflow: hidden;} .investorInpage .Inpage-area .right-area .nav li{display: block; width: 100%;} .investorInpage .Inpage-area .right-area .nav a{display: block; padding: 12px 10px 12px 20px; color: #000; position: relative; color: #333; border-radius: 10px;} .investorInpage .Inpage-area .right-area .nav a::after{content: ''; width: 5px; height: 5px; border-radius: 50%; position: absolute; left: 8px; top: 45%; background: #999;} .investorInpage .Inpage-area .right-area .nav a:hover{background: #e62131; color: #fff;} .investorInpage .Inpage-area .right-area .nav a:hover::after{background-color: #fff;} .investorInpage .Inpage-area .right-area .ques{line-height: 1.8em; margin-bottom: 30px; color: #666; text-align: justify;} .investorInpage .Inpage-area .right-area .top-item li{float: none; display: block;line-height: 3em;} .investorInpage .Inpage-area .right-area .top-item li .iconfont{display: inline-block; margin-right: 10px; width: 25px; color: #da242b;} .investorInpage .Inpage-area .right-area .top-item li p{display: inline-block; color: #000;} .investorInpage .pagiGroup li .active{background: #da242b;} /* historyPage */ .historyPage{} .historyPage .container{width: 1360px; max-width: 1360px;} .historyPage .hisList{margin-top: 40px;} .historyPage .hisList .box{padding: 70px 0 20px 220px; position: relative;} .historyPage .hisList .box::before{content: ''; position: absolute; left: 89px; top: 0; background: #ededed; width: 2px; height: 100%;} .historyPage .hisList .box::after{content: ''; position: absolute; left: 89px; top: 50%; background: #e62131; width: 20px; height: 20px; transform: translate(-50%, 80%); border-radius: 50%; border: solid 5px #e6e6e6; transition: all .3s;} .historyPage .hisList .year{position: absolute; left: 20px; top: 0; width: 140px; line-height: 50px; background: #005bac; color: #fff; text-align: center; font-size: 26px; border-radius: 10px; transition: all .3s;} .historyPage .hisList .con{background: #f6f6f6; display: flex; padding: 30px;border-radius: 10px; gap: 40px; position: relative; transition: all .3s;} .historyPage .hisList .con::before{content: ''; width: 80px; height: 2px; background: #ededed; position: absolute; left: -100px; top: 50%;} .historyPage .hisList .img{} .historyPage .hisList .img img{width: 240px; height: 150px; object-fit: cover;border-radius: 10px;} .historyPage .hisList .text{padding: 10px 20px 0;} .historyPage .hisList .text .title{border-left: solid 6px #005bac; line-height: 40px; font-size: 26px; color: #23252a; font-weight: bold; padding-left: 20px; margin-bottom: 20px; letter-spacing: 3px;} .historyPage .hisList .text p{font-size: 16px; color: #666; line-height: 1.8em; text-align: justify;} .historyPage.mainboxGray .con{background: #fff;} .historyPage.mainboxGray .hisList .box::before{background: #e6e6e6;} .historyPage.mainboxGray .hisList .box::after{border: solid 5px #e6e6e6;} .historyPage.mainboxGray .hisList .con::before{background: #e6e6e6;} .historyPage .hisList .box:hover .con{box-shadow: 5px 5px 15px #e6ebf3; transform: scale(1.03);} .historyPage .hisList .box:hover .year{background: #da242b;} .historyPage .hisList .box:hover::after{transform: translate(-50%, 80%) scale(1.5);} /* contactsPage */ .contactsPage{} .contactsPage .ygZH{display: flex; background: #f6f6f6; height: 344px; border-radius: 15px;} .contactsPage .ygZH .img{} .contactsPage .ygZH .img img{width: 500px; height: 344px; border-radius: 15px 0 0 15px;} .contactsPage .ygZH .con{padding: 50px 70px;} .contactsPage .ygZH h5{font-size: 26px; font-weight: bold; margin-bottom: 50px; letter-spacing: 1px;} .contactsPage .ygZH ul{display: flex; flex-wrap: wrap;} .contactsPage .ygZH ul li{ flex: 0 0 50%; font-size: 16px; color: #777; margin-bottom: 25px;} .contactsPage .ygZH .icon{width: 16px; margin-right: 10px;} .contactsPage .ygSc{display: flex; justify-content: space-between; margin: 80px -30px 0;} .contactsPage .ygSc .li{flex: 0 0 33.33333%; max-width: 33.33333%; padding: 0 30px; height: 100%;} .contactsPage .ygSc h5{font-size: 24px; font-weight: bold; margin-bottom: 30px;} .contactsPage .ygSc .img img{width: 100%; border-radius: 15px 15px 0 0;} .contactsPage .ygSc .con{padding: 30px; background: #f6f6f6; height: 434px; border-radius: 0 0 15px 15px;} .contactsPage .ygSc ul{} .contactsPage .ygSc ul li{ font-size: 16px; color: #777; margin-bottom: 25px; text-indent: -29px;padding-left: 29px;} .contactsPage .ygSc .icon{width: 16px; margin-right: 10px;} .contactsBri{margin: 0 -70px; justify-content: space-between; align-items: flex-end;} .contactsBri .col-lg-4{padding: 0 70px;} .contactsBri .box{background: rgba(255, 255, 255, 0.85); border-radius: 15px; text-align: center; padding: 50px;} .contactsBri .img{width: 120px; height: 120px; display: flex; background: #e62131; border: solid 4px #dfe2e8; border-radius: 50%; align-items: center;justify-content: center; margin: 0 auto 40px;} .contactsBri .con{} .contactsBri .con h5{font-size: 20px; color: #363844; font-weight: bold;} .contactsBri .con p{font-size: 16px; color: #666666; margin: 10px 0 20px;} .coArea{display: flex; align-items: center;} .coArea .con{width: 480px; margin-left: 100px;} .coArea .con .inPageTi{text-align: left;} .coArea .con .intro{font-size: 16px; color: #777; margin: 30px 0 40px;} .coArea img{border-radius: 20px;} .coArea .tem-more{margin: 0 !important;} .contact-page .company{overflow: hidden;} .contact-page .company .box{width: 50%; float: left; margin-bottom: 60px; position: relative;} .contact-page .company .box:nth-child(n+3){margin-bottom: 0;} .contact-page .company .box .img{position: absolute; left: 0; top: 0;} .contact-page .company .box .con{padding: 0 30px 0 270px;} .contact-page .company .box .con:nth-child(even){padding-right: 0;} .contact-page .company .box .con h5{font-size: 20px; color: #363844; margin-bottom: 15px; font-weight: 600;} .contact-page .company .box .con ul{} .contact-page .company .box .con li{font-size: 14px; color: #666; line-height: 2em; margin-bottom: 5px;} .contact-page .company .box .con a{margin-right: 5px;} .contact-page .rowA{margin: 80px -15px 0;} .contact-page .col-lg-4{padding: 0 15px;} .contact-page .rowA a{color: #888; margin-bottom: 20px; display: block;} .contact-page .rowA a:hover{color: #005bac;} .contact-page .contact-co{background: url('../images/contact-co02.jpg') no-repeat; width: 100%; height: 280px; display: block; margin: 0 auto; padding: 70px 400px; text-align: center;} .contact-page .contact-co h5{font-size: 42px; color: #fff; padding-bottom: 20px; margin-bottom: 20px; position: relative;} .contact-page .contact-co h5::after{content: ''; width: 60px; height: 5px; background: #005bac; position: absolute; left: 50%; bottom: 0; transform: translate(-50%,0);} .contact-page .contact-co p{font-size: 16px; color: #fff; letter-spacing: 1px; line-height: 1.8em;} .contact-page .map{margin-top: 60px;} .contact-page .map .nav{border-top: solid 1px #ddd; background: #f0f0f0; justify-content: space-between; border-radius: 15px; margin-bottom: 40px !important;} .contact-page .map .nav-item{width: 16.666666%; text-align: center;} .contact-page .map .nav-link{ text-align: center; line-height: 80px; padding: 0; font-size: 18px; color: #888; position: relative; transition: all .3s; display: inline-block;} .contact-page .map .nav-link:hover{color: #000;} .contact-page .map .nav-link.active{background: none; color: #000; font-weight: bold;} .contact-page .map .nav-link.active::after{content: ''; position: absolute; left: 50%; top: 0; transform: translate(-50%,0); width: 48px; height: 5px; background: #005bac;} .contact-page .map .row{margin: 0 -25px -50px;} .contact-page .map .col-lg-4{padding: 0 25px; margin-bottom: 50px;} .contact-page .map .box{background: #fff; padding: 30px; box-shadow: 5px 5px 10px rgba(0, 13, 27, .05); height: 100% !important; border-radius: 15px;} .contact-page .map .box h5{font-size: 20px; color: #005bac; font-weight: 600; margin-bottom: 20px;} .contact-page .map .box ul{} .contact-page .map .box li{line-height: 2.2em; font-size: 14px; color: #888; text-indent: -3em; margin-left: 3em;} .contact-page .map .box a{color: #005bac;} .contact-page .map .tab-content:focus{outline: none !important;} .contact-page .map .tab-pane:focus{outline: none !important;} /* componets */ /* temFlex */ .temFlex{display: flex; flex-wrap: wrap; justify-content: center;} .temFlex.noMargin{margin: unset 0;} .temFlex.noMargin .li{padding: 0; flex: 0 0 33.33333%;} .temFlex .col-2{flex: 0 0 16.666667%;} .temFlex .col-2.colFive{flex: 0 0 20%;} .PDbox{border-radius: 30px; overflow: hidden; margin-top: 60px; justify-content: center;} .PDbox .box{padding: 60px; height: 100%; transition: all .3s;} .PDbox .li:nth-child(1) .box{background: #f6f6f6;} .PDbox .li:nth-child(2) .box{background: #e6e6e6;} .PDbox .li:nth-child(3) .box{background: #d6d6d6;} .PDbox .box .ti{text-align: center; font-size: 24px;} .PDbox .box .img{margin: 60px 0 30px; text-align: center;} .PDbox .box .img img{max-width: 100%; max-height: 100%; transition: all .3s;} .PDbox .box p{font-size: 16px; color: #333; text-align: justify; line-height: 1.8em;} .PDbox .box:hover{filter: brightness(1.02);} .PDbox .box:hover img{transform: scale(1.05);} .temFlex .onePic{background: #f6f6f6; border-radius: 30px;} .temFlex .onePic img{max-width: 100%;} .temFlex .svg{padding: 20px;} .temFlex.margin40{margin: unset -20px;} .temFlex.margin40 .li{padding: 0 20px;} .temFlex.margin40 .col-2{padding: 0 20px; margin-bottom: 40px;} .temFlex.margin40 .col-3{padding: 0 20px; margin-bottom: 60px;} .temFlex.margin40 .col-4{padding: 0 20px; margin-bottom: 60px;} .temFlex.margin40 .col-6{padding: 0 20px; margin-bottom: 60px;} .temFlex.margin40 .col-8{padding: 0 20px; margin-bottom: 60px;} .temFlex.margin40 .col-12{padding: 0 20px; margin-bottom: 60px;} .temFlex.margin30{margin: unset -15px;} .temFlex.margin30 .li{padding: 0 15px;} .temFlex.margin30 .col-2{padding: 0 15px; margin-bottom: 30px;} .temFlex.margin30 .col-3{padding: 0 15px; margin-bottom: 60px;} .temFlex.margin30 .col-4{padding: 0 15px; margin-bottom: 60px;} .temFlex.margin30 .col-6{padding: 0 15px; margin-bottom: 60px;} .temFlex.margin30 .col-8{padding: 0 15px; margin-bottom: 60px;} .temFlex.margin30 .col-12{padding: 0 15px; margin-bottom: 60px;} .temFlex.margin60{margin: unset -30px;} .temFlex.margin60 .li{padding: 0 30px;} .temFlex.margin60 .col-2{padding: 0 30px; margin-bottom: 60px;} .temFlex.margin60 .col-3{padding: 0 30px; margin-bottom: 60px;} .temFlex.margin60 .col-4{padding: 0 30px; margin-bottom: 60px;} .temFlex.margin60 .col-6{padding: 0 30px; margin-bottom: 60px;} .temFlex.margin60 .col-8{padding: 0 30px; margin-bottom: 60px;} .temFlex.margin60 .col-12{padding: 0 30px; margin-bottom: 60px;} .temFlex.margin90{margin: unset -45px;} .temFlex.margin90 .li{padding: 0 45px;} .temFlex.margin90 .col-2{padding: 0 45px;} .temFlex.margin90 .col-3{padding: 0 45px; margin-bottom: 60px;} .temFlex.margin90 .col-4{padding: 0 45px; margin-bottom: 60px;} .temFlex.margin90 .col-6{padding: 0 45px; margin-bottom: 90px;} .temFlex.margin90 .col-8{padding: 0 45px; margin-bottom: 90px;} .temFlex.margin90 .col-12{padding: 0 45px; margin-bottom: 90px;} .point p{padding-left: 1em; position: relative; margin-bottom: 1em;} .point p::before{content: ''; position: absolute; left: 0; top: 0.7em; background: #005bac; width: 5px; height: 5px; border-radius: 50%;} .temFlex.innner{ text-align: center;} .temFlex.innner .box{border-radius: 15px; overflow: hidden; background: #f6f6f6;height: 100%; box-shadow: 15px 15px 25px #d9e2ed; transition: all .3s;} .temFlex.innner .box .icon{text-align: center; padding: 40px 0;} .temFlex.innner .box .icon figure{background: linear-gradient(180deg, rgba(1,176,241,1) 0%, rgba(0,94,173,1) 100%); width: 90px; height: 90px;border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto; transition: all .3s; box-shadow: 0 5px 10px rgba(0,94,173,.5);} .temFlex.innner .box:hover .icon figure{transform: translateY(-5px);} .temFlex.innner .box:hover{transform: translateY(-5px);} .temFlex.innner .box .img{ border-radius: 20px; overflow: hidden; padding: 20px 20px 0;} .temFlex.innner .box .img img{border-radius: 20px; max-width: 100%;} .mainbox .temFlex.innner .box .icon{background: #fbfbfb;} .mainboxGray .temFlex.innner .box .icon{background: #fff;} .temFlex.innner .text{padding: 35px;} .temFlex.innner .text h5{font-size: 18px;} .temFlex.innner .text h5.sinPageTim{font-size: 16px;} .temFlex.innner .text p{font-size: 16px; color: #777; line-height: 1.8em;} .mainbox .temFlex.innner .box .text{background: #f6f6f6;} .temFlex.innner .text.justify p{text-align: justify;} .temText{display: table; margin: 0 auto;} .temText p{color: #777; line-height: 1.8em; margin-bottom: 20px;} .textIndent{text-indent: 2em;} .temFlex.innner .svg{background: #fff; padding: 0;} .temFlex.innner .svg img{transform: scale(0.8);} .temFlex.linearBox{justify-content: left; margin-bottom: -100px;} .temFlex.linearBox .col-2,.temFlex.linearBox .col-3,.temFlex.linearBox .col-4,.temFlex.linearBox .col-6,.temFlex.linearBox .col-8,.temFlex.linearBox .col-12{margin-bottom: 120px;} .temFlex.linearBox .box{background: linear-gradient(to top , #fff , #e3e7ef); padding: 80px 50px 50px; border-radius: 30px; position: relative; height: 100%; box-shadow: 5px 5px 25px #e5e9f0; display: block; transition: all .3s;} .temFlex.linearBox .box::after{content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 100px; height: 12px; border-radius: 6px; background: #3abce9;} .temFlex.linearBox .box .icon{position: absolute; left: 50%; top: 0; transform: translate(-50%,-50%); width: 120px; height: 120px; display: flex; justify-content: center; align-items: center; border-radius: 50%; background-image: url('../images/join/linearC.png'); background-repeat: no-repeat; } .temFlex.linearBox .box .icon.green{background-image: url('../images/icons/linearCB.png');} .temFlex.linearBox .box .icon img{transition: all .3s;} .temFlex.linearBox .box .text h5{text-align: center; color: #111; margin-bottom: 1em; font-weight: bold;} .temFlex.linearBox .box .text p{line-height: 2em; text-align: justify;} .temFlex.linearBox .box:hover{transform: translateY(-10px);} .temFlex.linearBox .box:hover img{transform: scale(1.1);} .temFlex.linearBox a{position: absolute; left: 50%; bottom: 0; transform: translate(-50%,50%); z-index: 99;} .temFlex.linearBox a.box{position: static; left: 0; bottom: 0; transform: translate(0,0); z-index: 0;} .temFlex.JCcenter{justify-content: center;} .fontBold{font-weight: bold;} .temFlex.CascadeBox{} .temFlex.CascadeBox .box{background: #f6f6f6; height: 100%; border-radius: 30px; overflow: hidden; transition: all .3s;} .temFlex.CascadeBox .box:hover{transform: translateY(-10px);} .temFlex.CascadeBox .box .pic{position: relative; z-index: 0;} .temFlex.CascadeBox .box .pic img{max-width: 100%; object-fit: cover; } .temFlex.CascadeBox .box .text{padding: 40px 50px; border-radius: 30px; transform: translateY(-50px); position: relative; z-index: 1; background: #f6f6f6; margin-bottom: -50px;} .mainboxGray .temFlex.CascadeBox .box{background: #fff;} .mainboxGray .temFlex.CascadeBox .box .text{background: #fff;} .temFlex.CascadeBox .box .text h5{font-size: 24px; font-weight: bold; line-height: 1.5em; margin-bottom: 1em; text-align: justify;} .temFlex.CascadeBox .box .text p{font-size: 16px; line-height: 1.8em; margin-bottom: .8em; text-align: justify; color: #666;} .temFlex.normalCard{} .temFlex.normalCard .box{ background-image: linear-gradient(to right, #fafafa, #f0f3f9); border-radius: 20px; padding: 50px; height: 100%; transition: all .3s;} .temFlex.normalCard .box .icon{margin: 0 auto 20px; display: table;} .temFlex.normalCard .box h5{text-align: center; margin-bottom: 1em;} .temFlex.normalCard .box p{text-align: justify; line-height: 1.8em; color: #888;} .mainboxGray .temFlex.normalCard .box{background: #fff;} .temFlex.normalCard .box:hover{transform: translateY(-5px); box-shadow: 5px 5px 15px #d3dcee;} .temFlex.normalCard .box:hover .icon img{animation: floatUD 2s linear infinite normal;} .temFlex.logoWall .col-2{margin-bottom: 40px; transition: all .3s;} .temFlex.logoWall .col-2:hover{transform: translateY(-10px);} .temFlex.logoWall .box{background: #fff; text-align: center; padding: 20px; border-radius: 20px;} .temFlex.logoWall .box .text{margin-top: 10px;} .temFlex.logoWall .box .text p{font-size: 16px; color: #888;} .temFlex.logoWall .box img{max-width: 100%;} /* .mainbox .temFlex.logoWall .box{background: #f6f6f6;} */ .temFlex.imgNbox{} .temFlex.imgNbox .box{border-radius: 20px; overflow: hidden; background: #f6f6f6;} .temFlex.imgNbox .pic img{width: 100%;} .temFlex.imgNbox .text{padding: 30px;} .temFlex.imgNbox .text h5{text-align: center;} .temFlex.imgNbox .text p{text-align: justify; font-size: 16px; line-height: 1.8em; color: #777; margin-top: 1em;} .mainboxGray .temFlex.imgNbox .box{ background: #fff;} .temFlex.normalFlex{} .temFlex.normalFlex .box{background: #fff; border-radius: 20px; padding: 20px 40px; height: 100%; transition: all .3s;} .temFlex.normalFlex .box .img{display: flex; margin: 0 auto 30px; width: 100px; height: 100px; justify-content: center; align-items: center; border-radius: 50%;} .temFlex.normalFlex .box .con{} .temFlex.normalFlex .box .con h5{text-align: center;} .temFlex.normalFlex .box .con p{text-align: justify; color: #777; line-height: 1.8em;} .temFlex.normalFlex .box:hover {box-shadow: inset 0 0 8px #e0e8f7;} .temFlex.normalFlex .box:hover .img{animation: floatUD 2s linear infinite normal;} .temFlex .pdPic{margin: 0;} .flexAccordion{display: flex; gap: 10px; justify-content: space-between; } .flexAccordion .li{flex: 1 1 auto; transition: all .3s;} .flexAccordion .li .box{background: #000; width: 100%; overflow: hidden; border-radius: 15px; position: relative;} .flexAccordion .li .box .img{ background-repeat: no-repeat; width: 100%; height: 540px; background-position: center; filter: brightness(0.4); transition: all .3s; background-size: cover;} .flexAccordion .li .box .ti{position: absolute; left: 0; bottom: 0; background: linear-gradient(180deg, rgba(1,176,241,.4) 0%, rgba(0,94,173,.4) 100%); color: #fff; line-height: 40px; width: 100%; text-align: center;} .flexAccordion .li.active{flex: 5 1 auto;} .flexAccordion .li.active .box .img{filter: brightness(1);} .flexAccordion .li.active .box .ti{text-align: left; padding-left: 50px; background: linear-gradient(180deg, rgba(1,176,241,.85) 0%, rgba(0,94,173,.85) 100%); border-radius: 10px;} .flexAccordion .li.active .box .ti::before{content: ''; width: 10px; height: 10px; border-radius: 50%; background: #fff; position: absolute; left: 24px; top: 50%; transform: translateY(-50%);} .AIpage .intro{width: 1000px; margin: 40px auto 60px; color: #777; line-height: 1.8em;} .centerPic{display: table; margin: 60px auto 0;} /* impressionPage */ .impressionPage>.nav{justify-content:center; margin-bottom: 0 !important;} .impressionPage>.nav .nav-link{padding: .8em 2em; border-radius: 10px; background: #f6f6f6; color: #000; font-size: 18px; margin: 0 3px;} .impressionPage>.nav .nav-link img{max-width: 20px; max-height: 20px; object-fit: cover; transform: translateY(-2px); margin-right: 5px;} .impressionPage>.nav .nav-link.active{background: #0061ae; color: #fff;} .impressionPage>.nav .nav-link.active img{filter: brightness(10000) !important; } .impressionPage .trainPicArea{ padding: 0 50px;} .impressionPage .train-pic{margin: 60px -25px 0;} .impressionPage .train-pic .col-4{padding: 0 25px; margin-bottom: 50px;} .impressionPage .train-pic .col-4:nth-last-child(1){margin-bottom: 0 ;} .impressionPage .train-pic .col-4:nth-last-child(2){margin-bottom: 0 ;} .impressionPage .train-pic .box{position: relative;width: 100%; height: 320px; overflow: hidden; border-radius: 20px;} .impressionPage .train-pic .img{position: absolute; left: 0 ; top: 0; z-index: 0; width: 100%;} .impressionPage .train-pic .img img{width: 100%; height: 100%; object-fit: cover; object-position: center;} .impressionPage .train-pic .con{background: linear-gradient(180deg, rgba(1,176,241,.85) 0%, rgba(0,94,173,.85) 100%); position: absolute; left: 0; bottom: 0; width: 100%; height: 60px; transition: all .5s;} .impressionPage .train-pic .con h5{text-align: center; color: #fff; font-size: 24px; line-height: 60px;} .impressionPage .train-pic .con p{display: none; opacity: 0; font-size: 18px; color: #fff; line-height: 2em; width: 70%; display: table; margin: 0 auto; transition: all .8s;} .impressionPage .train-pic .box:hover .con{height: 100%; padding: 60px 0;} .impressionPage .train-pic .box:hover .con p{display: block; opacity: 1;} .impressionPage .PostConversion{padding: 0 90px;} .impressionPage .PostConversion img{transition: all .3s;} .impressionPage .PostConversion .box:hover img{transform: scale(.9);} .work-story {margin: 60px 0 0;} .work-story .li{margin-bottom: 60px;} .work-story .box{ box-shadow: 0 5px 15px #d9e2ed; border-radius: 20px; overflow: hidden; padding: 30px 100px; vertical-align: middle; display: flex;gap: 150px; justify-content: center; align-items: center;} .work-story .li:nth-child(odd) .box{background: linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(227,231,239,1) 100%);} .work-story .li:nth-child(even) .box{background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(227,231,239,1) 100%);} .work-story .li:nth-child(odd) .box{flex-direction: row;} .work-story .li:nth-child(even) .box{flex-direction: row-reverse;} .work-story .con p{color: #777; line-height: 2.5em;} .work-story .font-blue{width: 1000px; display: table; margin: 40px auto 20px; line-height: 2em; font-size: 14px;} .work-story .bottom-li{margin: 80px 0 0;} .work-story .bottom-li .template-text{text-align: center;} .work-story .bottom-li .img{display: table; margin: 60px auto 0;border-radius: 20px; overflow: hidden;} .work-story .box img{transition: all .3s;} .work-story .box:hover img{transform: scale(1.05);} /* .bg-efefef{background: #efefef !important;} */ .biggerIcon.innner .box .icon figure{width: 100px; height: 100px;} .biggerIcon.innner .box .icon figure img{width: 56px; height: 56px;} .imagesFlex{display: flex; gap: 60px;} .imagesFlex.row-reverse{flex-direction: row-reverse;} .imagesFlex .nav{flex: 1 1 10%;} .imagesFlex .nav .nav-link{padding: 0; position: relative; border-radius: 10px; overflow: hidden; margin-bottom: 20px;} .imagesFlex .nav .nav-link p{position: absolute; left: 0; bottom: 0; line-height: 40px; color: #fff; background: linear-gradient(180deg, rgba(1,176,241,1) 0%, rgba(0,94,173,1) 100%); width: 100%; border-radius: 10px;} .imagesFlex .nav .nav-link img{filter: brightness(0.4); transition: all .3s; height: 154px;} .imagesFlex .nav .nav-link.active img{filter: brightness(1);} .imagesFlex .nav .nav-link:hover img{transform: scale(1.05);} .imagesFlex .tab-content{flex: 1 1 90%;} .impressionPage .flexAccordionD{margin: 40px auto 0; width: 1200px;} .impressionPage .flexAccordionE{margin: 40px auto 0; width: 1360px;} /* societyJob */ .societyJob{overflow: hidden;} .societyJob.page-banner{position: relative;} .societyJob.page-banner .search-area{position: absolute; left: 50%; bottom: 40px; transform: translate(-50%,0); width: 1460px; height: 60px;} .societyJob.page-banner .search-area .input{width: 100%; height: 60px; outline: none; padding-left: 60px; border: none;} .societyJob.page-banner .search-area .iconfont{ width: 60px; line-height: 60px; position: inherit; left: 0; top: 0; font-size: 30px; color: #0061ae; display: block; text-align: center;} .societyJob.page-banner .search-area .button{width: 200px; height: 60px; position: inherit; right: 0; top: 0;} .societyJob.page-banner .search-area button{width: 100%; height: 100%; background: #0061ae; color: #fff; border: none; outline: none;} .societyJob .ti{font-size: 24px; color: #363844; margin-bottom: 30px;} .societyJob .left-menu{width: 20%; float: left;} .societyJob .left-menu .box{background: #fff; box-shadow: 0 0 12px rgba(218, 228, 245, .6); padding: 25px;} .societyJob .left-menu .menu-list{border-bottom: 1px solid #ddd; margin-bottom: 20px;} .societyJob .left-menu .menu-list:last-child{border: none; margin-bottom: 0;} .societyJob .left-menu .type-ti{font-size: 20px; color: #363844; width: 100%; cursor: pointer; padding-bottom: 20px; line-height: 1em;} .societyJob .left-menu .type-ti .iconfont{float: right; transform: translate(0,2px); font-size: 20px; transform: rotate(0); transition: all .3s;} .societyJob .left-menu .type-ti.ro .iconfont{transform: rotate(180deg);} .societyJob .left-menu .checkbox-group{margin-top: 10px; display: none;} .societyJob .left-menu .checkbox-group li{ margin-bottom: 10px;} .societyJob .left-menu .checkbox-group label{cursor: pointer; width: 100%;} .societyJob .left-menu .checkbox-group label:hover{color: #0061ae;} .societyJob .left-menu .checkbox-group input[type="checkbox"]{width: 20px; height: 20px;display: inline-block; text-align: center; vertical-align: middle; line-height: 18px; margin-right: 10px; position: relative; } .societyJob .left-menu .checkbox-group input[type="checkbox"]::before { content: ""; position: absolute; top: 0; left: 0; background: #f2f2f2; width: 100%; height: 100%; border: solid 1px #e2e2e2; } .societyJob .left-menu .checkbox-group input[type="checkbox"]:checked::before {content: "\e643";background-color: #0061ae;position: absolute;top: 0;left: 0;width: 100%;border: none; color: #fff;font-size: 12px; font-family: iconfont;} .societyJob .job-area{ position: relative; margin-top: 60px;} .societyJob .job-area .search-count{position: absolute; right: 0; top: 0; color: #888;} .societyJob .label-wrapper{width: 100%; position: relative;} .societyJob .label-wrapper .label{ margin-bottom: 20px;} .societyJob .label-wrapper .label-item{display: inline-block; margin-right: 20px; position: relative; margin-bottom: 20px;} .societyJob .label-wrapper .label-link{display: inline-block; line-height: 50px; padding: 0 50px 0 20px; background: #fff; box-shadow: 0 0 12px rgba(218, 228, 245, .6); border: solid 1px #fff; transition: all .3s;} .societyJob .label-wrapper .label-link:hover{background: #fbfbfb; border: solid 1px #ddd;} .societyJob .label-wrapper .label-link a{font-size: 20px; color: #363844; display: block;} .societyJob .label-wrapper .close{position: absolute; right: 10px; top: 50%; transform: translate(0,-50%); cursor: pointer;} .societyJob .label-wrapper .clear{color: #0061ae; line-height: 50px; position: absolute; top: 0; right: 0;} .societyJob .job-list{background: #f6f6f6; box-shadow: 0 10px 10px rgba(228, 231, 235, .6); padding: 60px; margin-bottom: 50px; position: relative; border-radius: 20px; width: 100%; transition: all .3s;} .societyJob .job-list h5{font-size: 24px; color: #0061ae; margin-bottom: 20px; font-weight: bold; transition: all .3s;} .societyJob .job-list:hover{background: #fafafa; box-shadow: 0 15px 10px rgba(228, 231, 235, 1);} .societyJob .job-list .job-tips{margin-bottom: 30px;} .societyJob .job-list .job-tips span{display: inline-block; padding-right: 30px; margin-right: 30px; border-right: solid 1px #888; line-height: 1em; color: #888;} .societyJob .job-list .job-text{font-size: 16px; color: #333; line-height: 2em; text-align: justify;} .societyJob .job-list .apply{position: absolute; top: 30px; right: 30px; padding: 10px 15px; border: solid 1px #0061ae; color: #0061ae; transition: all .3s; font-size: 14px; border-radius: 10px;} .societyJob .job-list .apply:hover{background: #0061ae; color: #fff;} .societyJob .pagiGroup{margin: 40px 0 0 ;} .societyJob .job-detail{background: #f6f6f6; padding: 60px; border-radius: 20px; position: relative;} .societyJob .job-detail .content{position: relative; border-bottom: 1px solid #ddd; padding-bottom: 20px; margin-bottom: 50px;} .societyJob .job-detail .job-title{font-size: 42px; font-weight: 600; color: #363844; margin-bottom: 35px;} .societyJob .job-detail .job-tips{margin-bottom: 20px;} .societyJob .job-detail .job-tips span{display: inline-block; width: 240px; color: #363844;} .societyJob .job-detail .apply{position: absolute; top: 50px; right: 50px; padding: 12px 30px; border-radius: 10px; border: solid 1px #0061ae; color: #0061ae; transition: all .3s; font-size: 24px; } .societyJob .job-detail .apply:hover{background: #0061ae; color: #fff;} .societyJob .job-detail .duty{margin-bottom: 40px;} .societyJob .job-detail .duty h5{font-size: 30px; color: #363844; margin-bottom: 20px;} .societyJob .job-detail .duty p{font-size: 16px; color: #363844; line-height: 2em;} .societyJob .job-rec{font-size: 30px; color: #363844; margin: 80px 0 40px; line-height: 30px; border-left: 30px solid #0061ae; padding-left: 15px;} .societyJobArea{display: flex; gap: 60px; flex-direction: row-reverse;} .societyJobArea .job-area{margin-top: 0; flex: 1 1 80%;} .societyJobArea .leftMenu{ flex: 1 1 20%; align-self: flex-start; position: sticky; top: 0; display: flex; flex-direction: column;} .societyJobArea .leftMenu .box{background: #fff;} .societyJobArea .leftMenu .search{position: relative; background: #f6f6f6; border-radius: 20px;} .societyJobArea .leftMenu .search input{ width: 260px; height: 36px; border: none; background: #f6f6f6; border-radius: 20px; padding: 0 15px; font-size: 14px; outline: none;} .societyJobArea .leftMenu .search .search-button{width: 36px; line-height: 36px; text-align: center; background: #0061ae; color: #fff; border-radius: 50%; cursor: pointer; position: absolute; right: 0; top: 0;} .societyJobArea .leftMenu .menuList{margin-top: 30px; border-bottom: 1px solid #ddd; padding-bottom: 15px;} .societyJobArea .leftMenu .menuList .ti{font-size: 18px; margin-bottom: 10px;} .societyJobArea .leftMenu .menuList a{font-size: 14px; color: #777; display: inline-block;} .societyJobArea .leftMenu .menuList a::after{content: '、';} .societyJobArea .leftMenu .menuList a:last-child::after{content: '';} .societyJobArea .leftMenu .menuList a:hover{color: #0061ae;} .societyJobArea .pagiGroup{margin: 0 auto;} .schoolJob .jobSearch{margin: 0 auto 40px; display: table; position: relative;} .schoolJob .jobSearch input{ border-radius: 10px; width: 400px; outline: none; height: 40px; padding: 0 10px; background: #e6e6e6; border: solid 2px #ddd; color: #000; transition: all .3s;} .schoolJob .jobSearch input:focus{background: #fff; border: solid 2px #0061ae;} .schoolJob .jobSearch a{background: #0061ae; color: #fff; position: absolute; right: 0; top: 0; width: 40px; height: 100%; display: flex; justify-content: center; align-items: center; border-radius: 10px;} .schoolJob .jobSearch #btnSchoolJob {background:#0061ae;color:#fff;position:absolute;right:0;top:0;width:80px;height:100%;display:flex;justify-content:center;align-items:center;border-radius:10px;} /* schoolJob */ .schoolJob .nav{justify-content:center; margin-bottom: 0 !important;} .schoolJob .nav .nav-link{padding: .8em 2.5em; border-radius: 10px; background: #f6f6f6; color: #000; font-size: 18px;} .schoolJob .nav .nav-link img{max-width: 30px; max-height: 30px; object-fit: cover; transform: translateY(-2px); margin-right: 10px;} .schoolJob .nav .nav-link.active{background: #0061ae; color: #fff;} .schoolJob .nav .nav-link.active img{filter: brightness(10000) !important; } .schoolJob .job-area{width: 100%; gap: 80px; display: flex;} .schoolJob .job-area .col-3{flex: 1 1 10%; max-width: 20%; width: unset;} .schoolJob .job-area .col-9{flex: 1 1 90%; max-width: 80%; width: unset;} .schoolJob .job-area .nav-item{width: 100%;} .schoolJob .job-area .nav{ background: #fff; box-shadow: 0 0 12px rgba(218, 228, 245, .6); } .schoolJob .job-area .nav-link{padding: 0 40px 0 30px; line-height: 72px; background: #f6f6f6; position: relative; color: #363844; font-size: 20px; width: 100% ; border-radius: 15px; text-align: left;} .schoolJob .job-area .nav-link.active{ background-image: linear-gradient(to bottom, #01b0f1, #005ead); color: #0061ae; color: #fff;} .schoolJob .job-area .nav-link img{max-width: 30px; max-height: 30px; margin-right: 1em;} .schoolJob table{margin-top: 60px; background: #fff; box-shadow: 0 0 12px rgba(218, 228, 245, .6); border-radius: 20px; overflow: hidden;} .schoolJob table th{background: #363844; line-height: 3em; color: #fff; background-image: linear-gradient(to right, #01b5f5 , #005fae);} .schoolJob table th,.schoolJob table td{padding: 15px 30px;} .schoolJob table td{vertical-align: middle; font-size: 16px;} .schoolJob table .td-bold{font-size: 16px; line-height: 2em; font-weight: bold; border-bottom: solid 1px #ddd; background: #f6f6f6;} .schoolJob table .td-normal{line-height: 2em; border: solid 1px #ddd; border-top: none; color: #666;} .schoolJob table .td-bold:hover,.schoolJob table .td-normal:hover{background: #f6f6f6;} .schoolJob .one-pic{display: table; margin: 0 auto; box-shadow: 0 0 12px rgba(218, 228, 245, .6);} .schoolJob .quesiton-area{display: table; margin: 60px auto -60px; width: 1560px; padding: 0;} .schoolJob .quesiton-list{margin-bottom: 60px; border-radius: 20px; overflow: hidden;} .schoolJob .quesiton-list .ti{line-height: 56px; font-size: 20px; transition: all .3s; padding: 0 60px; background-image: linear-gradient(to bottom, #01b0f1, #005ead); position: relative; color: #fff; font-weight: 600;} .schoolJob .quesiton-list .ti::before{content: ''; position: absolute; left: 20px; top: 50%; transform: translateY(-50%); background: url('../images/join/navIcon9.png') no-repeat; width: 30px; height: 30px; background-size: cover; filter: brightness(100);} .schoolJob .quesiton-list .text{background: #f6f6f6; padding: 30px;} .schoolJob .quesiton-list .text p{color: #666; line-height: 2em; margin-bottom: 30px;} .schoolJob .quesiton-list .text p:last-child{margin-bottom: 0;} .schoolJob .tips{font-size: 24px; text-align: center; display: none; background: #f6f6f6; padding: 40px 0;} .schoolJob.false .jobSearch{display: none;} .schoolJob.false .job-area{display: none;} .schoolJob.false .tips{display: block;} .commerce-page .process {display: flex; margin: 60px 0 0; flex-wrap: nowrap; justify-content: space-around; background: linear-gradient(270deg, rgba(255,255,255,1) 0%, rgb(240, 245, 255) 50%, rgba(255,255,255,1) 100%); padding: 50px; border-radius: 100px;} .commerce-page .process .list{flex: 1 1 20%; max-width: unset; text-align: center; position: relative;} .commerce-page .process .icon{width: 160px; height: 160px; text-align: center; background-image: linear-gradient(to right, #fff, #e3e7ef); border-radius: 50%; display: inline-block; line-height: 160px; margin-bottom: 30px; position: relative;} .commerce-page .process .list::after{content: ''; width: 100px; height: 2px; background: #ddd; position: absolute; right: 0; top: 50%; transform: translate(50%,-25px);} .commerce-page .process .list::before{content: '\e602'; width: 20px; line-height: 20px;background-image: linear-gradient(to bottom, #01b0f1, #005ead); border-radius: 50%; position: absolute; right: 0; top: 50%; transform: translate(50%,-33px); font-family: iconfont; z-index: 999; color: #fff;} .commerce-page .process .list:last-child::before,.commerce-page .process .list:last-child::after{display: none;} .commerce-page .process p{font-size: 18px; color: #23252a;} .recommendCode{background-image: linear-gradient(to bottom, #01b0f1, #005ead); width: auto; display: table; margin: 40px auto 0; padding: 80px 60px; border-radius: 50px; text-align: center;} .recommendCode h5{font-size: 24px; font-weight: bold; color: #fff;} .recommendCode p{font-size: 16px;color: #fff; margin: 20px 0 20px; text-align: left; line-height: 2em;} .recommendCode a{color: #91e5ff;} .recommendCode a:hover{text-decoration: underline;} .pdPic{margin: 40px auto; display: table; background: #fff; padding: 5px; border-radius: 20px; position: relative;} .pdPic img{border-radius: 20px; max-width: 100%; margin-bottom: 0;} .pdPic .intro{text-align: center; background: #f0f0f0; padding: 10px 20px; border-radius: 15px; position: absolute; right: 10px; bottom: 10px; } .CloudTem{} .CloudTem .intro{width: 1200px; margin: 40px auto;} .CloudTem .intro p{font-size: 16px; color: #888; line-height: 2em;} .conPicFlex{} .conPicFlex .list{display: flex; flex-wrap: nowrap; background: #fff; padding: 80px 120px; border-radius: 20px; margin-top: 60px; transition: all .3s; justify-content: space-around; gap: 50px;} .conPicFlex .list:nth-child(odd){flex-direction: row-reverse;} .conPicFlex .list:nth-child(even){flex-direction: row;} .conPicFlex .list .pic{flex: 1 1 50%; } .conPicFlex .list .pic img{transition: all .3s; max-width: 100%;} .conPicFlex .list .con{flex: 1 1 50%;} .conPicFlex .list:nth-child(odd) .pic{text-align: right;} .conPicFlex .list:nth-child(evenodd) .pic{text-align: left;} .conPicFlex .list:hover{box-shadow: 5px 5px 15px #d3dcee;} .conPicFlex .list:hover .pic img{transform: scale(1.05);} .knowledgeCloud .con .li{margin: 0 0 20px 20px;} .knowledgeCloud .con h4{} .knowledgeCloud .con h4{font-size: 30px; color: #565862;} .knowledgeCloud .con h5{font-size: 22px; color: #0061ae; padding-left: 10px; border-left: solid 8px #0061ae; margin: 25px 0; line-height: 36px;} .knowledgeCloud .con h6{font-size: 18px; color: #666872; position: relative; line-height: 16px;} .knowledgeCloud .con h6::after{content: ''; width: 10px; height: 10px; background: #cbd4df; border-radius: 50%; position: absolute; left: -20px; top: 2px;} .knowledgeCloud .con p{font-size: 16px; color: #9ea1af; line-height: 2em; margin-top: 15px;} .cloudBanner{position: relative;color: #FFF; background-size: cover; margin-top: 90px; height: unset; padding: 90px 0 0; background-repeat: no-repeat;} .cloudBanner .ti{text-align: center; font-size: 30px; font-weight: bold; margin-bottom: 15px;} .cloudBanner .text{color: #fff; width: 800px; text-align: justify; display: block; margin: 0 auto 10px; line-height: 2em; text-indent: 2em;} /* .cloudBanner .img{position: absolute; left: 50%; bottom: 0; transform: translate(-50%,0);} */ .cloudBanner .img{display: table; margin: 50px auto 0;} .cloudBg{background-size: cover;} .cloudBg .inPageTi{color: #fff;} .cloudBg .intro p{color: #fff; margin: 40px auto; width: 1200px;} .onePic{display: table; margin: 40px auto;} .onePic img{max-width: 100%; border-radius: 20px;} .normalPic{} .normalPic .list{padding: 0 80px 60px; border-bottom: #ddd solid 1px; align-items: center;} .normalPic .con{} .normalPic .img{text-align: center; flex: 1 1 50%;} .normalPic img{max-width: 80%; transition: all .3s; box-shadow: #cee7fd 0 5px 10px; border-radius: 5px;} /* .normalPic .img.phonePic{margin-bottom: 60px;} */ .normalPic .img.phonePic img{max-height: 60vh; box-shadow: none; border: solid 10px #000; border-radius: 30px;} .mainboxGray .normalPic .list{background: none;} .normalPic .list:hover{box-shadow: none;} .normalPic .list:hover img{transform: scale(1.05);} .phonePic .list{background: none; padding: 0 80px; border: none; align-items: center; margin-top: 0;} .phonePic .con{margin-top: 0; padding: 0 60px; transform: translateY(-40%);} .phonePic .con img{transition: all .3s;} .phonePic .list:hover img{transform: translateY(-10px);} .onePicli{display: table; margin: 0 auto -50px; width: 1200px;} .onePicli .list{ padding: 50px; border-radius: 20px; margin-bottom: 50px; box-shadow: 2px 2px 10px rgb(229, 234, 241);} .onePicli .list .ti{text-align: center; font-size: 24px; font-weight: bold; color: #0061ae; margin-bottom: 40px;} .onePicli .list p{text-align: justify; text-indent: 2em; line-height: 1.8em; color: #777; margin-bottom: 40px;} .onePicli .list .img{ display: table; margin: 0 auto;} .onePicli .list img{ border-radius: 20px; max-width: 100%;} .fullpic{} .fullpic .list{padding: 40px 80px 0; align-items: center; margin-top: 0; gap: 80px;} .fullpic .list:nth-child(odd){background-image: linear-gradient(to right, #fff, #f0f3f9);} .fullpic .list:nth-child(even){background-image: linear-gradient(to left, #fff, #f0f3f9);} .fullpic .img{max-width: 100%;} .fullpic .img img{max-width: 100%;} .fullpic .con{display: flex; justify-content: center;} .fullpic .con .conP{} .fullpic .con h5{font-size: 24px;} .fullpic .con h6{font-size: 20px; color: #0061ae; margin-top: 1em;} .fullpic .con p{font-size: 16px; color: #777; margin-top: 1em; position: relative; padding-left: 1em;} .fullpic .con p::before{content: ''; position: absolute; left: 0; top: 0.45em; background: #005bac; width: 6px; height: 6px; border-radius: 50%;} .flexBanner {padding: 60px 200px 40px;} .flexBanner .flex{display: flex; flex-direction: row-reverse; align-items: center;} .flexBanner .lia{ flex: 1 1 3%; } .flexBanner .lib{ flex: 1 1 30%; } .flexBanner .con{text-align: left; transform: translateY(-30%);} .flexBanner .con .ti{text-align: left; } .flexBanner .con p{text-align: left; } .servicePage .inPageTi{color: #0061ae; font-weight: bold;} .servicePage .intro p{font-size: 20px; text-align: center;} .servicePage .parent {display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 80px;grid-row-gap: 60px; } .servicePage .div1 { grid-area: 1 / 1 / 2 / 2; } .servicePage .div2 { grid-area: 2 / 1 / 3 / 2; } .servicePage .div3 { grid-area: 1 / 2 / 3 / 3; } .servicePage .left .box{display: flex; overflow: hidden; border-radius: 20px; align-items: center;} .servicePage .left .box .con{ padding: 0 60px;} .servicePage .box .con h6{font-size: 24px; font-weight: bold; color: #0061ae; margin-bottom: 30px;} .servicePage .box ul li{font-size: 16px; color: #666; padding-left: 20px; position: relative; margin-bottom: 12px;} .servicePage .box ul li::after{content: ''; position: absolute; left: 0; top: 50%; width: 6px; height:6px; background: #0061ae; transform: translate(0,-50%); border-radius: 50%;} .servicePage .box ul li:last-child{padding-left: 0;} .servicePage .box ul li:last-child:after{display: none;} .servicePage .left .index-more{margin: 25px 0 0 !important;} .servicePage .right .box{border-radius: 20px; overflow: hidden;} .servicePage .right .box img{width: 100%;} .servicePage .right .box h6{text-align: center;} .servicePage .right .box .con{padding: 40px 100px;} .servicePage .right .box ul{display: flex; flex-wrap: wrap; justify-content: space-around;} .servicePage .right .box li{flex: 1 1 33.3333%;} .servicePage .right .index-more{margin: 25px auto 0 !important;} .serviceSlider{position: fixed; left: 0; bottom: 0; width: 100%;z-index: 99; display: none; transform: translateY(100%); transition: all .3s;} .serviceSlider.mainbox-gray{background: #f6f6f6;} .serviceSlider .container{width: 1200px;} .serviceSlider h5{font-size: 32px; font-weight: bold; color: #0061ae; text-align: center; margin-bottom: 40px; letter-spacing: .2em;} .serviceSlider .row{margin: 0 -40px; justify-content: center;} .serviceSlider .row .col-12{padding: 0 40px; border-right: solid 1px #e7edf7; overflow: hidden;} .serviceSlider .row .col-12:last-child{border: none;} .serviceSlider .img{float: left;} .serviceSlider .con{width: 230px; float: right;} .serviceSlider .con h6{font-size: 24px; margin-bottom: 10px;} .serviceSlider .con p{font-size: 18px; line-height: 1.8em; color: #888; text-align: justify;} .serviceSlider .Servicesbt{margin: 30px auto 0; display: table; background: #e1e9ee; border: none; outline: none; width: 200px; line-height: 42px; border-radius: 10px; transition: all .2s;} .serviceSlider .Servicesbt:hover{background: #005bac; color: #fff;} .serviceCon .list{padding: 60px 120px; align-items: center;} .serviceCon img{border-radius: 20px;} .serviceCon .con h5{font-size: 30px;} .serviceCon .con p{font-size: 18px;} .Strategy{width: 100%;background-size: cover; position: relative; background-position: center; margin-top: 90px; padding: 150px 0; text-align: center; background-repeat: no-repeat;} .Strategy .con{position: relative;} .Strategy .con h5{font-size: 36px; color: #fff; font-weight: bold; padding-bottom: 50px; position: relative;} .Strategy .con h5::after{content: ''; position: absolute; left: 50%; bottom: 0; width: 100px; height: 4px; background: #fff; transform: translate(-50%,-20px);} .Strategy .con h6{font-size: 20px; color: #fff; margin-bottom: 40px;} .Strategy .con a{width: 180px; line-height: 54px; background: #005bac; color: #fff; border-radius: 5px; display: inline-block; text-decoration: none; transition: all .3s;} .Strategy .con a:hover{border-radius: 30px;} .StrategyPage .CascadeBox h5{text-align: center !important;} .StrategyPage .CascadeBox img{width: 100%;} .StrategyPage .coArea .intro .inPageMti{ text-align: left; color: #333;} .StrategyPage .coArea .intro p{ margin-bottom: 1em;} /* 智能物联平台 */ .platFunction{margin: 130px auto 0; display: table;} .SDPlatform .platFunction .box{width: 430px; height: 430px; border-radius: 50%; background-image: linear-gradient(to top, #fafafa, #f0f3f9); position: relative; margin-bottom: 90px; border: solid 1px #ddd;} .SDPlatform .platFunction .con{position: absolute; background-image: linear-gradient(to top, #26cfff, #005bac); border: solid 5px #d9e8ff; width: 120px; height: 120px; border-radius: 50%; overflow: hidden; transition: all .3s;} .SDPlatform .platFunction .con:nth-child(1){left: 50%; top: 50%; transform: translate(-50%,-50%); width: 200px; height: 200px; background-image: linear-gradient(to top, #fff, #f0f3f9); border: solid 6px #005bac;} .SDPlatform .platFunction .con:nth-child(1) h5{color: #005bac; font-weight: bold;} .SDPlatform .platFunction .con:nth-child(2){left: 50%; top: 0; transform: scale(1) translate(-50%,-50%);} .SDPlatform .platFunction .con:nth-child(3){right: 0; top: 75px; transform: translate(50%,0);} .SDPlatform .platFunction .con:nth-child(4){right: 0; bottom: 75px; transform: translate(50%,0);} .SDPlatform .platFunction .con:nth-child(5){right: 50%; bottom: 0; transform: translate(50%,50%);} .SDPlatform .platFunction .con:nth-child(6){left: 0; bottom: 75px; transform: translate(-50%,0);} .SDPlatform .platFunction .con:nth-child(7){left: 0; top: 75px; transform: translate(-50%,0);} .SDPlatform .platFunction .con h5{font-size: 18px; color: #fff; position: inherit; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; text-align: center; line-height: 1.5em;} .SDPlatform .platFunction .con:nth-child(1) h5{font-size: 30px;} .SDPlatform .platFunction .con p{background: #1371c4; color: #fff; width: 240px; height: auto; padding: 20px; font-size: 13px; line-height: 1.8em; position: inherit; border-radius: 10px; opacity: 0; transition: all .3s; text-align: justify;} .SDPlatform .platFunction .con strong{display: none;} .SDPlatform .platFunction .con p::after{content: ''; right: 99%; top: 50%; border: solid transparent; height: 0; width: 0; position: inherit; pointer-events: none; border-color: rgba(18, 134, 237, 0); border-right-color: #1371c4;border-width: 14px; margin-top: -14px;} .SDPlatform .platFunction .con:nth-child(2) p{left: 0; top: 50%; transform: translate(-110%, -50%);} .SDPlatform .platFunction .con:nth-child(3) p{right: 0; top: 50%; transform: translate(110%, -50%);} .SDPlatform .platFunction .con:nth-child(4) p{right: 0; top: 50%; transform: translate(110%, -50%);} .SDPlatform .platFunction .con:nth-child(5) p{right: 0; top: 50%; transform: translate(110%, -50%);} .SDPlatform .platFunction .con:nth-child(6) p{left: 0; top: 50%; transform: translate(-110%, -50%);} .SDPlatform .platFunction .con:nth-child(7) p{left: 0; top: 50%; transform: translate(-110%, -50%);} .SDPlatform .platFunction .con:nth-child(2) p::after,.SDPlatform .platFunction .con:nth-child(6) p::after,.SDPlatform .platFunction .con:nth-child(7) p::after{left: 99%; top: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(18, 134, 237, 0); border-left-color: #1371c4; border-width: 14px; margin-top: -14px;} .SDPlatform .platFunction .con:hover{overflow: unset; cursor: pointer; box-shadow: 5px 5px 20px rgba(38, 142, 227, 0.47);} .SDPlatform .platFunction .con:nth-child(2).con:hover{left: 50%; top: 0; transform: scale(1.05) translate(-50%,-50%);} .SDPlatform .platFunction .con:nth-child(3).con:hover{right: 0; top: 75px; transform: scale(1.05) translate(50%,0);} .SDPlatform .platFunction .con:nth-child(4).con:hover{right: 0; bottom: 75px; transform: scale(1.05) translate(50%,0);} .SDPlatform .platFunction .con:nth-child(5).con:hover{right: 50%; bottom: 0; transform: scale(1.05) translate(50%,50%);} .SDPlatform .platFunction .con:nth-child(6).con:hover{left: 0; bottom: 75px; transform: scale(1.05) translate(-50%,0);} .SDPlatform .platFunction .con:nth-child(7).con:hover{left: 0; top: 75px; transform: scale(1.05) translate(-50%,0);} .SDPlatform .platFunction .con:hover p{opacity: 1;} .SDPlatform .platFunction .tips{text-align: center; font-size: 14px; color: #9aa0c1;} .SDPlatform .platFunction .tips:first-child{visibility: unset;} .SDPlatform .platFunction .tips:last-child{visibility: hidden;} .SDPlatform .nav{ text-align: center; justify-content: center; margin-top: 20px;} .SDPlatform .nav .nav-link{ padding: 20px 50px; color: #000; font-size: 22px; background: #f6f6f6;} .SDPlatform .nav .nav-link.active{background-image: linear-gradient(to top, #26cfff, #005bac); color: #fff; position: relative;} .SDPlatform .nav .iconfont{display: none;} .SDPlatform .tab-pane .topCon {width: 1200px; margin: 80px auto; display: flex; justify-content: space-around; padding:10px; gap: 60px;} .SDPlatform .tab-pane .topCon p{font-size: 18px; line-height: 2em; color: #888; text-indent: 2em; padding: 1em 0; text-align: justify;} .SDPlatform .tab-pane .pic img{border-radius: 10px;} .SDPlatform .tab-pane .content .ti{font-size: 20px; text-align: center; margin-bottom: 30px;} .SDPlatform .tab-pane .content .row{margin: 0 -20px 60PX; padding: 0 80px; justify-content: center;} .SDPlatform .tab-pane .content .col-lg-4{padding: 0 20px; margin-bottom: 40px;} .SDPlatform .tab-pane .content .col-lg-3{padding: 0 20px; margin-top: 40px;} .SDPlatform .tab-pane .content .box{background-image: linear-gradient(to right, #fafafa, #f0f3f9); position: relative; padding: 30px 40px; height: 100%; border-radius: 20px;} .SDPlatform .tab-pane .content .box span{position: absolute; left: 0; top: 0; width: 30px; line-height: 30px; background: #005bac; border-radius: 10px 0 10px 0; color: #fff; text-align: center;} .SDPlatform .tab-pane .content .box p{font-size: 16px; line-height: 1.6em; text-align: justify; color: #8396a6;} .SDPlatform .tab-pane .content .proButton{background: #005bac; color: #fff; display: table; margin: 30px auto 0; min-width: 200px; line-height: 50px; text-align: center; border-radius: 10px; box-shadow: 7px 7px 20px rgba(109, 143, 255, .45); transition: all .3s; padding: 0 1.8em;} .SDPlatform .tab-pane .content .proButton:hover{background: #077ce2;} .SDPlatform .tab-paneCon{display: none;} .SDPlatform .contacts{display: flex;} .SDPlatform .contacts .li{flex: 1 1 50%; display: flex; gap: 50px; justify-content: center; } .SDPlatform .contacts .li:first-child{border-right: 1px solid #ddd;} .SDPlatform .contacts .icon{width: 100px; height: 100px; background: #fff; border-radius: 50%; display: flex; justify-content: center; align-items: center;} .SDPlatform .contacts .icon img{width: 48px;} .SDPlatform .contacts .con h5{font-size: 18px; font-weight: bold; margin: 15px 0;} .SmartEnergy{} .SmartEnergy .SmartEnergyPD{} .SmartEnergy .SmartEnergyPD .box{padding: 40px 30px; border-radius: 20px; height: 100%; position: relative; background-image: linear-gradient(to bottom, #fff, #d9e1f0); box-shadow: 0 2px 5px rgba(0, 91, 172, 0.15);} .SmartEnergy .SmartEnergyPD .box .tiAlgin{text-align: center; color: #077ce2;} .SmartEnergy .SmartEnergyPD .box .menu{display: flex; flex-wrap: wrap; margin: 0 -15px; justify-content: left; position: relative; z-index: 2;} .SmartEnergy .SmartEnergyPD .box .menu li{flex: 0 0 50%; padding: 0 15px; margin-bottom: 30px;} .SmartEnergy .SmartEnergyPD .box .menu a{display: block; line-height: 50px; text-align: center; background: rgb(195 204 220 / 50%); border-radius: 10px; font-size: 14px; color: #000; backdrop-filter: blur(4px); transition: all .3s; font-weight: bold;} .SmartEnergy .SmartEnergyPD .box .menu a:hover{background: #077ce2; color: #fff;} .SmartEnergy .SmartEnergyPD .box .img{position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); z-index: 0;} .SmartEnergy .CascadeBox h5{font-size: 20px !important; text-align: center !important;} .SmartEnergy .CascadeBox .tem-more{margin: 30px auto 0 !important;} .SmartEnergy .CascadeBox .box .pic img{height: 300px !important; width: 100%;} .SmartEnergy .innner img{width: 100%; max-height: 200px; object-fit: cover;} /* 企业文化 */ .CulturePage{} .CulturePage #culturePoster{position: relative;} /* .CulturePage #culturePoster::before{content: ''; position: absolute; left: 0; top: 0; width: 400px; height: 400px; border: solid 30px; border-image: linear-gradient(to right, #0061ae , #fe2929) 1;} */ .CulturePage #culturePoster .swiper-slide{padding: 0 100px 80px;} .CulturePage #culturePoster .box{position: relative;} .CulturePage #culturePoster .box img{ border-radius: 20px; box-shadow: 10px 10px 30px rgba(110, 122, 145, .3); width: 100%;} .CulturePage #culturePoster .box .con{ position: absolute; background: rgba(255, 255, 255, 0.15); backdrop-filter: blur(30px); padding: 30px 50px; border-radius: 15px; width: 50%; box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);} /* .CulturePage #culturePoster .box .con::after{content: ''; position: absolute; right: 0; top: 0; width: 200px; height: 200px; background: #fe212f; z-index: -2; transform: translate(50%,-50%);} */ .CulturePage #culturePoster .box .con .ti{font-size: 30px; font-weight: 500; margin-bottom: .6em; word-spacing: 0.1em; display: inline-block; border-radius: 10px; color: #fff; letter-spacing: 0.1em; font-weight: bold;} /* .CulturePage #culturePoster .box .con .ti{font-size: 30px; font-weight: 500; margin-bottom: .6em; word-spacing: 0.1em; background: linear-gradient(to right, #ffa9a9, #ff2d2d); display: inline-block; padding: 5px 10px; border-radius: 10px; color: #fff; letter-spacing: 0.1em;} */ .CulturePage #culturePoster .box .con .text{font-size: 24px; color: #333; line-height: 1.8em; text-align: justify;} .CulturePage #culturePoster .swiper-slide:nth-child(2) .box .con{right: 100px; top: 150px;} .CulturePage #culturePoster .swiper-slide:nth-child(2) .box .con .ti{color: #333;} .CulturePage #culturePoster .swiper-slide:nth-child(3) .box .con{left: 50px; top: 200px;} .CulturePage #culturePoster .swiper-slide:nth-child(4) .box .con{right: 50px; top: 150px;} .CulturePage #culturePoster .swiper-slide:nth-child(5) .box .con{right: 50px;top:60px;} .CulturePage #culturePoster .swiper-slide:nth-child(6) .box .con{right: 50px; top:60px;} .CulturePage #culturePoster .swiper-slide:nth-child(3) .box .con .text, .CulturePage #culturePoster .swiper-slide:nth-child(4) .box .con .text, .CulturePage #culturePoster .swiper-slide:nth-child(5) .box .con .text{color: #fff; word-spacing: 1em;} .CulturePage #culturePoster .swiper-slide:nth-child(6) .box .con .text{color: #fff; word-spacing: 1em;} .CulturePage #culturePoster .swiper-pagination-bullet {width:30px;height:30px;text-align:center;line-height:30px;font-size:12px;color:#000;opacity:1;background:rgba(0,0,0,0.2); outline: none;} .CulturePage #culturePoster .swiper-pagination-bullet-active {color:#fff;background:#fe212f;} .CulturePage #culturePoster .swiper-pagination{bottom: 0; width: auto; display: table; left: 50%; transform: translateX(-50%);} .culturalActivity{position: relative; width: 100%;} .culturalActivity .inPageTi{color: #fff; position: relative; z-index: 88;} .culturalActivity #culturalActivity {overflow: hidden; position: relative; padding: 60px 0 100px; z-index: 88;} .culturalActivity #culturalActivity .swiper-wrapper{display: flex; align-items: center;} .culturalActivity #culturalActivity .swiper-slide {text-align:center;font-size:18px;background:#fff;/* Center slide text vertically */ display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;transition:300ms;transform:scale(0.8);} .culturalActivity #culturalActivity .swiper-slide-active,.swiper-slide-duplicate-active {transform:scale(1.15);} .culturalActivity #culturalActivity .swiper-slide{border-radius: 20px; overflow: hidden;} .culturalActivity #culturalActivity .box .img{border: solid 5px #fff; border-radius: 20px 20px 0 0; overflow: hidden;} .culturalActivity #culturalActivity .box img{width: 100%; height: 100%; object-fit: cover; transition: all .25s;} .culturalActivity #culturalActivity .box:hover img{transform: scale(1.1);} .culturalActivity #culturalActivity .box .ti{padding: 15px 20px 20px; background: #fff; color: #333; transition: all .24s;} .culturalActivity #culturalActivity .box:hover .ti{color: #fe2929;} .culturalActivity #culturalActivity .swiper-button-prev:after , .culturalActivity #culturalActivity .swiper-button-next:after{color: #fff; outline: none;} .culturalActivity #culturalActivity .swiper-button-prev , .culturalActivity #culturalActivity .swiper-button-next{color: #fff; outline: none;} .culturalActivity #culturalActivity .swiper-pagination-bullet{background: #fff;} .culturalActivity #culturalActivityBg{width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2;} .culturalActivity #culturalActivityBg .swiper-slide{background: #000; width: 100%; height: 100%;} .culturalActivity #culturalActivityBg img{width: 100%; height: 100%; object-fit: cover; opacity: 0.3;} .culturalActivity #culturalActivityBg .swiper-slide-active img{ animation: imgScale infinite 15s;} @keyframes imgScale{ 0%,100% { transform: scale(1); } 50% { transform: scale(1.3); } } .tableTips{display: none;} .temFlex.cultureCard .box{background: #f6f6f6; border-radius: 20px; overflow: hidden; transition: all .3s; height: 100%;} .temFlex.cultureCard .box img{width: 100%; height: 260px; object-fit: cover;} .temFlex.cultureCard .box video{width: 100%; height: 260px; object-fit: cover;} .temFlex.cultureCard .box .con{padding: 30px;} .temFlex.cultureCard .box .con h5{font-size: 24px; font-weight: bold; margin-bottom: 1em;} .temFlex.cultureCard .box .con h6{font-size: 18px; color: #888; line-height: 1.8em; } .temFlex.cultureCard .box .con p{font-size: 16px; color: #888; line-height: 1.8em; overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;} .temFlex.cultureCard .box .tem-more{background: #fe212f; margin: 30px 0 !important;} .temFlex.cultureCard .box .index-more .iconfont::after{background: #fff;} .mainboxGray .temFlex.cultureCard .box{background: #fff;} .CulturePage.aboutMenu .menu a::after{background: #fe212f ;} .CulturePage.aboutMenu.dropMenu .li .drop a:hover{background: #fe212f ;} .temFlex.cultureCard .box .tem-more:hover{transform: none;} .temFlex.cultureCard .box .tem-more:hover::after{background: rgba(254 ,33 ,47,.3);} .temFlex.cultureCard .box:hover{transform: scale(1.05);} .temFlex.cultureCard .box:hover .con h5{color: #fe212f;} .cultureIp .phonePic .list{padding: 0 0;} .cultureIp .phonePic .con{transform: none;} .cultureIp .phonePic .index-more{margin: 46px 0 0 !important; background: #fe212f;} .cultureIp .phonePic .index-more .iconfont::after{background: #fff;} .cultureIp .phonePic .index-more:hover::after{background: rgba(254 ,33 ,47,.3);} .cultureIp .normalPic img{border-radius: 15px; max-width: 90%;} .CulturePage .conPicFlex{} .CulturePage .conPicFlex img{max-height: 50vh; border-radius: 20px;} .CulturePage .knowledgeCloud .con h5{color: #fe212f; border-left: solid 10px #fe212f; font-size: 30px;} .CulturePage .knowledgeCloud .con p{font-size: 18px;} .CulturePage .actArea{display: flex; gap: 100px;} .CulturePage .actArea .img{flex: 1 1 40%;} .CulturePage .actArea .img img{width: 100%; border-radius: 20px;} .CulturePage .actArea .con{flex: 1 1 60%; position: relative;} .CulturePage .actArea .con h5{font-size: 30px; margin-bottom: 1em;} .CulturePage .actDetail{padding: 60px; background: #f6f6f6; margin-top: 60px; border-radius: 20px;} .CulturePage .actDetail .ti{font-size: 24px; border-left: 4px solid #fe212f; padding-left: 1em; margin-bottom: 1em;} .CulturePage .actDetail p{font-size: 16px; color: #888; line-height: 1.8em; margin-bottom: 20px; text-indent: 2em;} .CulturePage .actDetail p:last-child{margin-bottom: 0;} .CulturePage .actArea .con p{font-size: 16px; color: #888; margin-bottom: 1em; line-height: 1.8em;} .CulturePage .actArea .con .actTips{background: #fe212f; padding: .8em 1.2em; color: #fff; border-radius: 30px; margin-top: 2em; display: table;} .CulturePage .actArea .con .actTips.disabled{background: #ddd; color: #888;} .CultureSFGbg{background-repeat: no-repeat; position: relative; background-size: cover; margin: 10px; border-radius: 20px; overflow: hidden; background-position: center; background-attachment: fixed;} .CultureSFGbg .inPageTi{color: #fff; position: relative; z-index: 99;} .CultureSFGbg .CultureSFG{overflow: hidden; position: relative; padding: 60px 0 100px; z-index: 88;} .CultureSFGbg .CultureSFG .swiper-wrapper{display: flex; align-items: center;} .CultureSFGbg .CultureSFG .swiper-slide {text-align:center;font-size:18px;background:#fff;/* Center slide text vertically */ display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;transition:300ms;transform:scale(0.8);} .CultureSFGbg::after{content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.2); z-index: 0;} .CultureSFGbg .CultureSFG .swiper-slide-active,.swiper-slide-duplicate-active {transform:scale(1.15);} .CultureSFGbg .CultureSFG .swiper-slide{border-radius: 20px; overflow: hidden;} .CultureSFGbg .CultureSFG .box{position: relative;} .CultureSFGbg .CultureSFG .box .img{border: solid 5px #fff; border-radius: 20px 20px 0 0; overflow: hidden; position: relative;} .CultureSFGbg .CultureSFG .box video{width: 100%; height: 100%; object-fit: cover; transition: all .25s; position: relative;} .CultureSFGbg .CultureSFG .box .img .videoPlay{ position: absolute; left: 50%; top: 50%; z-index: 88; background: rgba(0, 0, 0, 0.6); color: #fff; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; border-radius: 50%; transform: translate(-50%,-50%); font-size: 20px; } .CultureSFGbg .CultureSFG .box .img .videoPlay.hide{display: none;} .CultureSFGbg .CultureSFG .box .ti{padding: 10px 20px 20px; background: #fff; color: #333; transition: all .24s;} .CultureSFGbg .CultureSFG .box:hover .ti{color: #fe2929;} .CultureSFGbg .CultureSFG .swiper-button-prev:after , .CultureSFGbg .CultureSFG .swiper-button-next:after{color: #fff; outline: none;} .CultureSFGbg .CultureSFG .swiper-button-prev , .CultureSFGbg .CultureSFG .swiper-button-next{color: #fff; outline: none;} .CultureSFGbg .CultureSFG .swiper-pagination-bullet{background: #fff;} .CultureSFGbg .videoArea{display: flex; width: 1080px; margin: 50px auto 0; position: relative; z-index: 9; flex-wrap: wrap; justify-content: space-between; row-gap: 2.5vw;} .CultureSFGbg .videoArea .list{flex: 0 0 31%; } .CultureSFGbg .videoArea .video{padding: 20px; border-radius: 15px; background: rgba(255, 255, 255, 0.5); backdrop-filter: blur(5px);} .CultureSFGbg .videoArea video{max-width: 100%; border-radius: 15px; outline: none; object-fit: cover;} .CultureSFGbg .videoArea .video p{text-align: center; margin-top: .5em; font-weight: bold;} .swiperPhotos{background: rgba(255, 255, 255, 0.5); width:1080px; padding: 30px; margin: 0 auto; border-radius: 20px; position: relative; z-index: 3; box-shadow: 5px 5px 20px rgba(0, 50, 90, 0.15); backdrop-filter: blur(5px);} .mianboxPictureOpacity .inPageTi{position: relative; z-index: 999; background: rgba(255, 255, 255, 0.6); display: table; padding: 10px 20px; border-radius: 10px; backdrop-filter: blur(5px); margin-left: auto; margin-right: auto;} .swiperPhotosTop {height: 55vh;width:100%; margin-bottom: 10px;} .swiperPhotosTop .swiper-slide {position: relative;} .swiperPhotosTop .swiper-slide img {display:block;width:100%;height:100%;object-fit:cover; object-position: center; border-radius: 10px;} .swiperPhotoBottom {width:100%; height: 150px;margin-left:auto;margin-right:auto;} .swiperPhotoBottom .swiper-slide {background-size:cover;background-position:center; border-radius: 10px; overflow: hidden; cursor: pointer;} .swiperPhotoBottom .swiper-slide img{max-width: 100%; min-height: 100%; object-fit: cover; filter: brightness(.3); } .swiperPhotosTop .swiper-slide .intro{position: absolute; right: 2px; bottom: 3px; background: rgba(255, 255, 255, 0.8); padding: 10px 20px; border-radius: 10px; font-weight: bold; backdrop-filter: blur(3px);} .swiperPhotoBottom .swiper-slide-thumb-active img{filter: brightness(1);} .cultureTalentShow{} .cultureTalentShow #culturePoster{padding-bottom: 60px;} .cultureTalentShow #culturePoster .box{display: flex; flex-wrap: nowrap; gap: 20px; height: 60vh;} .cultureTalentShow #culturePoster .talentCon{flex: 1 1 25%; background-image: linear-gradient(to right, #fafafa, #f0f3f9);border-radius: 20px; padding: 50px 40px;} .cultureTalentShow #culturePoster .talentCon h5{font-size: 30px; border-left: 5px solid #fe2929; padding-left: .5em; font-weight: bold; margin-bottom: 20px; color: #fe2929;} .cultureTalentShow #culturePoster .talentCon h6{font-size: 20px; margin-bottom: 20px; font-weight: bold;} .cultureTalentShow #culturePoster .talentCon .text{} .cultureTalentShow #culturePoster .talentCon .text p{font-size: 16px; line-height: 1.8em; margin-bottom: 1em; color: #666;} .cultureTalentShow #culturePoster .poster{flex: 1 55%; position: relative;} .cultureTalentShow #culturePoster .poster .img{height: 100%;} .cultureTalentShow #culturePoster .poster img{width: 100%; border-radius: 20px; height: 100%; object-fit: cover; transition: all.3s;} .cultureTalentShow #culturePoster .poster span{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); background: #fe2929; color: #fff; padding: 1em 1.5em; border-radius: 10px; opacity: 0; transition: all .3s;} .cultureTalentShow #culturePoster .poster:hover img{filter: brightness(.8);} .cultureTalentShow #culturePoster .poster:hover span{opacity: 1;} .cultureTalentShow #culturePoster .actPic{flex: 1 1 20%; display: flex; flex-wrap: wrap; row-gap: 20px; } .cultureTalentShow #culturePoster .actPic .pic{width: 100%; flex: 1 1 100%;} .cultureTalentShow #culturePoster .actPic img{width: 100%; border-radius: 20px; height: 100%; object-fit: cover;} .cultureTalentShow #culturePoster .swiper-pagination-bullet {width:30px;height:30px;text-align:center;line-height:30px;font-size:12px;color:#000;opacity:1;background:rgba(0,0,0,0.2); outline: none;} .cultureTalentShow #culturePoster .swiper-pagination-bullet-active {color:#fff;background:#fe212f;} .cultureTalentShow #culturePoster .swiper-pagination{bottom: 0px; } .cultrueWechat{margin-top: 60px; position: relative;} .cultrueWechat .selectArea{} .cultrueWechat .page{display: flex; flex-wrap: wrap; margin: 0 -30px; height: 200px; overflow: auto;} .cultrueWechat .page::-webkit-scrollbar {width:7px;height:7px;background-color:#f5f5f5;} /*定义滚动条轨道 内阴影+圆角*/.cultrueWechat .page::-webkit-scrollbar-track {box-shadow:inset 0 0 6px rgba(0,0,0,0.3);-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);border-radius:10px;background-color:#f6f6f6;} /*定义滑块 内阴影+圆角*/.cultrueWechat .page::-webkit-scrollbar-thumb {border-radius:10px;box-shadow:inset 0 0 6px rgba(0,0,0,0.1);-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.1);background-color:#0061ae;} .cultrueWechat .page li{flex: 0 0 33.33333%; margin-top: 30px; padding: 0 30px; display: none; position: relative;} .cultrueWechat .page li.show{display: block;} .cultrueWechat .page a{padding: 20px 10px; display: block;background: #f6f6f6; border-radius: 10px; color: #222;} .cultrueWechat .page h5{ text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; font-size: 16px;} .cultrueWechat .page a:hover{background: #da242b; color: #fff;} .cultrueWechat .selectArea{position: absolute; right: 0; top: 0;} .cultrueWechat .selectArea{display: flex;} .cultrueWechat .selectArea .yearSelect{ margin-left: 10px;} .rightFixed{position: fixed; right: 0; bottom: 10px; z-index: 999;} .rightFixed .list{position: relative; margin-bottom: 5px; display: block;} .rightFixed .list .icon{background: linear-gradient(180deg, rgba(1,176,241,1) 0%, rgba(0,94,173,1) 100%); padding: 6px; border-radius: 5px; width: 48px; height: 48px;} .rightFixed .list .con{position: absolute; right: 100%; top: 50%; transform: translate(0,-50%); width: 130px; height: 50px; display: none; align-items: center; justify-content: center; padding-right: 5px;} .rightFixed .list .con p{color: #fff;background: linear-gradient(180deg, rgba(1,176,241,1) 0%, rgba(0,94,173,1) 100%); display: block; width: 100%; text-align: center;border-radius: 5px; height: 100%; display: flex; align-items: center; justify-content: center;} .rightFixed .list .icon.top{cursor: pointer; display: flex; justify-content: center; align-items: center;} .rightFixed .list .icon.top span{color: #fff; font-size: 20px; font-weight: bold; position: relative;} .rightFixed .list .icon.top span::after{content: ''; position: absolute; left: 0; top: 5px; width: 100%; height: 2px; background: #fff; } .rightFixed .list .icon.top span{animation: floatUD2 2s linear infinite normal;;} .rightFixed .list:hover .con{display: flex;} .rightFixed .list img{max-width: 100%; max-height: 100%;} .IPflex .gifArea{display: flex; flex-wrap: wrap; position: relative; z-index: 2; margin: 0 -30px -40px;} .IPflex .gifArea .li{flex: 0 0 16.6666667%; padding: 0 30px; margin-bottom: 60px; } .IPflex .gifArea .box{transition: all .3s; position: relative; height: 100%; padding-bottom: 25px; border: solid 1px #e6e6e6; border-radius: 15px; overflow: hidden;} .IPflex .gifArea .box:hover{transform: translateY(-10px);} .IPflex .gifArea .img{margin: 0; padding: 20px; display: flex; align-items: center; height: 100%;} .IPflex .gifArea img{max-width: 100%; max-height: 100%;;opacity: .80; border-radius: 10px 10px 0 0 ; transition: all .3s;} .IPflex .gifArea .name{background: #f6f6f6; text-align: center; line-height: 40px; margin: 0; transition: all .3s; position: absolute; left: 0; bottom: 0; width: 100%;} .IPflex.mainboxGray .gifArea .name{background: #fff;} .IPflex .gifArea .box:hover img{opacity: 1;} .IPShow .list{margin-bottom: 20px; background-image: none !important; border-bottom: dashed 2px #ddd; padding-bottom: 60px;} .IPShow .list:hover{box-shadow: none !important;} .IPShow .list .img{border-radius: 15px;} .IPShow .list:last-child{border-bottom: none; padding-bottom: 0;} .IPShow .list:nth-child(1) .img{border: dashed 5px #10159e;} .IPShow .list:nth-child(2) .img{border: dashed 5px #c12d27;} .IPShow .list:nth-child(3) .img{border: dashed 5px #2cb8ff;} .IPShow h5{font-weight: bold;} .IPShow .list:nth-child(1) h5{color: #10159e;} .IPShow .list:nth-child(1) .con p::before{background: #10159e;} .IPShow .list:nth-child(2) h5{color: #c12d27;} .IPShow .list:nth-child(2) .con p::before{background: #c12d27;} .IPShow .list:nth-child(3) h5{color: #2cb8ff;} .IPShow .list:nth-child(3) .con p::before{background: #2cb8ff;} .IPShow .con h6{color: #232;} .wallPage .pdPic{position: relative; transition: all .3s;} .wallPage .pdPic::after{content: '右键另存为保存图片'; position: absolute; left: 50%; bottom: -20px; font-size: 14px; color: #999; transform: translate(-50%,10px); visibility: hidden; opacity: 0; transition: all .2s;} .wallPage .pdPic:hover{transform: scale(1.02);} .wallPage .pdPic:hover::after{visibility:visible; opacity: 1; transform: translate(-50%,0);} .law{ padding: 160px 120px 120px; background: #f6f6f6;} .law .bodyerRightBoxs{background: #fff; padding: 80px; border-radius: 20px;} .law h5{font-size: 20px; color: #005bac; margin-bottom: 10px; font-weight: bold;} .law p{font-size: 16px; color: #777; line-height: 2em; margin-bottom: 60px;} .law p:last-child{margin-bottom: 0;} .law p.sp{margin-bottom: 10px; font-size: 12px;} .law img{margin-top: 20px;} .webmap {padding: 40px 0 80px;} .webmap .top {height:60px;line-height:60px;} .webmap .top .logo {display:inline-block;} .webmap .top h5 {display:inline-block;line-height:1em;position:relative;top:12px;border-left:solid 1px #ddd;padding-left:10px;margin-left:10px;} .webmap .top .home {float:right;color:#666;position:relative;top:12px;transition:all .3s;} .webmap .top .home:hover {color:#005bac;} .webmap .menuBox {margin-top:40px; border-radius: 10px;} .webmap .menuBox .title {font-size:20px;background:#005bac;padding:20px;font-weight:bold; color: #fff; border-radius: 10px 10px 0 0;} .webmap .menuBox>ul {padding: 10px; background-image: linear-gradient(to right, #fafafa, #f0f3f9); border-radius: 0 0 10px 10px;} .webmap .menuBox ul>li {display:inline-block;position:relative;padding:10px 0;} .webmap .menuBox ul>li>a {padding:0 15px;display:block;font-size:14px;color:#666;border-right:solid 1px #ddd;} .webmap .menuBox ul>li:last-child a {border-right:none;} .webmap .menuBox ul>li>a:hover {color:#e62131;text-decoration: none;} .webmap .menuBox ul>li>ul {display:none;position:absolute;left:0;top:40px;width:auto;background:#ddd;z-index:99;border:solid 1px #e6e6e6; border-radius: 10px;} .webmap .menuBox ul>li>ul>li {display:block;padding:0;} .webmap .menuBox ul>li>ul>li>a {display:block;line-height:3em;border-right:none;font-size:14px;white-space:nowrap;padding-right:30px;} .webmap .menuBox ul>li:hover>ul {display:block;} .webmap .menuBox ul>li>ul>li>ul {display:none;left:calc(100% + 1px);top:2px;} .webmap .menuBox ul>li>ul>li>ul>li {position:relative;} .webmap .menuBox ul>li>ul>li:hover ul {display:block;} .webmap .menuBox .icon-jiantou_you {font-size:10px;position:absolute;top:50%;right:0;transform:translate(-10px,-50%);} .Avant-garde{padding: 0 30px; display: flex;} .Avant-garde .img{flex: 0 0 50%; } .Avant-garde img{max-width: 100%; max-height: 100%; object-fit: cover;border-radius: 15px;} .Avant-garde .con{flex: 0 0 50%; padding: 60px; border-radius: 15px;} .Avant-garde .con h5{font-size: 36px; font-weight: bold;} .Avant-garde .con p{font-size: 16px; color: #888; margin: 20px 0; line-height: 2em;} .Avant-garde .con .tem-more{background: #fe212f; margin: 46px 0 0 !important;} .Avant-garde .con .tem-more:hover::after{ background: rgba(254 ,33 ,47,.3);} .Avant-garde .con .tem-more .iconfont::after{background: #fff;} /* 管见 */ .thought-book .top-title{font-size: 36px; color: #333; font-weight: bold; margin: 0 auto; display: table; position: relative;} .thought-book .top-title::before{content: ''; position: absolute; left: 0; top: 50%; transform: translate(-420px,-50%); width: 400px; height: 6px; background: #000;} .thought-book .top-title::after{content: ''; position: absolute; right: 0; top: 50%; transform: translate(420px,-50%); width: 400px; height: 6px; background: #000;} .thought-book .top-title.thought-title::before{background: linear-gradient(to right,#fff,#a7e7ff);} .thought-book .top-title.thought-title::after{background: linear-gradient(to left,#fff,#a7e7ff);} .thought-book .top-title.book-title::before{background: linear-gradient(to right,#fff,#ffc770);} .thought-book .top-title.book-title::after{background: linear-gradient(to left,#fff,#ffc770);} .thought-book .index-row{margin: 60px -50px -60px;} .thought-book .col-lg-6{padding: 0 50px; margin-bottom: 80px;} .thought-book .index-row .box{background: #f6f6f6; border-radius: 20px; height: 200px; position: relative; display: block; transition: all .3s; display: flex; align-items: center;} .thought-book .mainboxGray .index-row .box{background: #fff;} .thought-book .index-row .box .img{width: 200px; height: 200px; position: absolute; left: 0; top: 0; z-index: 1; transform: scale(1.1);} .thought-book .index-row .box .img img{width: 100%; height: 100%; object-fit: cover; border-radius: 20px;} .thought-book .index-row .box .con{ position: relative; z-index: 1; padding: 0 40px 0 240px;} .thought-book .index-row .box .con .ti{font-size: 20px; font-weight: bold; color: #111; transition: all .3s; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;} .thought-book .index-row .box .con .stages{position: absolute; right: 0; top: 0; font-size: 14px; color: #aaa; transition: all .3s;} .thought-book .index-row .box .con .text{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: 14px; color: #777; line-height: 24px; margin: 15px 0; text-align: justify; transition: all .3s;} .thought-book .index-row .box .con .author{font-size: 16px; color: #333; font-weight: bold; transition: all .3s;} /* .thought-book .thought .index-row .box{box-shadow: 5px 5px 20px rgba(201, 228, 255, .4);} */ .thought-book .thought .index-row .box .img img{border: solid 4px #5dd7ff;} /* .thought-book .book .index-row .box{box-shadow: 5px 5px 20px rgba(249, 143, 48, .15);} */ .thought-book .book .index-row .box .img img{border: solid 4px #ffc770;} .thought-book .thought .box:hover{transform: translateY(-5px); box-shadow: 5px 5px 20px rgba(201, 228, 255, .75);} .thought-book .thought .box::after{background: #26b4ef;} .thought-book .thought .box:hover::after{transform: translateX(5%);} .thought-book .thought .box:hover .ti,.thought-book .thought .box:hover .stages,.thought-book .thought .box:hover .text,.thought-book .thought .box:hover .author{color: #0061ae;} .thought-book .book .box:hover{transform: translateY(-5px); box-shadow: 5px 5px 20px rgba(249, 143, 48, .3);} .thought-book .book .box::after{background: #f98f30;} .thought-book .book .box:hover::after{transform: translateX(5%);} .thought-book .book .box:hover .ti,.thought-book .book .box:hover .stages,.thought-book .book .box:hover .text,.thought-book .book .box:hover .author{color: #da242b;} .thought-book .pagiGroup{margin-top: 60px;} .thought-book .thought .pagiGroup li .active{background: #20b1e0;} .thought-book .book .pagiGroup li .active{background: #f98f30;} .historyComp{display: flex; border-top: solid 1px #ddd; margin-top: 180px;} .historyComp .li{flex: 1; position: relative; padding-top: 40px;} .historyComp .li::after{content: ''; width: 30px; height: 30px; border-radius: 50%; position: absolute; left: 50%; top: 0; transform: translate(-50%,-50%); border: solid 1px #005bac;} .historyComp .li::before{content: ''; background: #005bac; width: 20px; height: 20px; border-radius: 50%; position: absolute; left: 50%; top: 0; transform: translate(-50%,-50%); } .historyComp .li .year{ text-align: center; font-size: 24px; font-weight: bold; margin-bottom: 1em;} .historyComp .li p{ text-align: center; font-size: 16px; color: #888; padding: 0 10px;} .historyComp .li:nth-child(even) .year{transform: translateY(-100px);} .historyComp .li:nth-child(even) p{transform: translateY(-220px);} /* li[data-years="2021"]{display: none;} */ @media screen and (max-width: 768px) { .marginTop20{margin-top: 20px;} .marginTop30{margin-top: 30px;} .marginTop40{margin-top: 40px;} .marginTop60{margin-top: 40px;} .marginTop80{margin-top: 60px;} .marginTop100{margin-top: 80px;} .marginTop120{margin-top: 100px;} .marginB10{margin-bottom: 10px;} .marginB20{margin-bottom: 20px;} .marginB30{margin-bottom: 30px;} .marginB40{margin-bottom: 40px;} .marginB60{margin-bottom: 40px;} .marginB-20{margin-bottom: -20px;} .marginB-40{margin-bottom: -40px;} .marginB-60{margin-bottom: -60px;} /* body{overflow: hidden;} */ .header{display: block;} .container{width: 100%; max-width: 100%; padding: 0 15px;} .mainbox{padding: 60px 0;} .template-ti{font-size: 30px;} .index-Recommend .row{margin: 50px 0 0; gap: 50px;} .index-Recommend .col-lg-6{padding: 0 0 ; flex: 1 1 100%;} .index-Recommend .con{padding: 30px;} .index-Recommend .con h5{font-size: 20px;} .index-about .template-ti{font-size: 24px;} .index-about .template-sti{font-size: 18px;} .ZTPD{display: none;} .index-products{padding-bottom: 0;} .index-products .align-items-start{flex-wrap: wrap;} .index-products .nav-pills{margin: 0 0 40px !important; flex: 1 1 100%; display: flex; flex-direction: row!important; gap: 20px; flex-wrap: wrap;} .index-products .nav-pills .nav-link{width: unset; flex: 1 1 auto; height: 60px; gap: 10px; margin-bottom: 0;} .index-products .nav-pills .nav-link.active{width: unset;} .index-products .nav-pills .nav-link p{font-size: 18px;} .index-products .nav-pills .nav-link img{width: 30px;} .index-products .content{padding: 80px 0;} .index-products .content .bg{object-fit: cover;} .index-products .pdtext{display: none;} .index-products .con h5{font-size: 30px; text-align: center;} .index-products .con .index-more{margin: 40px auto 0 !important;} .index-banner .swiper-container{height: auto;} .index-news .container{width: 100%; max-width: 100%;} .index-news .left{float: none; width: 100%; margin: 0;} .index-news .right{float: none; width: 100%; display: none;} .index-news .left .con{flex: 0 0 100%; max-width: 100%; padding: 0;} .customers .logoArea{margin: 0; gap: 20px; justify-content: space-between;} .customers .logoArea .li{flex: 0 0 50%; max-width: 46%; padding: 0; margin-bottom: 0;} .customers.index .logoArea .li:nth-child(n+7){display: none;} .footer .top{flex-wrap: wrap;} .footer .menu-list{float: none; margin: 0 0 30px; display: block; flex: 1 1 100% ;} .footer .top{padding: 50px 0;} .footer .menu-list a.link{display: none;} .footer .menu-list h5.link{display: block; margin-bottom: 10px; position: relative;} .footer .menu-list h5.link::after{content: '▼'; font-size: 12px; position: absolute; right: 0; bottom: 0; transition: all .3s;} .footer .menu-list h5.link.rotate::after{transform: rotate(-180deg);} .footer .menu-list:last-child{float: none; margin-bottom: 0; text-align: center;} .footer .menu-list ul{background: rgba(0, 0, 0, 0.15); max-height: 0; overflow: hidden; padding: 0; transition: all .3s;} .footer .menu-list ul li{font-size: 16px;} .footer .menu-list ul.show{transform: scale(1,1); display: block; max-height: 200px; padding: 15px;} .footer .bottom{line-height: 2em; text-align: center; padding: 1em 0;} .footer .bottom .copy{float: none;} .footer .bottom .LM{float: none;} .footer .bottom .copy p, .footer .bottom .copy a{display: block; margin: 0;} .aboutMenu{display: none;} .pageBanner{background-position: center;} .pageBanner.abouts{min-height: 200px; height: auto;} .pageBanner .title{font-size: 30px; padding-top: 60px;} .aboutPage .video{width: 100%;} .aboutPage .intro{width: 100%; margin-top: 40px;} .aboutPage.company .row{margin: 60px 0 -40px;} .aboutPage.company .col-lg-3{padding: 0;} .contactsPage .ygZH{height: auto; display: block;} .contactsPage .ygZH .img img{width: 100%; height: auto; border-radius: 15px 15px 0 0;} .contactsPage .ygZH .con{padding: 30px;} .contactsPage .ygZH h5{font-size: 20px; margin-bottom: 30px;} .contactsPage .ygZH ul li{flex: 1 1 auto; margin-bottom: 15px;} .contactsPage .ygSc{margin: 60px 0 0; flex-wrap: wrap;} .contactsPage .ygSc .li{flex: 1 1 auto; max-width: unset; padding: 0; margin-bottom: 20px;} .contactsPage .ygSc .con{height: auto;} .contactsBri{margin: 0;} .contactsBri .col-lg-4{padding: 0; margin-bottom: 20px;} .contactsBri .box{padding: 30px;} .contactsBri .img{width: 72px; height: 72px; margin: 0 auto 25px;} .contactsBri .img img{width: 36px;} .inPageTi{font-size: 30px;} .coArea{display: block;} .coArea img{width: 100%;} .coArea .con{width: 100%; margin: 30px 0 0;} .contact-page .map .nav-item{flex: 1 1 33.333%; width: unset;} .CulturePage #culturePoster::before{display: none;} .CulturePage #culturePoster .box .con::after{display: none;} .CulturePage #culturePoster .swiper-slide{padding: 0;} .CulturePage #culturePoster .box{display: block; padding: 0;} .CulturePage #culturePoster .box img{max-height: unset; max-width: 100%;} .CulturePage #culturePoster .box .con::before{display: none;} .CulturePage #culturePoster .box .con{padding: 30px 20px 30px; min-height: unset; position: static; width: 100%; transform: translateY(-40px);} .CulturePage #culturePoster .box .con .ti{font-size: 18px;} .CulturePage #culturePoster .box .con .text{font-size: 14px; color: #000 !important;} .CulturePage #culturePoster .swiper-pagination{right: unset; left: 50%; transform: translate(-50%,0); bottom: 0;} .culturalActivity #culturalActivity{padding: 30px 70px 60px;} .culturalActivity #culturalActivity .box .ti{font-size: 16px;} .temFlex .col-2{flex: 0 0 100%;} .col-3{flex: 0 0 100%;} .col-4{flex: 0 0 100%;} .col-6{flex: 0 0 100%;} .col-8{flex: 0 0 100%;} .col-12{flex: 0 0 100%;} .temFlex.margin40{margin: unset 0;} .temFlex.margin40 .li{padding: 0 0;} .temFlex.margin40 .col-2{padding: 0 0; margin-bottom: 40px;} .temFlex.margin40 .col-3{padding: 0 0; margin-bottom: 40px;} .temFlex.margin40 .col-4{padding: 0 0; margin-bottom: 40px;} .temFlex.margin40 .col-6{padding: 0 0; margin-bottom: 40px;} .temFlex.margin40 .col-8{padding: 0 0; margin-bottom: 40px;} .temFlex.margin40 .col-12{padding: 0 0; margin-bottom: 40px;} .temFlex.margin30{margin: unset 0;} .temFlex.margin30 .li{padding: 0 0;} .temFlex.margin30 .col-2{padding: 0 0; margin-bottom: 30px;} .temFlex.margin30 .col-3{padding: 0 0; margin-bottom: 30px;} .temFlex.margin30 .col-4{padding: 0 0; margin-bottom: 30px;} .temFlex.margin30 .col-6{padding: 0 0; margin-bottom: 30px;} .temFlex.margin30 .col-8{padding: 0 0; margin-bottom: 30px;} .temFlex.margin30 .col-12{padding: 0 0; margin-bottom: 30px;} .temFlex.margin60{margin: unset 0;} .temFlex.margin60 .li{padding: 0 0;} .temFlex.margin60 .col-2{padding: 0 0; margin-bottom: 60px;} .temFlex.margin60 .col-3{padding: 0 0; margin-bottom: 60px;} .temFlex.margin60 .col-4{padding: 0 0; margin-bottom: 60px;} .temFlex.margin60 .col-6{padding: 0 0; margin-bottom: 60px;} .temFlex.margin60 .col-8{padding: 0 0; margin-bottom: 60px;} .temFlex.margin60 .col-12{padding: 0 0; margin-bottom: 60px;} .temFlex.margin90{margin: unset 0;} .temFlex.margin90 .li{padding: 0 0;} .temFlex.margin90 .col-2{padding: 0 0;} .temFlex.margin90 .col-3{padding: 0 0; margin-bottom: 60px;} .temFlex.margin90 .col-4{padding: 0 0; margin-bottom: 60px;} .temFlex.margin90 .col-6{padding: 0 0; margin-bottom: 90px;} .temFlex.margin90 .col-8{padding: 0 0; margin-bottom: 90px;} .temFlex.margin90 .col-12{padding: 0 0; margin-bottom: 90px;} .temFlex .col-2.colFive{flex: 1 1 100%;} .temFlex.linearBox .col-2.colFive{margin-bottom: 100px;} .CulturePage .actArea{gap: 50px; flex-wrap: wrap;} .CulturePage .actArea .img{flex: 1 1 100%;} .CulturePage .actArea .con{flex: 1 1 100%;} .CulturePage .actDetail{padding: 40px;} .cultrueWechat .page{margin: 30px 0; gap: 20px; height: 40vh;} .cultrueWechat .page li{flex: 1 1 100%; padding: 0 10px; margin-top: 0;} .swiperPhotos{width: 100%;} .swiperPhotosTop{height: auto;} .phonePic .list{padding: 0; flex-wrap: wrap; margin-bottom: 40px;} .conPicFlex .list:nth-child(odd){flex-direction: row;} .normalPic .img{flex: 1 1 100%;} .conPicFlex .list .con{flex: 1 1 100%; transform: none; padding: 0 40px;} .CulturePage .conPicFlex img{max-height: unset; max-width: 100%;} .cultureTalentShow #culturePoster .box{flex-wrap: wrap; height: auto;} .cultureTalentShow #culturePoster .talentCon{flex: 1 1 100%;} .cultureTalentShow #culturePoster .poster{flex: 1 1 100%;} .cultureTalentShow #culturePoster .actPic{gap: 20px;} .cultureTalentShow #culturePoster .actPic .pic{flex: 0 0 46%;} .customer-page .template-text{width: 100%;} .customer-page .nav{margin-bottom: 40px !important;} .customer-page .nav .nav-item{margin: 0; flex:1 1 auto; margin-bottom: 10px;} .historyPage .container{width: 100%;} .historyPage .hisList .box{padding: 80px 0 80px 30px;} .historyPage .hisList .con{flex-wrap: wrap; width: 100%;} .historyPage .hisList .year{left: 30px;} .historyPage .hisList .box::before{left: 0;} .historyPage .hisList .box::after{left: 0;} .historyPage .hisList .con::before{display: none;} .investor .form{margin: 60px 0 0 ;} .investor .form .ul{flex: 1 1 100%; max-width: unset; padding: 0; margin-bottom: 0;} .investor .form .red{font-size: 14px;} .investor .form p{font-size: 14px; display: block;} .investor .shares{margin: 60px 0 0; flex-wrap: wrap; gap: 30px;} .investor .shares .shares-li{flex: 1 1 100%; max-width: unset; padding: 0;} .investor .one-pic img{max-width: 100%;} .investor .record-sheet .row{margin-bottom: -60px;} .honorPage .front .DSbox h5{font-size: 18px;} .investorInpage .Inpage-area{flex-wrap: wrap;} .investorInpage .Inpage-area .left-area{flex: 1 1 100%; max-width: unset;} .investorInpage .Inpage-area .right-area{flex: 1 1 100%; min-width: unset; margin-left: 0; margin-top: 40px;} .newsArea .top a{flex-wrap: wrap; padding: 20px 20px 0px;} .newsArea .top .pic{flex: 1 1 100%; max-width: 100%;} .newsArea .top .con{flex: 1 1 100%; max-width: 100%; padding: 30px 0;} .newsArea .top .bottom{display: none;} .newsArea .top .con .ti{font-size: 20px; margin-bottom: 1em;} .newsArea .top .con p{font-size: 16px;} .newsMenu ul{flex-wrap: wrap; justify-content: space-around;} .newsMenu ul li:nth-child(1){flex: 1 1 100%; padding-left: 1em;} .newsMenu ul li{margin: 0;} .newsList{margin: 0 0 -60px;} .newsList .li{padding: 0; flex: 1 1 100%; max-width: unset;} .SearchPageArea{width: 90vw;} .search-area .input{padding-right: 140px;} .search-area .button{width: 120px;} .newsDetail{flex-wrap: wrap; flex-direction: column-reverse;} .newsDetail .content p img{max-width: 100%;} .newsDetail .menuCon{flex: 0 0 100%; max-width: 100%;} .newsDetail .content{padding: 20px; flex: 0 0 100%; max-width: 100%;} .newsDetail .content .top .title{font-size: 24px;} .responsibility-page .row{margin: 60px 0 -40px;} .responsibility-page .col-lg-3{padding: 0;} .aboutPage .leader{margin: 60px 0 0; flex-wrap: wrap;} .aboutPage .leader .pic{flex: 1 1 100%; margin-bottom: 30px;} .aboutPage .leader .pic::before{display: none;} .aboutPage .leader .con{flex: 1 1 100%;} .aboutPage .leader .pic img{max-width: 100%;} .AIpage .intro{width: 100%;} .temFlex.noMargin .li{flex: 1 1 100%;} .PDbox .box{padding: 30px;} .temFlex.linearBox .col-3{margin-bottom: 120px;} .cloudBanner .img{max-width: 100%;} .cloudBanner .img img{max-width: 100%;} .cloudBanner .text{width: 100%;} .fullpic .list{flex-wrap: wrap; padding: 40px 20px; margin-bottom: 20px;} .fullpic .img img{max-width: 100%;} .conPicFlex .list .con{padding: 0;} .cloudBg .intro p{width: 100%;} .normalPic .list{padding: 0 20px 20px; flex-wrap: wrap;} .normalPic .list:last-child{margin-bottom: 0;} .temFlex.normalCard{margin-bottom: -60px;} .honorPage .cardRow{margin: 80px 0 -60px;} .honorPage .cardRow .col-12{padding: 0 20px;} .CloudTem .intro{width: 100%;} .conPicFlex .list{flex-wrap: wrap; padding: 60px 20px;} .conPicFlex .list .pic{flex: 1 1 100%; margin-bottom: 60px;} .conPicFlex .list .pic img {width: 100%;} .flexBanner{padding: 60px 0;} .flexBanner .con{transform: none;} .flexBanner .con .ti{text-align: center;} .flexBanner .flex{flex-wrap: wrap;} .flexBanner .lia{flex: 1 1 100%;} .flexBanner .lib{flex: 1 1 100%;} .flexBanner .lib img {max-width: 100%;} .onePicli{width: 100%;} .onePicli .list .img img{max-width: 100%;} .pageBanner.wlxmb{background-position: 20% 0;} .schoolJob .nav{flex-wrap: wrap; gap: 10px;} .schoolJob .nav .nav-item{flex: 1 1 48%; } .schoolJob .nav .nav-link{width: 100%; padding: .8em 1em;} .schoolJob .nav .nav-link img{max-width: 24px; max-height: 24px; object-fit: cover;} .schoolJob .job-area{flex-wrap: wrap;} .schoolJob .job-area .col-3{flex: 1 1 100%; max-width: unset;} .schoolJob .job-area .col-9{flex: 1 1 100%; max-width: unset;} .societyJob .job-list{padding: 30px;} .societyJob .job-list .job-tips span{border-right: none; line-height: 1.8em;} .societyJob .job-list .apply{position: static; margin: 30px auto 0; display: table;} .schoolJob .job-area .nav-item{flex: 1 1 100%; } .schoolJob .job-area .nav-link{line-height: 50px;} .schoolJob .table{width: auto; overflow: auto;} .schoolJob table{width: auto; margin-top: 20px;} .schoolJob table th, .schoolJob table td{white-space: nowrap; padding: 12px 20px; font-size: 14px;} .schoolJob table th{font-size: 18px;} .tableTips{display: block; text-align: center;} .commerce-page .process{flex-wrap: wrap; gap: 100px;} .commerce-page .process .list{flex: 1 1 100%; max-width: unset;} .commerce-page .process .list::before{top: unset; left: 50%; bottom: 0; transform: translate(-50%,250%) rotate(90deg); width: 22px; line-height: 22px;} .commerce-page .process .list::after{display: none;} /* .schoolJob .one-pic img{max-width: 100%;} */ .schoolJob .quesiton-area{width: 100%;} .schoolJob .quesiton-list .ti{line-height: 1.8em;padding: 10px 20px;} .schoolJob .quesiton-list .ti{line-height: 1.8em;padding: 10px 20px;} .schoolJob .quesiton-list .ti::before{top: 12px; transform: none;} .impressionPage .nav{flex-wrap: wrap; gap: 10px; padding: 0 15px;} .impressionPage .nav .nav-item{flex: 1 1 48%; } .impressionPage .nav .nav-link{width: 100%; padding: .8em 1em;} .impressionPage .nav .nav-link img{max-width: 24px; max-height: 24px; object-fit: cover;} .centerPic {padding: 0 15px;} .centerPic img{max-width: 100%;} .impressionPage .train-pic{margin: 60px 0 0;} .impressionPage .train-pic .col-4{padding: 0;} .impressionPage .train-pic .col-4:nth-last-child(2){margin-bottom: 60px;} .impressionPage .train-pic .col-4:nth-last-child(1){margin-bottom: 0;} .impressionPage .train-pic .img{position: static;} .impressionPage .train-pic .box{height: 100%;} .impressionPage .train-pic .box:hover .con{padding: 20px 0;} .impressionPage .train-pic .con p{width: 100%; font-size: 16px; padding: 0 15px;} .width1000{width: 100%;} .width1200{width: 100%;} .impressionPage .PostConversion{padding: 0 0;} .temFlex.innner .svg img{max-width: 100%;} .work-story .box{flex-wrap: wrap; gap: 40px; padding: 30px;} .work-story .box img{max-width: 100%;} .work-story .font-blue{width: 100%;} .work-story .bottom-li .img img{max-width: 100%;} .imagesFlex{gap: 40px; flex-wrap: wrap;} .imagesFlex .nav{flex: 1 1 100%;} .flexAccordion .li .box .img{height: 50vw; background-size: cover;} .impressionPage .nav .nav-link{margin-bottom: 0;} .flexAccordion{flex-wrap: wrap;} .flexAccordion .li{flex: 1 1 100%;} .flexAccordion .li.active{flex: 1 5 100%;} .flexAccordion .li .box .img{filter: brightness(1);} .flexAccordion .li .box .ti{ background: linear-gradient(180deg, rgba(1,176,241,1) 0%, rgba(0,94,173,1) 100%);} .impressionPage .hjnav{display: flex; flex-direction: row !important; padding: 0;} .impressionPage .hjnav .nav-link{flex: 0 0 31%; width: unset; max-width: unset; padding: 0 !important;} .impressionPage .hjnav .nav-link img{ max-width: 100%; max-height: unset; width: 100%; height: 25vw;} .imagesFlex .nav .nav-link p{line-height: 30px;} .impressionPage .flexAccordionD{width: 100%;} .impressionPage .flexAccordionE{width: 100%;} .temFlex.CascadeBox .box .text{padding: 20px; border-radius: 20px; transform: translateY(-30px);} .temFlex.CascadeBox .box .pic img{height: 60vw; width: 100%;} .recommendCode{padding: 60px 30px;} .recommendCode img{max-width: 100%;} .societyJobArea {flex-wrap: wrap;} .societyJobArea .leftMenu{flex: 1 1 100%;} .societyJob .job-detail{padding: 30px; margin-bottom: 120px;} .societyJob .job-detail .job-title{font-size: 24px;} .societyJob .job-detail .apply{position: static; margin: 30px auto 15px; display: table; font-size: 16px;} .platFunction{width: 100%; margin: 60px 0 0;} .SDPlatform .platFunction .box{width: unset; height: unset; border: none; margin-bottom: -20px;} .SDPlatform .platFunction .con{position: static; width: unset !important; height: unset !important; border-radius: 20px; transform: none !important; padding: 30px 20px; margin-bottom: 20px;} .SDPlatform .platFunction .con:nth-child(1){width: 50vw !important; border-radius: 20px; margin: 0 auto 30px;} .SDPlatform .platFunction .con h5{position: static; transform: none; font-size: 20px;} .SDPlatform .platFunction .con p{display: block; position: static; transform: none !important; width: unset; opacity: 1; margin-top: 1em;} .SDPlatform .platFunction .con p::after{display: none;} .SDPlatform .tab-pane .topCon{width: 100%; flex-wrap: wrap;} .SDPlatform .platFunction .tips{display: none;} .SDPlatform .tab-pane .content .row{margin: 0 0 60px; padding: 0;} .SDPlatform .nav{gap: 10px;} .SDPlatform .nav .nav-item{flex: 1 1 48%;} .SDPlatform .nav .nav-link{padding: 20px 0; width: 100%; font-size: 16px;} .SDPlatform .tab-pane .topCon{margin: 50px 0;} .SDPlatform .tab-pane .content .col-lg-4{padding: 0;} .SDPlatform .tab-pane .pic img{max-width: 100%;} .SDPlatform .contacts{flex-wrap: wrap; gap: 50px;} .SDPlatform .contacts .li{flex: 1 1 100%; flex-wrap: wrap; flex-direction: column; justify-content: center; text-align: center; gap: 30px; border: none !important;} .SDPlatform .contacts .icon{margin: 0 auto;} .temFlex.normalCard .box{padding: 30px;} .IPflex .gifArea{margin: 0 0 -40px;} .IPflex .gifArea .li{flex: 0 0 50%; padding: 0 15px;} .law{ padding: 120px 0; background: #f6f6f6;} .law .bodyerRightBoxs{padding: 40px 30px;} .Avant-garde{padding: 0; flex-wrap: wrap;} .Avant-garde .img{flex: 0 0 100%;} .Avant-garde .con{flex: 0 0 100%; padding: 20px;} .thought-book .container{width: 100%; max-width: 100%;} .thought-book .top-title{font-size: 30px;} .thought-book .top-title::before{width: 100px; transform: translate(-120px,-50%);} .thought-book .top-title::after{width: 100px; transform: translate(120px,-50%);} .thought-book .index-row{margin: 40px 0 -40px;} .thought-book .col-lg-6{padding: 0; margin-bottom: 40px;} .thought-book .index-row .box{height: auto; padding: 30px 15px; border-radius: 30px; display: block;} .thought-book .index-row .box .img{position: static; display: table; margin: 0 auto 20px; transform: scale(1);} .thought-book .index-row .box .con{width: 100%; margin: 0; padding: 20px;} .thought-book .index-row .box::after{display: none;} .thought-book .index-row .box .con .stages{position: static; margin-top: 10px; display: block;} .thought-book .thought .box:hover .ti,.thought-book .thought .box:hover .stages,.thought-book .thought .box:hover .text,.thought-book .thought .box:hover .author{color: #26b4ef;} .thought-book .book .box:hover .ti,.thought-book .book .box:hover .stages,.thought-book .book .box:hover .text,.thought-book .book .box:hover .author{color: #f98f30;} } /* 手机菜单专用 */ @media screen and (max-width: 1023px) { .header{display: flex; padding: 0 15px;} .header .logo img{height: 32px;} .header .menu{position: fixed; left: 0; top: 90px; background: #fff; flex-wrap: wrap; height: 100vh; width: 70vw; z-index: 999; align-content: flex-start; padding: 20px 0; transform: translateX(-100%); transition: all .2s;} .header .menu.show{transform: translateX(0);} .header .menu>li{flex: 0 0 100%; z-index: 99; position: relative; border-bottom: 1px solid #e6e6e6; z-index:auto;} .header .menu>li>a{line-height: 3.2em; position: relative; z-index:auto;} .header>.menu>li>a .iconArrow{transform: translateY(-50%) rotate(-90deg); position: absolute; right: 0; top: 50%; } .header>.menu>li>a::before{left: 10px;} /* .header .menu .submenu{display: none;} */ .header .menu .submenu{ position: fixed; left: 0; top: 0; width: 65vw; height: 100vh;;transform: translate(-100%,0) !important; visibility: hidden; display: flex; flex-direction: row; flex-wrap: wrap; z-index: 1000; opacity: 0; align-content: baseline; transition: all .2s; } .header .menu .submenu.aboutSub{ width: 65vw; padding: 20px 0; top: 0; background: #fff; transition: all .2s; } .header .menu .submenu.groupSub{width: 65vw; top: 0;padding: 20px 0; background: #fff; flex-wrap: wrap;} .header .menu .submenu.groupSub .SDmenu{padding-right: 0; z-index: 999; border: none;} .header .menu .submenu.groupSub .SDmenu ul{margin: 0 10px; padding: 10px 5px 10px 0; background: #f6f6f6; max-height: 40vh; overflow-y: scroll;} .header .menu .submenu.groupSub .SDmenu li{flex: 1 1 50% !important; background: #f6f6f6; padding: 0 10px; margin-bottom: 20px !important;} /* .header .menu .submenu.groupSub .SDmenu img{ background: #f6f6f6; height: 60px;} */ .header .menu .submenu.groupSub .SDmenu a{font-size: 14px;} .header .menu .submenu.groupSub .menuList{flex: 1 1 100%; margin-top: 20px; padding: 10px;} .header .menu .submenu.groupSub .menuList li a{line-height: 1.8em; padding: 15px; font-size: 16px;} .header .menu .submenu.groupSub .SDmenu:nth-child(2) img{height: unset;} .header .menu .submenu.groupSub .SDmenu:nth-child(3) img{height: unset;} .header .menu .submenu.show{visibility: visible; transform: translate(0,0) !important; opacity: 1;} .header .menu .submenu.hide{visibility: hidden; transform: translate(-100%,0) !important; opacity: 0;} .header .menu>li>.submenu li{ margin-bottom: 0 !important; border: none !important; background: #fff; } .header .menu .submenu.groupSub .dap{max-width: 100%;} .header .menu .submenu .ti{margin: 0 10px 0 !important; font-size: 20px; background: #f6f6f6; padding: 10px; } .header .menu .submenu.normalMenu{width: 65vw; padding: 20px 0; flex-wrap: wrap;} .header .menu .submenu.normalMenu .menuList{margin: 0 0;} .header .menu .submenu.normalMenu .menuList li{flex: 1 1 100%; padding: 0; margin-bottom: 10px !important;} .header .menu .submenu.normalMenu .menuList a{font-size: 16px; padding: 0 20px;} .header .menu .submenu .menuList{display: flex; flex-wrap: wrap; flex: 1 1 100%; background: #fff; position: relative; z-index: 1002; margin-bottom: 20px;} .header .menu .submenu .menuList li{flex: 1 1 100%; z-index: 999; position: relative; border-bottom: 1px solid #e6e6e6;} .header .menu .submenu .menuList li a{line-height: 1.8em; padding: 10px 20px !important; font-size: 15px;} .header .menu .submenu.normalMenu.Join{width: 65vw; right: unset; left: 0;} /* .header .menu .submenu .menuList li a::after{content: '▶'; font-size: 12px; position: absolute; right: 15px; top: 50%; transform: translate(0,-50%); color: #999;} */ .header .menu .submenu .ygzb{display: none;} .header .menu .submenu .menuList li a.noarrow::after{display: none;} .header .menu .submenu.aboutSub.short{width: 65vw; padding: 20px 0;} .header .menu>li>.submenu .subMask{position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.3); width: 100vw; height: 100vh; z-index: 0;} .header .menu>li>.submenu .subMenuBg{content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #fff; } .header>.mask{ position: absolute; left: 0; top: 90px; width: 0; height: 100vh; background: rgba(0, 0, 0, 0.3); z-index: 9; visibility: hidden; opacity: 0; transition: all .2s;} .header>.mask.show{width: 100vw; visibility:visible; opacity: 1;} .header .submenu>.mask{ position: absolute; left: 0; top: 0; width: 0; height: 100vh; background: rgba(0, 0, 0, 0.3); z-index: 9; visibility: hidden; opacity: 0; transition: all .2s;} .header .submenu>.mask.show{width: 100vw; visibility:visible; opacity: 1;} .moblieMenuBt{ display: flex; gap: 20px} .moblieMenuBt i{width: 40px; line-height: 40px; background: #f6f6f6; text-align: center; border-radius: 50%; font-size: 18px; font-weight: bold;} .moblieMenuBt .icon-guanbi{display: none;} .header .searchBox{ position: absolute; left: 0; top: 90px; width: 100%; z-index: 99999; background: #fff; padding: 30px 20px; visibility: hidden; opacity: 0; transform: translateY(-20px); transition: all .2s;} .header .searchBox.show{visibility: visible; opacity: 1; transform: translateY(0);} .header .searchBox .mask{position: absolute; left: 0; top: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.3); z-index: -1;} .header .searchBox .maskW{ width: 100%; height: 150px;background: #fff; position: absolute; left: 0; top: 0; z-index: -1;} .header .searchBox input{width: 100%;} .header .searchBox .lang{margin-bottom: 20px; text-align: center;} .header .searchBox .search{position: relative;} .header .searchBox .search-button{position: absolute; right: 0; top: 0;} .rightFixed{display: none;} } @media screen and (min-width: 769px) and (max-width: 1024px) { .container{width: 100%; padding: 0 50px; max-width: 100%;} .index-about .template-ti{font-size: 54px;} .index-about .template-sti{font-size: 18px;} .mainbox{padding: 80px 0;} .index-Recommend .container{width: 100%;} .index-Recommend .row{margin: 80px -20px 0;} .index-Recommend .col-lg-6{flex: 0 0 50%; padding: 0 20px;} .index-Recommend .con{padding: 40px;} .index-Recommend .box{height: 100%; background: #fff; border-radius: 20px; overflow: hidden;} .index-Recommend .con h5{font-size: 24px;} .ZTPD{ grid-column-gap: 20px; grid-row-gap: 20px} .ZTPD .more .bt{padding: 5px;} .index-products .nav-pills{margin-right: 50px !important;} .index-products .nav-pills .nav-link{width: 160px; gap: 10px; height: 72px;} .index-products .nav-pills .nav-link.active{width: 200px;} .index-products .nav-pills .nav-link p{font-size: 20px;} .index-products .nav-pills .nav-link img{width: 30px;} .index-products .con h5{font-size: 48px;} .index-products .pdtext h6{font-size: 24px;} .index-products{padding-bottom: 0;} .index-news .container{width: 100%;} .index-news .content{flex-wrap: wrap; gap: 40px;} .index-news .right{flex: 1 1 100%;} .customers .logoArea .li{flex: 0 0 20%; max-width: unset;} .footer .container{width: 100%;} .aboutPage .video{width: 100%;} .aboutPage .intro{width: 100%;} .aboutPage.company .col-lg-3{flex: 0 0 50%;} .contactsPage .ygZH{height: unset; flex-wrap: wrap;} .contactsPage .ygZH .img{ flex: 0 0 100%;} .contactsPage .ygZH .img img{width: 100%; object-fit: cover; height: unset; border-radius: 15px;} .contactsPage .ygZH .con{padding: 30px;} .contactsPage .ygZH ul{gap: 40px;} .contactsPage .ygZH ul li{flex: 0 0 auto;} .contactsPage .ygSc{margin: 60px -20px 0;} .contactsPage .ygSc .li{padding: 0 20px;} .contactsPage .ygSc .con{height: unset; height: 100%;} .contactsBri{margin: 0; gap: 40px;} .contactsBri .col-lg-4{padding: 0; flex: 1 1 33.3333%;} .coArea{flex-wrap: wrap;} .coArea img{max-width: 100%;} .coArea .con{margin-left: 0; padding: 40px 0 0;} .contact-page .col-lg-4{flex: 1 1 50%;} .CulturePage #culturePoster::before{display: none;} .CulturePage #culturePoster .box .con::after{display: none;} .CulturePage #culturePoster .swiper-slide{padding: 0 30px 80px;} .CulturePage #culturePoster .box{padding-right: 0;} .CulturePage #culturePoster .box .con .ti{font-size: 20px;} .CulturePage #culturePoster .box .con .text{font-size: 16px;} .CulturePage #culturePoster .swiper-slide:nth-child(1) .box .con{right: 50px; top: 50%; transform: translateY(-50%);} .CulturePage #culturePoster .swiper-slide:nth-child(2) .box .con{left: 50px; top: 50%; transform: translateY(-50%);} .CulturePage #culturePoster .swiper-slide:nth-child(3) .box .con{right: 50px; top: 50%; transform: translateY(-50%);} .CulturePage #culturePoster .swiper-slide:nth-child(4) .box .con{bottom: 20%; transform: translateY(20%);} /* .CulturePage #culturePoster .box img{height: 60vw;} */ .CulturePage #culturePoster .swiper-pagination{right: 20px;} .temFlex.margin60 .col-4{width: unset; flex: 1 1 100%;} .temFlex.cultureCard .box img{height: unset;} .CulturePage .actArea{gap: 50px;} .swiperPhotos{width: 100%;} .cultrueWechat .page{margin: 0 ; column-gap: 30px; padding-right: 20px;} .cultrueWechat .page li{padding: 0; flex: 1 1 30%;} .phonePic .list{padding: 0;} .CulturePage .conPicFlex{display: flex; flex-wrap: wrap; gap: 60px;} .temFlex.margin60 .col-4{flex: 1 1 50%;} .temFlex.cultureCard .box{height: 100%;} .temFlex.cultureCard .box img{height: 240px;} .temFlex.cultureCard .box video{height: 240px;} .cultureTalentShow #culturePoster{padding-bottom: 100px;} .cultureTalentShow #culturePoster .box{flex-wrap: wrap;} .cultureTalentShow #culturePoster .talentCon{flex: 1 1 100%;} .customer-page .nav{gap: 20px;} .customer-page .nav .nav-item{flex: 1 1 auto;} .customer-page .nav .nav-link{margin: 0; width: 100%;} .historyPage .container{width: 100%;} .honorPage .cardRow{margin: 60px 0 -60px;} .honorPage .cardRow .col-12{flex: 1 1 50%;} .investor .form .ul{flex: 1 1 100%; max-width: unset;} .investor .shares{margin: 60px -20px 0;} .investor .shares .shares-li{padding: 0 20px;} .investor .one-pic img{max-width: 100%;} .investor .record-sheet .row{margin: 60px 0 -60px;} .investor .notice .row{margin: 0 0;} .investorInpage .Inpage-area .left-area{flex: 1 1 100%; } .newsList{margin: 0 0 -20px; gap: 40px; flex-wrap:wrap;} .newsList .li{max-width: unset; flex: 1 1 46%; padding: 0; margin-bottom: 0;} .newsArea .top a{flex-wrap: wrap;} .newsArea .top .pic{ max-width: unset; flex: 1 1 100%;} .newsArea .top .con{max-width: unset; flex: 1 1 100%;} .responsibility-page .row{margin: 60px 0 -30px; gap: 60px; flex-wrap: wrap; justify-content: space-between;} .responsibility-page .col-lg-3{padding: 0; flex: 0 0 46%; margin-bottom: 0;} .responsibility-page .col-lg-6{padding: 0; flex: 0 0 46%; margin-bottom: 0;} .aboutPage .leader{margin: 60px 0 0; flex-wrap: wrap; gap: 60px;} .aboutPage .leader .pic::before{display: none;} .aboutPage .leader .pic{flex: 0 0 100%;} .aboutPage .leader .pic img{max-width: 100%;} .aboutPage .leader .con{flex: 0 0 100%;} .AIpage .intro{width: 100%;} .temFlex .col-2{flex: 1 1 50%; width: unset;} .temFlex .col-3{flex: 1 1 50%; width: unset;} .temFlex .col-4{flex: 1 1 50%; width: unset;} .temFlex .col-6{flex: 1 1 100%; width: unset;} .temFlex .col-8{flex: 1 1 100%; width: unset;} .cloudBanner .text{width: 100%;} .fullpic .list{flex-wrap: wrap; padding: 40px 20px; margin-bottom: 20px; justify-content: center;} .fullpic .img img{max-width: 100%;} .conPicFlex .list .con{padding: 0;} .cloudBg .intro p{width: 100%;} .cloudBanner .img{max-width: 100%;} .cloudBanner .img img{max-width: 100%;} .CloudTem .intro{width: 100%;} .CloudTem .intro{width: 100%;} .conPicFlex .list{flex-wrap: wrap; padding: 60px 20px;} .conPicFlex .list .pic{flex: 1 1 100%; margin-bottom: 60px; justify-content: center; display: flex;} .conPicFlex .list .pic img {max-width: 100%;} .conPicFlex .list:nth-child(odd){flex-direction: row;} .flexBanner{padding: 60px 0;} .flexBanner .con{transform: none;} .flexBanner .con .ti{text-align: center;} .flexBanner .flex{flex-wrap: wrap; justify-content: center; gap: 40px;} .flexBanner .lia{flex: 1 1 100%;} .flexBanner .lib{flex: 1 1 100%; justify-content: center; display: flex;} .flexBanner .lib img {max-width: 100%;} .temFlex.logoWall .col-2{flex: 1 1 33.33333%;} .onePicli{width: 100%;} .schoolJob .job-area{gap: 40px;} .schoolJob .nav{gap: 20px;} .schoolJob .nav .nav-item{flex: 1 1 auto;} .schoolJob .nav .nav-link{margin: 0; width: 100%;} .schoolJob .job-area .nav-link{padding: 10px; line-height: 2em; text-align: center;} .schoolJob .job-area .nav-link img{display: table; margin: 0 auto;} .schoolJob .job-area .col-3{flex: 1 1 20%; max-width: unset;} .societyJob .job-list{padding: 40px;} .commerce-page .process{flex-wrap: wrap; gap: 0px;} .commerce-page .process .icon{width: 80px; height: 80px; line-height: 80px;} .commerce-page .process .icon img{width: 48px;} .commerce-page .process .list{flex: 1 1 20%; max-width: unset;} .commerce-page .process .list::before{ width: 16px; line-height: 16px;} .commerce-page .process .list::after{display: none;} .tableTips{display: none;} .schoolJob .one-pic img{max-width: 100%;} .schoolJob .quesiton-area{width: 100%;} .impressionPage>.nav{gap: 20px; padding: 0 10px;} .impressionPage>.nav .nav-item{margin: 0; flex: 1 1 20%;} .impressionPage>.nav .nav-link{margin: 0; padding: .8em .5em; width: 100%;} .centerPic {padding: 0 20px;} .centerPic img{ max-width: 100%;} .impressionPage .train-pic{margin: 60px 0 0;} .societyJobArea{flex-wrap: wrap;} .societyJobArea .leftMenu{flex: 1 1 100%;} .societyJob .job-detail{padding: 30px; margin-bottom: 120px;} .societyJob .job-detail .job-title{font-size: 24px;} .societyJob .job-detail .apply{position: static; margin: 30px auto 15px; display: table; font-size: 16px;} .platFunction{transform: scale(.8);} .SDPlatform .platFunction .con p{width: 150px;} .SDPlatform .nav{gap: 20px;} .SDPlatform .nav .nav-item{flex: 1 1 46%;} .SDPlatform .nav .nav-link{width: 100%;} .SDPlatform .tab-pane .topCon{width: 100%;} .SDPlatform .tab-pane .content .col-lg-3{flex: 1 1 50%;} .SDPlatform .tab-pane .topCon p{flex: 1 1 50%;} .SDPlatform .tab-pane .topCon .pic{flex: 1 1 50%;} .SDPlatform .tab-pane .pic img{max-width: 100%;} .aboutMenu .menu a{font-size: 14px; padding: 0 12px;} .aboutMenu.dropMenu .li .drop a{font-size: 12px;} .SmartEnergy .SmartEnergyPD .box .menu a{font-size: 12px;} .temFlex .col-2.colFive{flex: 1 1 50% ;} .work-story .box{flex-wrap: wrap;} .work-story .font-blue{width: 100%;} .width1000{width: 100%;} .width1200{width: 100%;} .imagesFlex{gap: 30px;} .imagesFlex .nav .nav-link img{height: 10vw;} .flexAccordion .li .box .img{height: 40vw;} .impressionPage .flexAccordionD{width: 100%;} .impressionPage .flexAccordionE{width: 100%;} .flexAccordion .li .box .ti{text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;} .Avant-garde .con{padding: 20px 50px;} } @media screen and (min-width: 1024px) and (max-width: 1366px) { .header{padding: 0 15px;} .header>.logo{width: 100px;} .header>.menu>li{padding: 0 10px;} .header>.menu>li>a{font-size: 10px;} .header .searchBox .lang span{font-size: 12px;} .header .searchBox input{max-width: 100%; width: 140px;} .header .menu .submenu.aboutSub{width: 85vw; padding: 60px 80px; justify-content: space-between;} .header>.menu>li:hover .submenu{transform: translate(-10%,0); padding: 40px;} .header .menu .submenu.aboutSub a{font-size: 14px;} .header .menu .submenu.groupSub{width: 80vw;transform: translate(-20%,0)!important;} .header .menu .submenu.aboutSub.short{width: 80vw;transform: translate(-30%,0)!important;} .header .menu .submenu.normalMenu{transform: translate(-50%,0)!important; width: 60vw;} .header .menu .submenu.normalMenu.Join{transform: translate(30%,0)!important;} .header .menu .submenu.normalMenu.Join .menuList li{flex: 0 0 100%;} .header .menu .submenu.aboutSub .ygzb{width: unset;} .header .menu .submenu.aboutSub .ygzb img{width: 260px;} .header .menu .submenu .ti{font-size: 20px;} .header .menu .submenu.groupSub .menuList a{font-size: 14px;} .header .menu .submenu.groupSub .cloudMenu li{flex: 0 0 25%;} .header .menu .submenu.groupSub .SDmenu a{font-size: 14px;} .header .menu .submenu.groupSub .SDmenu a.ti{font-size: 20px; color: #000;} .header .menu .submenu.groupSub .cloudMenu a{font-size: 14px;} .header .menu .submenu.normalMenu .menuList a{font-size: 14px;} .container{width: 100%; padding: 0 50px; max-width: 100%;} .index-about .template-ti{font-size: 54px;} .index-about .template-sti{font-size: 24px;} .mainbox{padding: 80px 0;} .index-Recommend .container{width: 100%;} .index-Recommend .row{margin: 80px -20px 0;} .index-Recommend .col-lg-6{flex: 0 0 50%; padding: 0 20px;} .index-Recommend .con{padding: 40px;} .index-Recommend .box{height: 100%; background: #fff; border-radius: 20px; overflow: hidden;} .index-Recommend .con h5{font-size: 24px;} .ZTPD{ grid-column-gap: 20px; grid-row-gap: 20px} .ZTPD .more .bt{padding: 5px;} .index-products .nav-pills{margin-right: 50px !important;} .index-products .nav-pills .nav-link{width: 160px; gap: 10px; height: 72px;} .index-products .nav-pills .nav-link.active{width: 200px;} .index-products .nav-pills .nav-link p{font-size: 20px;} .index-products .nav-pills .nav-link img{width: 30px;} .index-products .con h5{font-size: 48px;} .index-products .pdtext h6{font-size: 24px;} .index-news .container{width: 100%; max-width: 100%;} .index-news .content{flex-wrap: nowrap; gap: 40px;} .index-news .left{flex: 0 0 75%; width: unset;} .index-news .right{flex: 0 0 25%; width: unset;} .customers .logoArea .li{flex: 0 0 12.5%; max-width: unset;} .index-news .left .con{flex: 1 1 50%; max-width: unset;} .index-news .right .list a{padding: 15px 0;} .index-news .right .list .title{font-size: 18px; padding-right: .5em;} .footer .container{width: 100%;} .aboutPage .video{width: 100%;} .aboutPage .intro{width: 100%;} .contactsBri{margin: 0;} .contactsBri .col-lg-4{padding: 0 30px;} .coArea img{max-width: 100%;} .CulturePage #culturePoster .box{padding-right: 0;} .CulturePage #culturePoster .box .con .ti{font-size: 22px;} .CulturePage #culturePoster .box .con .text{font-size: 16px;} .CulturePage #culturePoster .swiper-slide:nth-child(1) .box .con{right: 50px; top: 50%; transform: translateY(-50%);} .CulturePage #culturePoster .swiper-slide:nth-child(2) .box .con{left: 50px; top: 50%; transform: translateY(-50%);} .CulturePage #culturePoster .swiper-slide:nth-child(3) .box .con{right: 50px; top: 50%; transform: translateY(-50%);} .CulturePage #culturePoster .swiper-slide:nth-child(4) .box .con{bottom: 20%; transform: translateY(20%);} /* .CulturePage #culturePoster .box img{max-height: 50vw;} */ .swiperPhotos{max-width: 100%;} .cultrueWechat .page{margin: 0 0 0 -30px;} .cultrueWechat .page{padding-right: 20px;} .customer-page .nav{gap: 20px;} .customer-page .nav .nav-item{flex: 1 1 auto;} .customer-page .nav .nav-link{margin: 0; width: 100%;} .customers .logoArea .li{flex: 0 0 12.5%;} .customers .logoArea .name{font-size: 13px;} .historyPage .container{width: 100%; max-width: 100%;} .investor .form .ul{flex: 1 1 50%; max-width: unset;} .investor .shares{margin: 60px 0 0px;} .investor .record-sheet .col-xl-4{flex: 0 0 50%;} .investorInpage .Inpage-area .left-area{flex: 1 1 100%; } .newsArea .top .con{padding: 30px 30px 60px;} .aboutMenu .menu a{font-size: 14px; padding: 0 15px;} .responsibility-page .row{margin: 60px -20px -40px;} .responsibility-page .col-lg-3{padding: 0 20px;} .aboutPage .leader{margin: 60px 0 0; flex-wrap: nowrap; gap: 50px;} .aboutPage .leader .pic::before{display: none;} .aboutPage .leader .pic{flex: 0 0 48%;} .aboutPage .leader .pic img{max-width: 100%;} .aboutPage .leader .con{flex: 0 0 48%; padding: 0;} .commerce-page .process .icon{width: 120px; height: 120px; line-height: 120px;} .commerce-page .process .icon img{width: 60px;} .commerce-page .process .list{flex: 1 1 20%; max-width: unset;} .commerce-page .process .list::before{ width: 20px; line-height: 20px;} .commerce-page .process .list::after{width: 40px;} .flexBanner{padding: 60px;} .flexBanner .flex{gap: 40px;} .flexBanner .lia{flex: 1 1 50%;} .flexBanner .lib{flex: 1 1 50%;} .flexBanner .lib img{max-width: 100%;} .cloudBanner .text{width: 100%;} .temFlex.normalCard .col-3{width: unset; flex: 1 1 25%;} .temFlex .col-2{flex: 0 0 33.3333%;} .onePicli{width: 100%;} .schoolJob .job-area{gap: 40px;} .schoolJob .nav{gap: 20px;} .schoolJob .nav .nav-item{flex: 1 1 auto;} .schoolJob .nav .nav-link{margin: 0; width: 100%;} .schoolJob .job-area .nav-link{padding: 10px; line-height: 2em; text-align: center;} .schoolJob .job-area .col-3{flex: 1 1 20%; max-width: unset;} .societyJob .job-list{padding: 40px;} .schoolJob .quesiton-area{width: 100%;} .schoolJob .one-pic img{max-width: 100%;} .commerce-page .process .icon::after{display: none;} .commerce-page .process .icon::before{ right: 0;transform: translate(150%,-40%);} img{max-width: 100%;} .imagesFlex{gap: 40px;} .impressionPage .flexAccordion{width: 100%;} .imagesFlex .nav .nav-link img{height: 10vw;} .SDPlatform .platFunction .con p{width: 180px;} .AIpage .intro{width: 100%;} .SDPlatform .tab-pane .topCon{width: 100%;} .SDPlatform .tab-pane .topCon p{flex: 1 1 60%;} .temFlex .col-2.colFive{flex: 1 1 50%;} .temFlex.normalCard .col-3{flex: 1 1 50%;} .temFlex.margin60{margin: unset -20px;} .temFlex.margin60 .col-4{padding: 0 20px;} .SmartEnergy .SmartEnergyPD .box{padding: 20px;} .SmartEnergy .SmartEnergyPD .box .menu a{font-size: 12px;} .index-products{padding-bottom: 0;} .normalPic .img.phonePic img{transform: scale(0.8);} .Avant-garde .con{padding: 20px 50px;} } @media screen and (min-width: 1367px) and (max-width: 1600px) { .header{padding: 0 15px;} .header>.menu>li{padding: 0 12px;} .header>.menu>li>a{font-size: 15px;} .header .searchBox input{max-width: 100%; width: 200px;} .header .menu .submenu.aboutSub{width: 85vw; padding: 80px 100px; justify-content: space-between;} .header>.menu>li:hover .submenu{transform: translate(-10%,0);} .header .menu .submenu.groupSub{width: 80vw;transform: translate(-20%,0)!important;} .header .menu .submenu.aboutSub.short{width: 80vw;transform: translate(-30%,0)!important;} .header .menu .submenu.normalMenu{transform: translate(-40%,0)!important;} .header .menu .submenu.normalMenu.Join{transform: translate(40%,0)!important;} .container{width: 100%; padding: 0 50px; max-width: 100%;} .index-about .template-ti{font-size: 54px;} .index-about .template-sti{font-size: 24px;} .mainbox{padding: 80px 0;} .index-Recommend .container{width: 100%;} .index-Recommend .row{margin: 80px -20px 0;} .index-Recommend .col-lg-6{flex: 0 0 50%; padding: 0 20px;} .index-Recommend .con{padding: 40px;} .index-Recommend .box{height: 100%; background: #fff; border-radius: 20px; overflow: hidden;} .index-Recommend .con h5{font-size: 24px;} .ZTPD{ grid-column-gap: 20px; grid-row-gap: 20px} .ZTPD .more .bt{padding: 5px;} .index-products .nav-pills{margin-right: 50px !important;} .index-products .nav-pills .nav-link{width: 200px; gap: 10px; height: 72px;} .index-products .nav-pills .nav-link.active{width: 240px;} .index-products .nav-pills .nav-link p{font-size: 20px;} .index-products .nav-pills .nav-link img{width: 30px;} .index-products .con h5{font-size: 48px;} .index-products .pdtext h6{font-size: 24px;} .index-products{padding-bottom: 0;} .index-news .container{width: 100%; max-width: 100%;} .index-news .content{flex-wrap: nowrap; gap: 40px;} .index-news .left{flex: 0 0 75%; width: unset;} .index-news .right{flex: 0 0 25%; width: unset;} .customers .logoArea .li{flex: 0 0 12.5%; max-width: unset;} .index-news .left .con{flex: 1 1 50%; max-width: unset;} .index-news .right .list a{padding: 10px 0;} .index-news .right .list .title{font-size: 18px; padding-right: .5em;} .footer .container{width: 100%;} .aboutPage .video{width: 100%;} .aboutPage .intro{width: 100%;} .contactsBri{margin: 0;} .contactsBri .col-lg-4{padding: 0 30px;} .coArea img{max-width: 100%;} .CulturePage #culturePoster .box{padding-right: 0;} .CulturePage #culturePoster .box .con .ti{font-size: 24px;} .CulturePage #culturePoster .box .con .text{font-size: 18px;} /* .CulturePage #culturePoster .box img{max-height: 50vw;} */ .swiperPhotos{max-width: 100%;} .cultrueWechat .page{margin: 0 0 0 -30px;} .cultrueWechat .page{padding-right: 20px;} .customer-page .nav{gap: 20px;} .customer-page .nav .nav-item{flex: 1 1 auto;} .customer-page .nav .nav-link{margin: 0; width: 100%;} .customers .logoArea .li{flex: 0 0 12.5%;} .CulturePage #culturePoster .swiper-pagination{right: 100px;} .historyPage .container{width: 100%; max-width: 100%;} .investor .form .ul{flex: 1 1 33.3333%; max-width: unset;} .investor .shares{margin: 60px 0 0px;} .investor .record-sheet .col-xl-4{flex: 0 0 50%;} .investorInpage .Inpage-area .left-area{flex: 1 1 100%; } .newsArea .top .con{padding: 30px 30px 60px;} .aboutMenu .menu a{font-size: 14px; padding: 0 15px;} .responsibility-page .row{margin: 60px -20px -40px;} .responsibility-page .col-lg-3{padding: 0 20px;} .aboutPage .leader{margin: 60px 0 0; flex-wrap: nowrap; gap: 50px;} .aboutPage .leader .pic::before{display: none;} .aboutPage .leader .pic{flex: 0 0 48%;} .aboutPage .leader .pic img{max-width: 100%;} .aboutPage .leader .con{flex: 0 0 48%; padding: 0;} .flexBanner{padding: 60px;} .flexBanner .flex{gap: 40px;} .flexBanner .lia{flex: 1 1 50%;} .flexBanner .lib{flex: 1 1 50%;} .flexBanner .lib img{max-width: 100%;} .cloudBanner .text{width: 100%;} .temFlex.normalCard .col-3{width: unset; flex: 1 1 25%;} .onePicli{width: 100%;} .schoolJob .job-area{gap: 40px;} .schoolJob .nav{gap: 20px;} .schoolJob .nav .nav-item{flex: 1 1 auto;} .schoolJob .nav .nav-link{margin: 0; width: 100%;} .schoolJob .job-area .nav-link{padding: 10px; line-height: 2em; text-align: center;} .schoolJob .job-area .col-3{flex: 1 1 20%; max-width: unset;} .societyJob .job-list{padding: 40px;} .schoolJob .quesiton-area{width: 100%;} .schoolJob .one-pic img{max-width: 100%;} .commerce-page .process .icon::after{display: none;} .commerce-page .process .icon::before{ right: 0;transform: translate(200%,-40%);} img{max-width: 100%;} .imagesFlex{gap: 40px;} .impressionPage .flexAccordion{width: 100%;} .imagesFlex .nav .nav-link img{height: 10vw;} .SDPlatform .platFunction .con p{width: 180px;} .AIpage .intro{width: 100%;} .SDPlatform .tab-pane .topCon{width: 100%;} .SDPlatform .tab-pane .topCon p{flex: 1 1 60%;} .temFlex .col-2.colFive{flex: 1 1 25%;} .temFlex.normalCard .col-3{flex: 1 1 25%;} .Avant-garde .con{padding: 20px 50px;} } @media screen and (min-width: 1240px) and (max-width: 1366px) { .header .searchBox input{width: 200px;} .index-products{padding-bottom: 0;} } @media screen and (min-width: 1600px) and (max-width: 1740px) { .header>.menu>li{padding: 0 15px;} .header>.menu>li>a{font-size: 16px;} .container{width: 100%; max-width: 100%; padding: 0 60px;} .index-news .container{width: 100%; max-width: 100%;} .index-news .right .list a{padding: 10px 0;} .imagesFlex .nav .nav-link img{height: 8vw;} .SDPlatform .platFunction .con p{width: 240px;} .temFlex .col-2.colFive{flex: 1 1 20%;} .index-products{padding-bottom: 0;} } @media screen and (min-width: 1024px) and (max-width: 1240px) { .impressionPage .train-pic .col-4{flex: 0 0 50%;} } /* ---------------------首页动画 ---------------------*/ @media screen and (min-width: 1024px) { .header .logo{transform: translateX(-30%); opacity: 0; transition: all 1s;} .header .searchBox{transform: translateX(30%); opacity: 0; transition: all 1s;} .header .menu{ opacity: 0; transition: all .5s;} .header.animate .logo{transform: translateX(0); opacity: 1;} .header.animate .searchBox{transform: translateX(0); opacity: 1;} .header.animate .menu{ opacity: 1;} .header .subMask{display: none;} .header .subMenuBg{display: none;} } .index-about .template-ti{transform: translateY(-30vh); opacity: 0; transition: all 1s;} .index-about .template-ti.active{transform: translateY(0); opacity: 1;} .index-about .template-sti{position: relative;} .index-about .template-sti::after{content: ''; width: 100%; height: 100%; position: absolute; right: 0; top: 0; background: #fff; transition: all 1.5s; transition-delay: .2s;} .index-about .template-sti.active::after{width: 0;} .index-about .tem-more{transform: translateY(30px); opacity: 0; transition: all 1s; } .index-about .tem-more.active{transform: translateY(0); opacity: 1;} .index-Recommend .template-ti{transform: translateY(30px); opacity: 0; transition: all 1s;} .index-Recommend .template-ti.borderBottom::after{width: 0; transition: all 1s; transition-delay: .5s;} .index-Recommend .template-ti.active{transform: translateY(0); opacity: 1;} .index-Recommend .template-ti.active::after{width: 100px;} .index-Recommend .row .col-12{transform: translateY(30%); opacity: 0; transition: all 1s;} .index-Recommend .row .col-12:nth-child(2){transition-delay: .2s;} .index-Recommend .row.active .col-12{transform: translateY(0); opacity: 1; } .ZTPD .boxA,.ZTPD .boxB,.ZTPD .boxC,.ZTPD .boxD,.ZTPD .boxE{transform: translateY(30%); opacity: 0; transition: all 1s;} .ZTPD.active .boxA{transform: translateY(0); opacity: 1; transition-delay: .3s;} .ZTPD.active .boxB{transform: translateY(0); opacity: 1; transition-delay: .6s;} .ZTPD.active .boxC{transform: translateY(0); opacity: 1; transition-delay: .9s;} .ZTPD.active .boxD{transform: translateY(0); opacity: 1; transition-delay: 1.2s;} .ZTPD.active .boxE{transform: translateY(0); opacity: 1; transition-delay: 1.5s;} .index-products .template-ti{transform: translateY(30px); opacity: 0; transition: all 1s;} .index-products .template-ti.borderBottom::after{width: 0; transition: all 1s; transition-delay: .5s;} .index-products .content .bg{transform: translateY(30%); opacity: 0; transition: all .5s;} .index-products .content .nav-pills{transform: translateX(-30%); opacity: 0; transition: .5s; transition-delay: .5s;} .index-products .content .text{transform: translateX(-30%); opacity: 0; transition: .5s; transition-delay: 1s;} .index-products .template-ti.active{transform: translateY(0); opacity: 1;} .index-products .template-ti.active::after{width: 100px;} .index-products .content.active .bg{transform: translateY(0); opacity: 1;} .index-products .content.active .nav-pills{transform: translateX(0); opacity: 1; } .index-products .content.active .text{transform: translateX(0); opacity: 1; } .index-news .template-ti{transform: translateY(30px); opacity: 0; transition: all 1s;} .index-news .template-ti.borderBottom::after{width: 0; transition: all 1s; transition-delay: .5s;} .index-news .content .left{transform: translateX(-30%); opacity: 0; transition: all 1s;} .index-news .content .right{transform: translateX(30%); opacity: 0; transition: all 1s;} .index-news .template-ti.active{transform: translateY(0); opacity: 1;} .index-news .template-ti.active::after{width: 100px;} .index-news .content.active .left{transform: translateY(0); opacity: 1;} .index-news .content.active .right{transform: translateY(0); opacity: 1;} .customers.index .template-ti{transform: translateY(30px); opacity: 0; transition: all 1s;} .customers.index .template-ti.borderBottom::after{width: 0; transition: all 1s; transition-delay: .5s;} .customers.index{transform: translateY(50px); opacity: 0; transition: all 1s;} .customers.index .logoArea .li{transform: translateY(30%); opacity: 0; transition: all .5s;} .customers.index .template-ti.active{transform: translateY(0); opacity: 1;} .customers.index .template-ti.active::after{width: 100px;} .customers.index.active{transform: translateY(0); opacity: 1;} .customers.index .logoArea.active .li{transform: translateY(0); opacity: 1;} .customers.index .logoArea.active .li:nth-child(2){transition-delay: .1s;} .customers.index .logoArea.active .li:nth-child(3){transition-delay: .2s;} .customers.index .logoArea.active .li:nth-child(4){transition-delay: .3s;} .customers.index .logoArea.active .li:nth-child(5){transition-delay: .4s;} .customers.index .logoArea.active .li:nth-child(6){transition-delay: .5s;} .customers.index .logoArea.active .li:nth-child(7){transition-delay: .6s;} .customers.index .logoArea.active .li:nth-child(8){transition-delay: .7s;} .customers.index .logoArea.active .li:nth-child(9){transition-delay: .8s;} .customers.index .logoArea.active .li:nth-child(10){transition-delay: .9s;} .customers.index .logoArea.active .li:nth-child(11){transition-delay: 1s;} .customers.index .logoArea.active .li:nth-child(12){transition-delay: 1.1s;} .customers.index .logoArea.active .li:nth-child(13){transition-delay: 1.2s;} .customers.index .logoArea.active .li:nth-child(14){transition-delay: 1.3s;} .customers.index .logoArea.active .li:nth-child(15){transition-delay: 1.4s;} .customers.index .logoArea.active .li:nth-child(16){transition-delay: 1.5s;} .customers.index .logoArea.active .li:nth-child(17){transition-delay: 1.6s;} .customers.index .logoArea.active .li:nth-child(18){transition-delay: 1.7s;} .customers.index .logoArea.active .li:nth-child(19){transition-delay: 1.8s;} .customers.index .logoArea.active .li:nth-child(20){transition-delay: 1.9s;} .customers.index .logoArea.active .li:nth-child(21){transition-delay: 2s;} .customers.index .logoArea.active .li:nth-child(22){transition-delay: 2.1s;} .customers.index .logoArea.active .li:nth-child(23){transition-delay: 2.2s;} .customers.index .logoArea.active .li:nth-child(24){transition-delay: 2.3s;} #SearchCustomPage li a{cursor: pointer;}} /* ---------------------动画库 ---------------------*/ /* 上下浮动 */ @keyframes floatUD { 0%,100%{ transform: translateY(0); } 25%{ transform: translateY(-8px); } 50%{ transform: translateY(0); } 75%{ transform: translateY(8px); } } @keyframes floatUD2 { 0%,50%,100%{ transform: translateY(0); } 25%{ transform: translateY(-3px); } 75%{ transform: translateY(3px); } } @keyframes floatUD3 { 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(8%); } } .embed-icon{display:none;} .dwn-container { padding-top: 20px; display: flex; } .dwn { border: 1px solid #888888; border-radius: 40px; padding-left: 25px; padding-right: 25px; padding-top: 7px; padding-bottom: 7px; font-size: 1vw; margin-bottom: 8px; color: white; margin-right: 20px; } .dwn:hover { color: orange; cursor: pointer; border: 1px solid orange; }