*{ box-sizing: border-box; } body{ margin: 0; } /* ----------------------------导航栏----------------------------- */ .swiper_banner{ position: relative; width: 100%; padding-bottom: 700px; } @media (max-width: 1420px){ .swiper_banner{ padding-bottom: 600px; } } .swiper_banner .swiper-container{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .swiper_banner .pagination{ position: absolute; z-index: 9; left: 0; text-align: center; bottom: 20px; width: 100%; } .swiper_banner .pagination .swiper-pagination-switch{ display: inline-block; width: 10px; height: 10px; border-radius: 10px; background: #fff; opacity: 0.5; margin: 0 6px; cursor: pointer; transition: 0.5s; -webkit-transition: 0.5s; } .swiper_banner .pagination .swiper-active-switch{ width: 50px; opacity: 1; } .swiper_banner .swiper-slide .swiper_box{ position: relative; height: 100%; } .swiper_banner .swiper-slide .swiper_box .text{ position: absolute; top: 35%; right: 0; text-align: right; opacity: 0; transition: all 1.5s; } .swiper_banner .swiper-slide .swiper_box .text .cn{ font-size: 48px; font-weight: bold; color: #fff; line-height: 70px; letter-spacing: 6px; text-shadow: 5px 5px 5px rgba(0,0,0,0.1); } .swiper_banner .swiper-slide .swiper_box .text .txt{ font-size: 36px; color: #fff; text-shadow: 5px 5px 5px rgba(0,0,0,0.1); } .swiper_banner .swiper-slide img{ height: 100%; } .swiper_banner .swiper-slide-active .swiper_box .text{ opacity: 1; right: 8%; } nav{ width:100%; margin: 0 auto; text-align: center; } nav>div{ display: inline-block; vertical-align: middle; } .navImg>img{ width: 100%; } .navImg{ /* margin-right:8%; */ width: 20%; } .title{ margin: 0 7%; width: 45%; display: inline-block; } .title>li{ display: inline-block; padding-top: 4.5%; margin-right:6%; position: relative; padding-bottom: 30px; } .title>li>a{ font-size: 18px; color: #333333; font-weight: 500; } .title>.active{ border-top: 6px solid #2958a6; } .title>.active>a{ color: #2958a6; } .title>li:hover{ border-top: 6px solid #2958a6; } .title>li:hover>a{ color: #2958a6; } .title>li>a:nth-last-of-type(1){ margin-right: 0; } .title>li>.pull{ position: absolute; top: 85px; left: 0; background: #fff; font-size: 16px; border-bottom: 3px solid #2958a6; z-index: 100; width: 250px; display: none; } .title>li:hover>.pull{ display: block; } /* .title>li>.pull>a:nth-of-type(1){ border-top: 1px solid #e5e5e5; } */ .title>li>.pull>a{ display: block; border-bottom: 1px solid #e5e5e5; color: #666; line-height: 50px; padding-left: 30px; text-align: left; } .title>li>.pull>a:hover{ color: #2958a6; } .navSearch{ position: relative; } .navSearch>div{ position: absolute; top: -28px; left: 75px; font-size: 14px; } .navSearch>div>a{ display: inline-block; height: 10px; line-height: 10px; padding-right: 5px; color: #333; border-right: 1px solid #cccccc; } .navSearch>div>a:last-of-type{ border-right: none; } .navSearch>div>a:hover{ color: #2958a6; } .navSearch>input{ display: block; border-radius: 20px; border: 1px solid #999999; padding: 6px 18px; } .navSearch>a>img{ position: absolute; top: 2px; right:9px; } @media screen and (max-width:1763px){ .title>li>a{ font-size: 17px; } .title{ margin: 0 7%; padding: 0; } .footerTitle .footer1>.div2 .div2 span{ top: 102px!important; left: 231px!important; } } @media screen and (max-width:1700px){ .homeFooter .homeFootertop>ul:nth-of-type(2)>li:nth-of-type(n+2)>a{ } } @media screen and (max-width:1681px){ .title>li{ margin-right: 5%!important; } } @media screen and (max-width:1668px){ .title>li{ margin-right: 4%!important; } } @media screen and (max-width:1675px){ .title>li>a{ font-size: 16px!important; } .homeFooter .homeFootertop>ul:nth-last-of-type(1)>img{ right:5%!important; } } @media screen and (max-width:1512px){ .homeFooter .homeFootertop{ padding: 0 8%; } .footerTitle .footer1>div:nth-of-type(2)>div:nth-of-type(2)>span{ top: 94px!important; left: 205px!important; } } @media screen and (max-width:1415px){ .title>li>a{ font-size: 16px; } .homeFooter .homeFootertop>ul:nth-of-type(2)>li:nth-of-type(n+2)>a{ } .homeFooter .homeFootertop>ul:nth-last-of-type(1)>img{ right: 5%!important; } } @media screen and (max-width:1280px){ .title{ width: 48%; margin: 0 5%; } .title>li{ margin-right: 4%; } .title>li>a{ font-size: 16px; } .title>li>a{ padding-top: 3.5%; } .homeFooter .homeFootertop>ul:nth-of-type(2)>li:nth-of-type(n+2)>a{ } .homeFooter .homeFootertop>ul:nth-last-of-type(1)>img{ right: -4%!important; } .homeFooter .homeFootertop{ padding: 0px 6%!important; } .footerTitle .footer1>.div2 .div1{ overflow: hidden; } .footerTitle .footer1>div:nth-of-type(2)>div:nth-of-type(2)>a>span{ top: 86px!important; } .footerTitle .footer1>div:nth-of-type(2)>div:nth-of-type(2)>span{ top: 77px!important; left: 126px!important; } } /*------------------- 首页 -----------------*/ .productCenter{ width: 100%; background: url('../img/homeblackground.jpg') no-repeat; background-size: cover; opacity: 1; transform: translate(0); padding-bottom: 60px; } .productCenterTitle{ padding-top: 120px; text-align: center; opacity: 1; transform: translateY(80px); -webkit-transform: translateY(80px); transition: all 1.5s; } .productCenterTitle>span{ display: inline-block; width: 8%; border: 3px solid #fff; vertical-align: middle; } .productCenterTitle>h1{ display: inline-block; font-size: 34px; color: #fff; margin: auto 120px; } .productCenterTitle>p{ font-size: 18px; line-height: 28px; color: #cccccc; } .productCenter>.productUl{ text-align: center; margin: 30px auto; opacity: 1; transform: translateY(80px); -webkit-transform: translateY(80px); transition: all 1.5s; } .productCenter>.productUl>li{ display: inline-block; font-size: 18px; color: #cccccc; margin-right: 100px; } .productCenter>.productUl>.active{ color: #fff; border-bottom: 1px solid #fff; cursor: pointer; } .productCenter>.productUl>li:hover{ color: #fff; border-bottom: 1px solid #fff; cursor: pointer; } .productCenter>ul>li:nth-last-of-type(1){ margin-right: 0; } .productBanner{ position: relative; max-height: 525px; } .productBanner>.swiper-container { width: 72%; } .productBanner .swiper-wrapper{ height: auto !important; } .productBanner .swiper-slide { background: #fff; padding: 0 20px; box-sizing: border-box; height: auto !important; background: none; } .productBanner .swiper-slide>a{ display: block; background: #fff; padding: 20px; } .productBanner .swiper-slide>a i{ display: inline-block; width: 100%; padding-bottom: 60%; overflow: hidden; position: relative; margin: 30px 0; } .productBanner .swiper-slide>a img{ position: absolute; width: auto; height: auto; max-width: 100%; max-height: 100%; top: 50%; left: 50%; transform: translate(-50%,-50%); } .productBanner .swiper-slide>a>p:nth-of-type(1){ color: #333333; font-size: 20px; margin-bottom: 10px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .productBanner .swiper-slide>a>p:nth-of-type(2){ border-top: 1px solid #cccccc; font-size: 16px; color: #666666; padding-top: 8px; height: 72px; overflow: hidden; } .productBanner .swiper-button-next{ width: 70px; height: 100px; background-image:url("../img/jiantouyou.jpg"); background-size: 100% 100%; position: absolute; top: 120px; right: 80px; } .productBanner .swiper-button-prev{ width: 70px; height: 100px; background-image:url("../img/jiantouzuo.jpg"); background-size: 100% 100%; position: absolute; top: 120px; left: 80px; } .productCenter .button{ text-align: center; margin: 60px auto 0; color:#fff; font-size: 20px; transform: translateY(0); opacity: 1; } .productCenter .button>a>button{ border: 1px solid #fff; padding:0 30px; background-color:#757a79; border-radius:10px; word-spacing:8px; color:#fff; } .productCenter .button>a>button:hover{ background:#858585; color:#ffffff; border-radius:38px; box-shadow:0 3px 13px 0 rgba(0,0,0,0.1); font-size:20px; transition:all 0.5s; } /* 底部导航栏 */ .productFooter{ position: relative; padding: 0 100px 80px; line-height: 1; } .footerBanner { display: inline-block; width: 55%; margin: 0 auto; padding:0 60px; line-height: 10; } .footerBanner h2 { text-align: center; margin: 60px 0 30px; color: #2f56a3; font-size: 30px; } .footerBanner .Box_con { position: relative; } .footerBanner .Box_con .btnl { position: absolute; } .footerBanner .Box_con .btn { display: block; font-size: 40px; position: absolute; top: 80px; cursor: pointer; } .footerBanner .Box_con .btnl { color: #2958a6; left: -60px; top:-110px; } .footerBanner .Box_con .btnr { color: #2958a6; right: -40px; top: -105px; } .footerBanner .Box_con .btnl:hover { color: #333333; } .footerBanner .Box_con .btnr:hover { color: #333333; } .footerBanner .Box_con .conbox { position: relative; overflow: hidden; height: 278px; } .footerBanner .Box_con .conbox ul { position: relative; list-style: none; } .footerBanner .Box_con .conbox ul li { float: left; width: 200px; height: 278px; margin-left: 20px; overflow: hidden; } /* .footerBanner .Box_con .conbox ul li .active{ color: #315591!important; } */ .footerBanner .Box_con .conbox ul li:first-child { margin-left: 0; } .footerBanner .Box_con .conbox ul li i{ display: block; width: 100%; height: 70%; overflow: hidden; border-radius: 5px; } .footerBanner .Box_con .conbox ul li img { height: 100%; width: auto; transition: all 0.3s; } .footerBanner .Box_con .conbox ul li p{ text-align: center; font-size: 18px; margin-top: 40px; line-height: 20px; color: #666666; } .footerBanner .Box_con .conbox ul li:hover img { transform: scale(1.1); } .footerBanner .BoxSwitch { margin: 30px; text-align: center; } .footerBanner .BoxSwitch span { display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; width: 30px; height: 3px; background: #ccc; margin: 0 5px; cursor: pointer;} .footerBanner .BoxSwitch span.cur { background: red; } .footerBanner .conbox>div>a:nth-last-of-type(1){ margin-right: 0; } .footerBanner .button{ text-align: center; margin: 25px auto; line-height: 20px; } .footerBanner .button>a>button{ border: 1px solid #858585; padding: 6px 30px; color: #a9a9a9; background-color: #fff; border-radius: 8px; word-spacing: 8px; font-size:16px; } .footerBanner .button>a>button:hover{ background: #315591; color: #fff; font-size: 16px; border-radius: 38px; box-shadow: 0 3px 13px 0 rgba(0, 0, 0, 0.1); transition: all 0.5s; } .footerTitle{ display: inline-block; width: 35%; line-height: 2.4; margin-left: 80px; } .footerTitle>h2{ text-align: center; font-size: 30px; color: #2958a6; margin: 70px auto 30px; } .footerTitle .footer1{ margin-left: 35px; line-height: 1; border-bottom: 1px solid #999999; font-size: 0; padding-bottom: 30px; } .footerTitle .footer1>div{ display: inline-block; } .footerTitle .footer1>div.div1{ width: 30%; height: 100px; overflow: hidden; border-radius: 5px; } .footerTitle .footer1>div.div1>img{ width: auto; height: 100%; vertical-align: top; } .footerTitle .footer1>div.div2{ width: 70%; box-sizing: border-box; padding-left: 20px; position: relative; height: 100px; vertical-align: top; } .footerTitle .footer1>div.div2>.div1{ } .footerTitle .footer1>div.div2 h1{ font-size: 20px; color: #333333; margin: 0; line-height: 20px; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .footerTitle .footer1>div p{ color: #666666; font-size: 16px; line-height: 24px; height: 48px; overflow: hidden; margin-top: 10px; } .footerTitle .footer1>div.div2>div.div2>{ position: absolute; top: 0; right: 200px; } .footerTitle .footer1>div.div2 .div2>a>span{ position: absolute; top:111px; left: 0; font-size: 14px; } .footerTitle .footer1>div.div2 .div2{ position: absolute; bottom: 0; right: 0; font-size: 14px; } .footerTitle .footer2{ margin-left: 35px; } .footerTitle .footer2>ul{ margin-top: 15px; letter-spacing: 0.5px; } .footerTitle .footer2>ul>li>a{ line-height: 1.8; font-size: 14px; color: #666666; overflow: hidden; } .footerTitle .footer2>ul>li>a>img{ margin-right: 12px; } .footerTitle .footer2>ul>li>a>span{ font-size: 12px; float: right; color: #999999; } .footerTitle .footer3{ text-align: center; margin:70px auto 0; line-height: 20px; } .footerTitle .footer3>a>button{ border: 1px solid #858585; padding: 6px 30px; color: #999999; background-color: #fff; border-radius: 8px; word-spacing: 8px; font-size:16px; } .footerTitle .footer3>a>button:hover{ background: #315591; color: #fff; font-size: 16px; border-radius: 38px; box-shadow: 0 3px 13px 0 rgba(0, 0, 0, 0.1); transition: all 0.5s; } .homeFooter{ width: 100%; background: #315591; } .homeFooter .homeFootertop{ width: 100%; margin: 0 auto; padding: 0 10%; } .homeFooter .homeFootertop>ul{ display: inline-block; padding: 60px 0; width: 12%; vertical-align:top; color: #fff; } .homeFooter .homeFootertop>ul.last_ul{ width:37%; } .homeFooter .homeFootertop>ul li { padding-left: 20px; } .homeFooter .homeFootertop>ul .one_li{ border-right: 2px solid #fff; line-height: 1; padding-left: 20px; margin-bottom: 30px; } .homeFooter .homeFootertop>ul> .one_li a{ font-size: 16px; color: #fff; } .homeFooter .homeFootertop>ul>li a{ font-size: 14px; color: #b8c0d3; vertical-align:left; } .homeFooter .homeFootertop>.last_ul li{ padding-left: 8%; font-size: 14px; color: #b8c0d3; } .homeFooter .homeFootertop>.last_ul{ position: relative; } .homeFooter .homeFootertop>.last_ul>li.one_li{ font-size: 16px; color: #fff; line-height: 1; padding: 0 40px; border-right: none; text-align: start; padding-left: 45px; } .homeFooter .homeFootertop>.last_ul>li.one_li>img{ position: absolute; top: 35px; left: 138px; } .homeFooter .homeFootertop>ul.last_ul>img{ position: absolute; top: 220px; right:0; } .homeFooter .homeFooterbottom{ margin: 0 200px; text-align: center; color: #b8c0d3; font-size: 14px; padding: 20px 0 40px; border-top: 1px solid #6079a3; } /* **********************home结束********************************** */ /* **********************solution****************************** */ .nav-img .a{ opacity: 0; animation: move1 0.5s linear 0.5s forwards; -webkit-animation: move1 0.5s linear 0.5s forwards; } .nav-img .b{ opacity: 0; animation: move1 0.8s linear 0.8s forwards; -webkit-animation: move1 0.8s linear 0.8s forwards; } .nav-img .c{ opacity: 0; animation: move1 1s linear 1s forwards; -webkit-animation: move1 1s linear 1s forwards; } @keyframes move1 { from { opacity: 0; transform: translateY(50px); } to { opacity: 1; transform: translateY(0); } } @-webkit-keyframes move1 { from { opacity: 0; transform: translateY(50px); } to { opacity: 1; transform: translateY(0); } } .nav-img{ width: 100%; height: 400px; background-image: url('../img/solution_02.jpg'); background-repeat: no-repeat; background-size: 100% 100%; padding-left:390px; color: #fff; display:flex; display: -webkit-flex; justify-content:center; flex-direction: column; overflow: hidden; /* animation-name:fadeIn; animation-duration: 3s; animation-iteration-count: 1; animation-delay: 0s; transition: all 0.5s ease-in; */ } /* @keyframes fadeIn { 0% { transform:translateY(80); } 50% { transform:translateY(80); } 100% { transform:translateY(0); } } */ .nav-img>p.a{ color: #ffffff; font-size: 32px; font-weight: 600; letter-spacing:3px; } .nav-img>p.b{ color: #ffffff; font-size: 16px; letter-spacing:1px; } .nav-img>span{ margin-top: 10px; width: 3%; background: #fff; height: 6px; } .solutionMain{ width: 100%; background: #f5f5f5; padding: 0 auto; font-size: 0px; } .solutionMain .mainTop{ padding: 1% 0; width: 1200px; margin: 0 auto; } .solutionMain .mainTop>p{ color: #a7a7a7; font-size: 14px; padding: 80px auto; } .solutionMain .mainTop>p>a{ color: #a7a7a7; font-size: 14px; } .solutionMain .mainTop>p>a>span{ color: #315591; } .solutionMain .mainHead{ margin-bottom: 15px; width: 1200px; margin:10px auto; } .solutionMain .mainHead div{ display: inline-block; width: 32%; border: 1px solid #9f9f9f; padding:1px; margin: 0 7px; } .solutionMain .mainHead div i{ display: inline-block; overflow: hidden; } .solutionMain .mainHead div p{ display: inline-block; font-size: 18px; margin: 5px 0; color: #9f9f9f; vertical-align: top; } .solutionMain .mainHead div>.i1{ margin: 1.6% 1.5% 0 3%; width: 33px; height: 33px; } /* .solutionMain .mainHead div>i:nth-of-type(1)>img{ } */ .welcome .index_product .w1738 .content .right{ height: 478px; } .solutionMain .mainHead div>i.i2{ float: right; padding: 14px; } .solutionMain .mainHead .active_div{ background: #2b56a5; } .solutionMain .mainHead .active_div p{ color: #fff; } .solutionMain .mainHead .active_div i:nth-of-type(1) img:nth-of-type(1){ display: none!important; } .solutionMain .mainHead .active_div i:nth-of-type(1) img:nth-of-type(2){ display: block!important; } .solutionMain .mainHead .active_div i:nth-of-type(2) img:nth-of-type(1){ display: none!important; } .solutionMain .mainHead .active_div i:nth-of-type(2) img:nth-of-type(2){ display: block!important; } .solutionMain .mainHead div i img.img2{ display: none; } .solutionMain .mainHead div:hover{ background: #2b56a5; } .solutionMain .mainHead div:hover i img.img1{ display: none; } .solutionMain .mainHead div:hover i img.img2{ display: inline; } .solutionMain .mainHead div.active_div i img.img1 { display: none !important; } .solutionMain .mainHead div.active_div i img.img2 { display: inline !important; } /* 静态.mainPartZ */ /* .mainPart>a{ display: inline-block; } */ .mainPartZ>a>.zP>img{ position: absolute; /* left: 10px; */ bottom: 10px; transition: all 1s; } .mainT{ width: 1200px; margin: 0 auto; } .mainPartZ{ margin:15px 6px; border: 1px solid #cccccc; } .mainPart .mainPartZ{ width: 32.15%; display: inline-block; vertical-align: top; } .mainPartZ>a>.zImg{ overflow: hidden; height: 280px; } .mainPartZ>a>.zImg>img{ width: 100%; transition: 0.5s; -webkit-transition: 0.5s; } .mainPartZ>a>.zP{ padding: 15px; padding-bottom: 30px; background: #f5f5f5; border-top: 1px solid #cccccc; position: relative; } .mainPartZ>a>.zP>p:nth-of-type(1){ color: #333333; font-size: 18px; } .mainPartZ>a>.zP>p:nth-of-type(2){ color: #666666; font-size: 14px; line-height: 18px; } /* 动态样式 */ .active.mainPartZ>a>.zP{ background-color: #2b56a5; } .active.mainPartZ>a>.zP p{ color: white !important; } .active.mainPartZ>a>.zP>img{ position: absolute !important; bottom: 10px !important; transform: translateX(320px) } .active.mainPartZ>a>.zImg>img{ cursor: pointer; transform: scale(1.1); -webkit-transform: scale(1.1); } .mainPage{ text-align:center; padding:30px 0 60px 0; } .mainPage>a>h1{ width: 60px; height: 30px; background: #cccccc; color: #fff; font-size: 14px; display: inline-block; } .mainPage>a>.active{ background: #315591; } .mainPage>a>h1:hover{ background: #315591; } .mainPage>a>p{ width: 30px; height: 30px; margin: 0 5px; background: #cccccc; color: #fff; font-size: 14px; display: inline-block; } .mainPage>a>p:hover{ background: #315591; } /* ***********produce**************** */ .ProduceNav-img{ width: 100%; height: 400px; background-image: url('../img/producenav.jpg'); background-repeat: no-repeat; background-size: 100% 100%; padding-left: 390px; color: #fff; display:flex; display: -webkit-flex; justify-content:center; flex-direction: column; } .ProduceNav-img .a{ opacity: 0; animation: move1 0.5s linear 0.5s forwards; -webkit-animation: move1 0.5s linear 0.5s forwards; } .ProduceNav-img .b{ opacity: 0; animation: move1 0.8s linear 0.8s forwards; -webkit-animation: move1 0.8s linear 0.8s forwards; } .ProduceNav-img .c{ opacity: 0; animation: move1 1s linear 1s forwards; -webkit-animation: move1 1s linear 1s forwards; } .ProduceNav-img>p.a{ color: #ffffff; font-size: 32px; font-weight: 600; letter-spacing:3px; } .ProduceNav-img>p.b{ color: #ffffff; font-size: 16px; letter-spacing:1px; } .ProduceNav-img>span{ margin-top: 10px; width: 3%; background: #fff; height: 6px; } .produceMain{ background: #fff; width: 1200px; margin: 0 auto; } .produceMain .mainTop{ padding: 40px 0; } .produceMain .mainTop>p{ color: #a7a7a7; font-size: 14px; padding: 80px auto; } .produceMain .mainTop>p>a{ color: #a7a7a7; font-size: 14px; } .produceMain .mainTop>p>a>span{ color: #315591; } .produceMain .produceHead{ background: #f0f0f0; font-size: 0; } .produceMain .produceHead>a>li{ display: inline-block; border-right: 1px solid #cccccc; color: #999999; font-size: 18px; text-align: center; width: 16.66%; padding: 5px 0; } .produceMain .produceHead>a>.active{ background: #315591; color: #fff; } .produceMain .produceHead>a>li:nth-last-of-type(1){ border-right:none; } .produceMain .produceHead>a>li:hover{ cursor: pointer; } /* **********服务于支持******** */ .produceFooter{ margin: 40px 100px; } .transformP{ position: relative; } .line{ height: 2px; width: 0; background-color: #315591; display: inline-block; position: absolute; bottom: -1px; left: 0; } .footer-main:hover .line{ display: inline-block; width: 100%; transition: all 1.5s; color: #315591; } .footer-main:hover div:nth-of-type(1)>img{ cursor: pointer; transform: scale(1.1); -webkit-transform: scale(1.1); } .footer-main:hover .transformP p{ color: #315591!important; } .footer-main:hover .transformP div{ color: #315591!important; } .produceFooter1{ font-size: 0; } .produceFooter1>.footer-main{ width: 46%; display: inline-block; margin: 0 2%; border-bottom: 1px solid #cccccc; margin-bottom: 30px; } .produceFooter1>.footer-main>a>div.div1{ overflow: hidden; width: 100%; padding-bottom: 60%; border: 1px solid #cccccc; position: relative; } .produceFooter1>.footer-main>a>div.div1>img{ width: auto; height: auto; max-width: 100%; max-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); transition: 0.5s; -webkit-transition: 0.5s; } .produceFooter1>.footer-main>a>div.transformP{ padding:20px 0 10px 0; position: relative; } .produceFooter1>.footer-main>a>div.transformP>p.p1{ color: #333333; font-size: 18px; } .produceFooter1>.footer-main>a>div.transformP>p.p2{ color: #666666; font-size: 14px; line-height: 25px; height: 75px; overflow: hidden; } .produceFooter1>.footer-main>a>div.transformP>div{ font-size: 25px; position: absolute; top: 25px; right: 10px; color: #cccccc; } .produceMain .producePage{ text-align:center; padding:20px 0 60px 0; } .produceMain .producePage>a>h1{ width: 60px; height: 30px; background: #cccccc; color: #fff; font-size: 14px; display: inline-block; } .produceMain .producePage>a>h1:hover{ background: #315591; } .produceMain .producePage>a>.active{ background: #315591; } .produceMain .producePage>a>p{ width: 30px; height: 30px; margin: 0 5px; background: #cccccc; color: #fff; font-size: 14px; display: inline-block; } .produceMain .producePage>a>p:hover{ background: #315591; } /* ********产品详情页******** */ .productionMain{ background: #ffffff; position: relative; margin-bottom: 160px; width: 1200px; margin: 0 auto; } .productionMain .mainTop{ padding: 40px 0; } .productionMain .mainTop p{ color: #a7a7a7; font-size: 14px; padding: 80px auto; } .productionMain .mainTop>p>a{ color: #a7a7a7; font-size: 14px; } .productionMain .mainTop>p>a>span{ color: #315591; } .productionall{ width: 45%; margin: 0 100px; display: inline-block; } .productionall>h1{ color: #2e53a1; font-size: 18px; margin-bottom: 20px; } .productionall>div{ margin: 20px 0; } .productionall>div>h2{ color: #333333; font-size: 16px; margin-bottom: 10px; } .productionall>div>h2>img{ margin-left: 20px; } .productionall>div>p{ color: #999999; font-size: 14px; } .productionimg{ display: inline-block; width: 40%; vertical-align: top; margin-top: 40px; } /* ****************service************************* */ .serviceNav-img{ width: 100%; height: 400px; background-image: url('../img/servicenav.jpg'); background-repeat: no-repeat; background-size: 100% 100%; padding-left: 400px; color: #fff; display:flex; display: -webkit-flex; justify-content:center; flex-direction: column; } .serviceNav-img .a{ opacity: 0; animation: move1 0.5s linear 0.5s forwards; -webkit-animation: move1 0.5s linear 0.5s forwards; } .serviceNav-img .b{ opacity: 0; animation: move1 0.8s linear 0.8s forwards; -webkit-animation: move1 0.8s linear 0.8s forwards; } .serviceNav-img .c{ opacity: 0; animation: move1 1s linear 1s forwards; -webkit-animation: move1 1s linear 1s forwards; } .serviceNav-img>p.a{ color: #ffffff; font-size: 32px; font-weight: 600; letter-spacing:3px; } .serviceNav-img>p.b{ color: #ffffff; font-size: 16px; letter-spacing:1px; } .serviceNav-img>span{ margin-top: 10px; width: 3%; background: #fff; height: 6px; } .serviceMain .top_div{ width: 1200px; margin: 0 auto; position: relative; } .serviceMain .mainTop>p{ position: absolute; top: 29px; left: 0px; color: #a7a7a7; font-size: 14px; } .serviceMain .mainTop>p>a{ color: #a7a7a7; font-size: 14px; } .serviceMain .mainTop>p>a>span{ color: #315591; } .serviceMain .mainline{ overflow: hidden; width: 1200px; margin: 0 auto; } .serviceMain .mainline>div{ float: right; width: 350px; margin-top: 25px; } #a{ border-top: 1px solid #cccccc; } .serviceMain .mainline>div>a>p{ color: #999999; padding: 10px 30px; font-size: 18px; display: inline-block; } .serviceMain .mainline>div>a>.active{ color: #315591; border-bottom: 4px solid #315591; } .serviceMain .mainline>div>a>p:hover{ color: #315591; border-bottom: 4px solid #315591; } .serviceMain .mainline>div>span{ border-right: 1px solid #cccccc; } .serviceMain .mainAll{ font-size: 0; width: 1200px; margin: 0 auto; } .serviceMain .mainAll>h1{ color: #2e53a1; font-size: 18px; margin: 80px 50px 50px; } .serviceMain .mainAll>div{ width: 49.8%; display: inline-block; text-align: center; color: #666666; } .serviceMain .mainAll>.A{ background: #d5ddec; font-size: 16px; padding: 16px 0; } .serviceMain .mainAll>.A>p{ width: 49%; display: inline-block; } .serviceMain .mainAll>.B{ background: #f0f0f0; font-size: 16px; padding: 16px 0; } .serviceMain .mainAll>.B>p{ width: 49%; display: inline-block; } .serviceMain .mainAll>h1>a{ color: #2e53a1; font-weight: 700; } .serviceMain .mainAll>h1>a:hover{ cursor: pointer; } .serviceMain .maindownload{ width: 1200px; margin: 0 auto; } .serviceMain .maindownload>h1{ color: #2e53a1; font-size: 18px; margin: 80px 50px 50px; } .serviceMain .maindownload>div>a>div{ display: inherit; margin-left: 39%; } .serviceMain .maindownload>div>a>p{ display: inline-block; color: #666666; margin-left: 6%; } .serviceMain .maindownload>div:hover>a>p{ color:#2957a4; } /* .serviceMain .maindownload>div:hover>a>div>img{ } */ .serviceMain .maindownload>.A{ background: #d5ddec; font-size: 16px; padding: 16px 0; } .serviceMain .maindownload>.B{ background: #f0f0f0; font-size: 16px; padding: 16px 0; } .Add{ background-size: 100% 100%; width: 100%; height: 400px; margin: 40px 0; } .Add>div{ width: 1200px; margin: 0 auto; font-size: 0; padding: 2% 0; } .Add>div>.Z{ width: 23%; height: 150px; background: #fff; display: inline-block; vertical-align: top; margin: 10px; padding-left: 20px; } .Add>div>.Z>p{ vertical-align: middle; } .Add>div>.Z>p.p1{ font-size: 18px; color: #333333; line-height: 27px; font-weight: 600; margin: 40px 0 10px 0; } .Add>div>.Z>p.p2{ width: 10%; /* height: 3px; */ /* background: #333333; */ border-bottom: 2px solid #333333; margin-bottom: 10px; } .Add>div>.Z>p.p3{ font-size: 16px; color: #666666; } .Add>div>.Z:nth-of-type(5)>p{ margin-top: 12px; } /* ***************serverme**************************** */ .serviceMain #dituContent{ margin: 40px auto; width: 1200px; height: 400px; } .serviceMain .top_div{ width: 1200px; margin: 0 auto; position: relative; } .serviceMain .mapTiter{ } .serviceMain .mapTiter>h1{ color: #2b56a5; font-size: 20px; margin: 20px 25px; } .serviceMain .mapTiter>p{ color: #666666; font-size: 16px; margin-bottom: 60px; text-indent:2em; line-height: 28px; } .serviceMain .mapTiterA{ width: 1200px; margin: 0 auto; overflow: hidden; } .serviceMain .mapTiterA>.Aleft{ width: 51%; display: inline-block; position: relative; } .serviceMain .mapTiterA>.Aleft>div:nth-of-type(1)>p{ font-size: 14px; color: #333333; } .serviceMain .mapTiterA>.Aleft>div:nth-of-type(1)>p>span{ color: #6e6e6e; font-size: 14px; } .serviceMain .mapTiterA>.Aleft>div:nth-of-type(2){ position: absolute; right: 0; top: 6px; } .serviceMain .mapTiterA>.Aleft>div:nth-of-type(2)>p>img{ margin-right: 8px; } .serviceMain .mapTiterA>.Aleft>div:nth-of-type(2)>p{ font-size: 14px; color: #333333; margin-bottom: 5px; } .serviceMain .mapTiterA>.Aleft>div:nth-of-type(2)>p:nth-of-type(1){ color: #d71818; } .serviceMain .mapTiterA>.Aleft>div:nth-of-type(2)>p:nth-of-type(1)>span{ color: #d71818; font-size: 18px; font-weight: 700; } .serviceMain .mapTiterA>.Aleft>div:nth-of-type(2)>p>span{ color: #6e6e6e; font-size: 14px; } .serviceMain .mapTiterA>.Aright{ width: 38%; float: right; margin: 30px 0 60px; border-left: 1px solid #cccccc; } .serviceMain .mapTiterA>.Aright>div{ width: 45%; display: inline-block; /* text-align: center; */ } .serviceMain .mapTiterA>.Aright>div:nth-of-type(1){ padding-left: 80px; } .serviceMain .mapTiterA>.Aright>div:nth-of-type(2)>img{ padding-left: 40px; } /* *************new*********************** */ .newNav-img{ width: 100%; height: 400px; background-image: url('../img/newsnav.jpg'); background-repeat: no-repeat; background-size: 100% 100%; padding-left: 20%; color: #fff; display:flex; display: -webkit-flex; justify-content:center; flex-direction: column; } .newNav-img .a{ opacity: 0; animation: move1 0.5s linear 0.5s forwards; -webkit-animation: move1 0.5s linear 0.5s forwards; } .newNav-img .b{ opacity: 0; animation: move1 0.8s linear 0.8s forwards; -webkit-animation: move1 0.8s linear 0.8s forwards; } .newNav-img .c{ opacity: 0; animation: move1 1s linear 1s forwards; -webkit-animation: move1 1s linear 1s forwards; } .newNav-img>p.a{ color: #ffffff; font-size: 32px; font-weight: 600; letter-spacing:3px; } .newNav-img>p.b{ color: #ffffff; font-size: 16px; letter-spacing:1px; } .newNav-img>span{ margin-top: 10px; width: 3%; background: #fff; height: 6px; } .newMain{ width: 100%; margin: 0 auto; } .newMain .top_div{ width: 1200px; margin: 0 auto; position: relative; } .newMain .mainTop>p{ position: absolute; top: 29px; left: 0px; color: #a7a7a7; font-size: 14px; } .newMain .mainTop>p>a{ color: #a7a7a7; font-size: 14px; } .newMain .mainTop>p>a>span{ color: #315591; } .newMain .mainline{ overflow: hidden; width: 1200px; margin: 0 auto; /* border-bottom: 1px solid #cccccc; */ } .newMain .mainline>div{ float: right; margin-top: 25px; } .newMain .mainline>div>p{ color: #999999; padding: 10px 30px; font-size: 18px; display: inline-block; } .newMain .mainline>div>p{ color: #315591; border-bottom: 4px solid #315591; } .newTitle{ position: relative; } .newTitle .lineNewTitle{ width: 0; position: absolute; bottom: 0; left: 0; height: 2px; background-color: #315591; } .newTitle:hover .lineNewTitle{ width: 100%; transition: all 0.5s; } .newMain .newTitle{ width: 1200px; margin: 0 auto; overflow: hidden; padding: 60px 0; overflow: hidden; border-bottom: 1px solid #f0f0f0; } .newMain .newTitle>a>div{ display: inline-block; } .newMain .newTitle>a>div.div1{ width: 15%; margin-right: 50px; } .newMain .newTitle>a>div.div1>p{ text-align: center; color: #999999; font-size: 30px; font-weight: 100; margin-bottom: 12px; } .newMain .newTitle>a>div.div1>img{ margin-left: 53px; } .newMain .newTitle>a>div.div2{ width: 50%; } .newMain .newTitle>a>div.div2>p:nth-of-type(1){ color: #333333; font-size: 16px; } .newMain .newTitle>a>div.div2>p:nth-of-type(2){ color:#999999; font-size: 14px; } .newMain .newTitle>a>div.div3{ float: right; } .newMain .newTitle:hover div.div1>img{ transform: translateX(38px); transition: all 0.5s; } .newMain .newTitle:hover div.div2>p:nth-of-type(1){ color: #315591; } .newMain .newTitle:hover{ border-bottom: 1px solid #315591; } .newMain .newTitle div.div3{ overflow: hidden; } .newMain .newTitle div.div3>img{ width: 200px; height: 125px; transition: 0.5s; -webkit-transition: 0.5s; } .newMain .newTitle:hover div.div3>img{ cursor: pointer; transform: scale(1.1); -webkit-transform: scale(1.1); } .newMain .newPage{ text-align:center; padding:40px 0 60px 0; } .newMain .newPage>a>h1{ width: 60px; height: 30px; background: #cccccc; color: #fff; font-size: 14px; display: inline-block; } .newMain .newPage>a>h1:hover{ background: #315591; } .newMain .newPage>a>p{ width: 30px; height: 30px; margin: 0 5px; background: #cccccc; color: #fff; font-size: 14px; display: inline-block; } .newMain .newPage>a>p:hover{ background: #315591; } .newMain .newsMain>p:nth-of-type(1){ text-align: center; color: #333333; font-size: 24px; margin: 40px 0 20px 0; } .newMain .newsMain>p:nth-of-type(2){ width: 800px; margin: 0 auto; text-align: center; color: #999999; font-size: 14px; background: #f0f0f0; } .newMain .newsMain>.newsMainA{ margin: 0 auto; width: 1200px; } .newMain .newsMain>.newsMainA>div{ overflow: hidden; } .newMain .newsMain>.newsMainA>div>img{ width: 100%; transition: 0.5s; -webkit-transition: 0.5s; } .newMain .newsMain>.newsMainA>div>img:hover{ cursor: pointer; transform: scale(1.1); -webkit-transform: scale(1.1); } .newMain .newsMain>.newsMainA>p{ color:#666666; font-size: 16px; margin: 30px 0; text-indent:2em; } .newMain .newsMain>.newsMainB{ margin: 0 auto 60px; width: 1200px; font-size: 14px; color: #999999; background:#f0f0f0; padding: 20px 0; } .newMain .newsMain>.newsMainB>p{ margin: 0 120px; } .newMain .newsMain>.newsMainB>p>span{ padding-left: 80px; } .newMain .newsMain>.newsMainB>p>a{ font-size: 14px; color: #999999; } .newMain .newsMain>.newsMainB>p:nth-of-type(2)>span{ padding-left: 63px; } /* ****************society****************** */ .society-img{ width: 100%; height: 400px; background-image: url('../img/societynav.jpg'); background-repeat: no-repeat; background-size: 100% 100%; padding-left:20%; color: #fff; display:flex; display: -webkit-flex; justify-content:center; flex-direction: column; } .society-img .a{ opacity: 0; animation: move1 0.5s linear 0.5s forwards; -webkit-animation: move1 0.5s linear 0.5s forwards; } .society-img .b{ opacity: 0; animation: move1 0.8s linear 0.8s forwards; -webkit-animation: move1 0.8s linear 0.8s forwards; } .society-img .c{ opacity: 0; animation: move1 1s linear 1s forwards; -webkit-animation: move1 1s linear 1s forwards; } .society-img .a{ color: #ffffff; font-size: 32px; font-weight: 600; letter-spacing:3px; } .society-img .b{ color: #ffffff; font-size: 16px; letter-spacing:1px; } .society-img span{ margin-top: 10px; width: 3%; background: #fff; height: 6px; } .socirtyMain .mainTop{ position: relative; } .socirtyMain .top_div{ width: 1200px; margin: 0 auto; /* position: relative; */ } .socirtyMain .mainTop p{ position: absolute; top: 29px; left: 0px; color: #a7a7a7; font-size: 14px; } .socirtyMain .mainTop p a{ color: #a7a7a7; font-size: 14px; } .socirtyMain .mainTop p a span{ color: #315591; } .socirtyMain .mainline{ /* width: 100%; border-bottom: 1px solid #cccccc; */ margin: 0 auto; width: 1200px; overflow: hidden; } .socirtyMain .mainline div{ float: right; width: 280px; margin-top: 25px; } .socirtyMain .mainline div a p{ color: #999999; padding: 10px 30px; font-size: 18px; display: inline-block; } .socirtyMain .mainline div a .active{ color: #315591; border-bottom: 4px solid #315591; } .socirtyMain .mainline div a p:hover{ color: #315591; border-bottom: 4px solid #315591; } .socirtyMain .mainline div span{ border-right: 1px solid #cccccc; } .socirtyMain .lineAlls{ margin-top: 30px; } .socirtyMain .socirtyAll{ margin: 0 auto; width: 1200px; border: 1px solid #cccccc; box-shadow: 0 3px 13px 0 rgba(0, 0, 0, 0.1); } .socirtyMain .socirtyAll>.socirtyA{ background: #cccccc; color: #fff; font-size: 16px; } .socirtyMain .socirtyAll>.socirtyA>p{ width: 19.1%; display: inline-block; padding: 10px 0; } .socirtyMain .socirtyAll>.socirtyA>p:nth-of-type(1){ padding-left: 60px; } .socirtyMain .socirtyAll>.socirtyA>p:nth-of-type(2){ text-align: center; } .socirtyMain .socirtyAll>.socirtyA>p:nth-of-type(3){ text-align: center; } .socirtyMain .socirtyAll>.socirtyA>p:nth-of-type(4){ text-align: center; } .socirtyMain .socirtyAll>.socirtyA>p:nth-of-type(5){ text-align: center; padding-left: 90px; } .socirtyMain .socirtyAll>.socirtyB{ margin: 0 20px; } .socirtyMain .socirtyAll>.socirtyB .socirtyT{ color: #333333; font-size: 16px; border-bottom: 1px dashed #dadada; width: 100%; } .socirtyMain .socirtyAll>.socirtyB .socirtyT>p{ width: 19.2%; display: inline-block; padding: 20px 0 10px; /* text-align: center; */ } .socirtyMain .socirtyAll>.socirtyB .socirtyT>p:nth-of-type(1){ padding-left: 45px; } .socirtyMain .socirtyAll>.socirtyB .socirtyT>p:nth-of-type(2){ text-align: center; padding-right: 18px; } .socirtyMain .socirtyAll>.socirtyB .socirtyT>p:nth-of-type(3){ text-align: center; padding-right: 10px; } .socirtyMain .socirtyAll>.socirtyB .socirtyT>p:nth-of-type(4){ text-align: center; padding-left: 10px; } .socirtyMain .socirtyAll>.socirtyB .socirtyT>p:nth-of-type(5){ text-align: center; padding-left: 105px; color: #315591; cursor: pointer; } .socirtyMain .socirtyAll>.socirtyB .socirtyP{ background: #fafafa; margin: 0 60px 0 20px; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(1){ color: #333333; font-size: 16px; padding: 20px 0 40px 0; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(1)>p{ width: 19.2%; display: inline-block; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(1)>p:nth-of-type(1){ padding-left: 30px; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(1)>p:nth-of-type(2){ text-align: center; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(1)>p:nth-of-type(3){ text-align: center; padding-left: 20px; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(1)>p:nth-of-type(4){ text-align: center; padding-left: 20px; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(1)>p:nth-of-type(5){ padding-left: 2%; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(2){ overflow: hidden; position: relative; padding-bottom: 80px; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(2)>div:nth-of-type(1){ width: 45%; float: left; margin-left: 30px; color: #666666; font-size: 14px; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(2)>div:nth-of-type(1)>p:nth-of-type(1){ font-size: 18px; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(2)>div:nth-of-type(2)>p:nth-of-type(1){ font-size: 18px; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(2)>div:nth-of-type(2){ width: 49%; float: right; color: #666666; font-size: 14px; } .socirtyMain .socirtyAll>.socirtyB .socirtyP>div:nth-of-type(2)>div:nth-of-type(1)>div{ position: absolute; bottom: 25px; left: 30px; font-size: 18px; color: #315591; } .socirtyMain .newPage{ text-align:center; padding:40px 0 60px 0; } .socirtyMain .newPage>a>h1{ width: 60px; height: 30px; background: #cccccc; color: #fff; font-size: 14px; display: inline-block; } .socirtyMain .newPage>a>.active{ background: #315591; } .socirtyMain .newPage>a>h1:hover{ background: #315591; } .socirtyMain .newPage>a>p{ width: 30px; height: 30px; margin: 0 5px; background: #cccccc; color: #fff; font-size: 14px; display: inline-block; } .socirtyMain .newPage>a>p:hover{ background: #315591; } /* ****************introduction************************* */ .introduction-img{ width: 100%; height: 400px; background-image: url('../img/intnav.jpg'); background-repeat: no-repeat; background-size: 100% 100%; padding-left: 20%; color: #fff; display:flex; display: -webkit-flex; justify-content:center; flex-direction: column; } .introduction-img .a{ opacity: 0; animation: move1 0.5s linear 0.5s forwards; -webkit-animation: move1 0.5s linear 0.5s forwards; } .introduction-img .b{ opacity: 0; animation: move1 0.8s linear 0.8s forwards; -webkit-animation: move1 0.8s linear 0.8s forwards; } .introduction-img .c{ opacity: 0; animation: move1 1s linear 1s forwards; -webkit-animation: move1 1s linear 1s forwards; } .introduction-img>p.a{ color: #ffffff; font-size: 32px; font-weight: 600; letter-spacing:3px; } .introduction-img>p.b{ color: #ffffff; font-size: 16px; letter-spacing:1px; } .introduction-img>span{ margin-top: 10px; width: 3%; background: #fff; height: 6px; } .introductionMain .top_div{ /* position: relative; */ width: 1200px; margin: 0 auto; } .introductionMain .mainTop{ position: relative; } .introductionMain{ position: relative; } .introductionMain .mainTop>p{ position: absolute; top: 29px; left: 0px; color: #a7a7a7; font-size: 14px; } .introductionMain .mainTop>p>a{ color: #a7a7a7; font-size: 14px; } .introductionMain .mainTop>p>a>span{ color: #315591; } .introductionMain .mainline{ overflow: hidden; } .introductionMain .mainline>div{ float: right; width: 750px; margin-top: 25px; } .introductionMain .mainline>div>a>p{ color: #999999; padding: 10px 30px; font-size: 18px; display: inline-block; } .introductionMain .mainline>div>a>.active{ color: #315591; border-bottom: 4px solid #315591; } .introductionMain .mainline>div>a>p:hover{ color: #315591; border-bottom: 4px solid #315591; } .introductionMain .mainline>div>span{ border-right: 1px solid #cccccc; } .introductionMain .introductionall{ margin: 0 auto; width: 1200px; } .introductionMain .introductionall .allImg{ width: 100%; background-image: url('../img/int01.jpg'); height: 352px; position: relative; margin-bottom: 70px; margin-top: 40px; } .introductionMain .introductionall .allImg>p:nth-of-type(1){ font-size: 24px; color: #fff; position: absolute; top: 180px; left: 60px; } .introductionMain .introductionall .allImg>p:nth-of-type(2){ font-size: 16px; color: #fff; position: absolute; top: 240px; left: 60px; } .introductionMain .introductionall .allTitle>div:nth-of-type(1){ display: inline-block; width: 42%; vertical-align: middle; } .introductionMain .introductionall .allTitle>div:nth-of-type(2){ display: inline-block; width: 50%; vertical-align: middle; overflow: hidden; margin-left: 92px; } .introductionMain .introductionall .allTitle>div p{ padding: 20px 0; margin-left: 100px; border-top: 1px solid #315591; border-bottom: 1px solid #315591; } .introductionMain .introductionall .allTitle>div img{ width: 100%; transition: 0.5s; -webkit-transition: 0.5s; } .introductionMain .introductionall .allTitle>div img:hover{ cursor: pointer; transform: scale(1.1); -webkit-transform: scale(1.1); } .introductionMain .introductionall .allTitles{ overflow: hidden; } .introductionMain .introductionall .allTitles>div:nth-of-type(1){ display: inline-block; width: 50%; overflow: hidden; vertical-align: middle; } .introductionMain .introductionall .allTitles>div:nth-of-type(2){ display: inline-block; width: 42%; vertical-align: middle; } .introductionMain .introductionall .allTitles>div p{ padding: 20px 0; margin-left: 100px; /* vertical-align: middle; */ border-top: 1px solid #315591; border-bottom: 1px solid #315591; } .introductionMain .introductionall .allTitles>div img{ width: 100%; margin-left: 0; width: 100%; transition: 0.5s; -webkit-transition: 0.5s; } .introductionMain .introductionall .allTitles>div img:hover{ cursor: pointer; transform: scale(1.1); -webkit-transform: scale(1.1); } .introductionMain .introductionall .allA>div{ font-size: 16px; color: #666666; padding: 15px 0; background-color: #f0f0f0; padding: 0 18%; margin-bottom: 60px; } /* *******item************** */ .itemMain{ margin: 40px auto; width: 1200px; } .itemMain>.itemAll{ background-image: url('../img/item01.jpg'); width: 100%; height: 470px; position: relative; font-size: 16px; color: #666666; overflow: hidden; margin-bottom: 60px; } .itemMain>.itemAll>p{ text-indent:2em; display: inline-block; padding: 30px 60px; } .itemMain>.itemAll>p.p1{ width: 47%; position: absolute; top: 90px; left: 25px; line-height: 25px; } .itemMain>.itemAll>p.p2{ width: 95%; position: absolute; top: 360px; left: 25px; line-height: 25px; } .itemMain>.itemAll>div{ overflow: hidden; width: 40%; display: inline-block; position: absolute; top: 50px; left: 620px; } .itemMain>.itemAll>div>img{ width: 100%; transition: 0.5s; -webkit-transition: 0.5s; } .itemMain>.itemAll>div>img:hover{ cursor: pointer; transform: scale(1.1); -webkit-transform: scale(1.1); } /* ***************************culture***************************************** */ .cultureAll{ margin: 0 auto; width: 1200px; position: relative; } .cultureAll .Allimg{ position: absolute; top: 143px; left: 107px; } .cultureAll .Allpoint>img{ display: inline-block; } .cultureAll .Allpoint>div{ display: inline-block; } .cultureAll .Allpoint>div>p:nth-of-type(1){ font-size: 18px; } .cultureAll .Allpoint>div>p:nth-of-type(2){ font-size: 20px; } .cultureAll .Allpoint1{ position: absolute; top: 90px; right: 0; } .cultureAll .Allpoint1>div{ color: #999999; vertical-align: middle; margin-left: 30px; } .cultureAll .Allpoint2{ position: absolute; top: 260px; right: 0; } .cultureAll .Allpoint2>div{ color: #a47429; vertical-align: middle; margin-left: 30px; } .cultureAll .Allpoint3{ position: absolute; top: 440px; right: 0; } .cultureAll .Allpoint3>div{ color: #089fb1; vertical-align: middle; margin-left: 30px; } .cultureAll .Allpoint4{ position: absolute; top: 590px; right: 0; } .cultureAll .Allpoint4>div{ color: #2957a4; vertical-align: middle; margin-left: 30px; } .cultureAll .Allpoint5>img{ position: absolute; top: 590px; left: 100px; } .cultureAll .Allpoint5>div{ color: #b11c08; position: absolute; top: 741px; left: 105px; } .culturefooter{ margin-top: 950px; } /* *******************************case********************** */ .introductionMain .caseAll{ margin: 0 auto; width: 1200px; } .introductionMain .caseAll>h1{ color:#315591; font-size: 20px; margin-top: 40px; } .introductionMain .caseAll>.caseTitle{ margin: 0 40px 40px; font-size: 0; } .introductionMain .caseAll>.caseTitle>ul{ width: 100%; font-size: 16px; color: #666666; display: inline-block; margin: 20px 0; /* padding-left: 4rem; */ } .introductionMain .caseAll>.caseTitle>ul{ vertical-align: text-top; overflow: hidden; } .introductionMain .caseAll>.caseTitle>ul>li{ width: 49%; display: inline-block; padding-left: 80px; } .introductionMain .caseAll>.caseTitle>ul>li:nth-child(odd){ border-right: 1px solid #cccccc; } .caseFooter{ position: relative; margin:0 auto; width: 1200px; } .casebanner { display: inline-block; width: 1140px; line-height: 10; padding-bottom: 40px; margin-left: 40px; } .casebanner .Box_con { position: relative; } .casebanner .Box_con .btnl { position: absolute; } .casebanner .Box_con .btn { display: block; font-size: 40px; position: absolute; top: 80px; cursor: pointer; } .casebanner .Box_con .btnl { color: #2958a6; left: -60px; top:-120px; display: block!important; } .casebanner .Box_con .btnr { color: #2958a6; right: -50px; top: -125px; display: block!important; } .casebanner .Box_con .btnl:hover { color: #333333; } .casebanner .Box_con .btnr:hover { color: #333333; } .casebanner .Box_con .conbox { position: relative; overflow: hidden; } .casebanner .Box_con .conbox ul { position: relative; list-style: none; } .Zactive{ color: #2958a6!important; } .casebanner .Box_con .conbox ul li { float: left; width: 160px; height: 232px; margin-left: 35px; overflow: hidden; } .casebanner .Box_con .conbox ul li:first-child { margin-left: 0; } .casebanner .Box_con .conbox ul li i{ width: 100%; height: 70%; display: block; overflow: hidden; border-radius: 5px; } .casebanner .Box_con .conbox ul li img { width: auto; height: 100%; transition: all 0.5s; } .casebanner .Box_con .conbox ul li:hover{ cursor: pointer; } .casebanner .Box_con .conbox ul li:hover p{ color:#2958a6; } .casebanner .Box_con .conbox ul li p{ text-align: center; font-size: 18px; margin-top: 30px; line-height: 20px; color: #666666; } .casebanner .Box_con .conbox ul li:hover img { transform: scale(1.1); } .casebanner .BoxSwitch { margin: 30px; text-align: center; } .casebanner .BoxSwitch span { display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; width: 30px; height: 3px; background: #ccc; margin: 0 5px; cursor: pointer;} .casebanner .BoxSwitch span.cur { background: red; } .casebanner .conbox>div>a:nth-last-of-type(1){ margin-right: 0; } /* aptitiude.html */ .g_body .g_body1{ margin: 0 auto; width: 1200px; height: 250px; padding:0 40px; position: relative; } .g_body1 .swiper-button-prev { background-image: url(../img/icon111.jpg); left: 10px; top: 150px; position: absolute; width: 27px; height: 44px; } .g_body1 .swiper-button-next { background-image: url(../img/icon222.jpg); right: -10px; top: 150px; position: absolute; width: 27px; height: 44px; } .g_body1 .swiper-container1 { overflow: hidden; } .g_body1 .swiper-container1>h1{ font-size: 20px; color: #2b56a5; padding-left: 40px; } .g_body1 .swiper-wrapper{ padding: 40px 0 40px 40px; } .g_body1 .swiper-slide div{ text-align: center; } .g_body1 .swiper-slide div p{ font-size: 16px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .g_body3 .swiper-slide div p{ font-size: 16px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .g_body2 .swiper-slide div p{ font-size: 16px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .g_body2 .swiper-slide div{ width: 100%; } .g_body2{ margin: 0 auto; width: 1200px; height: 450px; padding:80px 40px 80px 20px; position: relative; overflow: hidden!important; } .g_body2 .swiper-container .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; } .g_body2 .swiper-container>h1{ font-size: 20px; color: #2b56a5; padding-bottom: 25px; padding-left: 80px; } .g_body2 .swiper-container .swiper-slide-active { position: relative; overflow: hidden; z-index: 100; } .g_body2 .swiper-container .swiper-slide>img{ width: 100%; transition: 0.5s; -webkit-transition: 0.5s; } .g_body2 .swiper-container .swiper-slide img:hover{ cursor: pointer; transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1); } .g_body2 .swiper-container .swiper-container-horizontal>.swiper-scrollbar { position: absolute; left: 40%; bottom: -63px; z-index: 50; height: 5px; width: 46%; } .g_body3{ margin: 0 auto; width: 1200px; height: 400px; padding:80px 40px 80px 20px; position: relative; overflow: hidden!important; } .g_body3 .swiper-container2 .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; } .g_body3 .swiper-container2>h1{ font-size: 20px; color: #2b56a5; padding-bottom: 25px; padding-left: 80px; } .g_body3 .swiper-container2 .swiper-slide-active { position: relative; overflow: hidden; z-index: 100; } .g_body3 .swiper-container2 .swiper-slide>img{ width: 100%; transition: 0.5s; -webkit-transition: 0.5s; } .g_body3 .swiper-container2 .swiper-slide img:hover{ cursor: pointer; transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1); } .g_body3 .swiper-container2 .swiper-container-horizontal>.swiper-scrollbar { position: absolute; left: 40%; bottom: -63px; z-index: 50; height: 5px; width: 46%; } /* *******登陆注册****** */ /* 登录的样式 */ .loginBody{ display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .5); z-index: 10; } .loginContent{ display: none; position: fixed; top: 22.5%; left: 37.5%; width: 540px; height: 500px; background-color: #fff; z-index: 20; border-radius: 10px; text-align: center; padding: 80px 40px; /* position: relative; */ } .loginContent>img{ margin-bottom: 10px; } .loginContent>input{ display: block; width: 400px; height: 40px; margin: 30px 50px; border-radius: 5px; border: 1px solid #a9a9a9; padding-left:10px; } .loginContent>button{ width: 400px; background: #315591; color: #fff; height: 40px; border: 1px solid #315591; border-radius: 5px; } .loginContent>p{ margin-top: 20px; } .loginContent>p>span{ cursor: pointer; color: #315591; } .loginContent>img:nth-of-type(2){ position: absolute; top: 20px; right:30px; } .loginContent>img:nth-of-type(2):hover{ cursor: pointer; } .registing{ display: none; position: fixed; top: 22.5%; left: 37.5%; width: 540px; height: 500px; background-color: #fff; z-index: 30; border-radius: 10px; overflow: hidden; padding: 60px 40px; } .registing>p{ text-align: center; font-size: 30px; color: #315591; margin-bottom: 20px; } .registing>input{ width: 45%; height: 40px; border-radius: 5px; border: 1px solid #a9a9a9; padding-left: 10px; margin-bottom: 10px; margin-right: 40px; } .registing>input:nth-of-type(2){ margin-right: 0px; } .registing>input:nth-of-type(4){ margin-right: 0px; } .registing>input:nth-of-type(6){ margin-right: 0px; } .registing>input:nth-of-type(8){ margin-right: 0px; } .registing>button{ display: block; width:300px; background: #315591; color: #fff; font-size: 20px; height: 45px; border: 1px solid #315591; border-radius: 5px; text-align: center; margin-left: 80px; margin-top: 20px; padding-bottom: 5px; } .registing #canvas{ float: right; width: 210px; height: 40px; border:1px solid #ccc; border-radius: 5px; cursor: pointer; margin-right: 10px; } .registing>img{ position: absolute; top: 20px; right:30px; } .registing>img:hover{ cursor: pointer; } /* ********************************page************************** */ .pageAll{ background: #fff; /* height: 1590px; */ } .pageMain{ width: 1200px; margin: 0 auto; height: 580px; margin-bottom: 180px; padding: 0 100px; } .pageMain>p{ font-size: 24px; color: #333333; margin: 40px 0 60px 0; text-align: center; } .pageMain .swiper-container { width: 100%; height: 300px; margin-left: auto; margin-right: auto; } .pageMain .gallery-top { border: 1px solid #cccccc; } .pageMain .gallery-top .swiper-button-next{ background-image: url('../img/right.png'); background-repeat: no-repeat; background-size: 100% 100%; margin-top: 0; right: 25px; width: 13px; height: 25px; } .pageMain .gallery-top .swiper-button-prev{ background-image: url('../img/left.png'); background-repeat: no-repeat; background-size: 100% 100%; margin-top: 0; left: 25px; width: 13px; height: 25px; } .pageMain .gallery-top .swiper-slide { background-position: center; background-size: contain; background-repeat: no-repeat; } .pageMain .gallery-top { height: 80%; width: 100%; } .pageMain .gallery-thumbs { height: 20%; box-sizing: border-box; border-bottom: 1px solid #cccccc; border-left: 1px solid #cccccc; border-right: 1px solid #cccccc; } .pageMain .gallery-thumbs .swiper-slide { width: 18%; height: 100%; opacity: 0.4; background-size: contain; background-position: center; background-repeat: no-repeat; border-left: 1px solid #cccccc; border-right: 1px solid #cccccc; } .pageMain .gallery-thumbs .swiper-slide img{ width: auto; height: auto; max-width: 100%; max-height: 100%; } .pageMain .gallery-thumbs .swiper-slide-active { opacity: 1; } .pagecontent{ width: 1200px; margin: 0 auto; padding: 0 124px; } .pagecontent>p{ font-size: 16px; color: #666666; } .pagecontent>p:nth-of-type(1){ margin-bottom: 0; } .pagecontent>p:nth-of-type(2){ margin-bottom: 0; } .pagecontent>p:nth-of-type(n+3){ line-height: 28px; } .pagecontent>p:nth-last-of-type(1){ width: 130px; height: 42px; background: #fff; font-size: 18px; text-align: center; margin: 40px 0; } .pagecontent>p:nth-last-of-type(1)>a{ color: #fff; vertical-align: -webkit-baseline-middle; } .pagecontent>p:nth-last-of-type(1):hover{ cursor: pointer; } .pagination{ font-size: 0; text-align: center; } .pagination a{ display: inline-block; height: 38px; line-height: 38px; padding: 0 16px; background: #ccc; color: #fff; margin-right: 16px; font-size: 14px; transition: 0.5s; -webkit-transition: 0.5s; } .pagination a:hover{ background: #315591; } .pagination .active{ background: #315591; } .pagination a:last-of-type { margin-right: 0; } .m_form{ position: relative; width: 170px; } .m_form input{ width: 170px; height: 30px; border-radius: 15px; box-sizing: border-box; border: 1px solid #999; font-size: 15px; padding-left: 12px; } .m_form button{ background: url(../img/home-search.jpg) no-repeat center; background-size: auto 80%; width: 28px; height: 28px; border-radius: 50%; border: none; outline: none; position: absolute; top: 1px; right: 5px; } .search_box{ width: 1200px; margin: 0 auto; padding: 40px 100px 0; } .search_box p{ font-size: 16px; font-weight: bold; margin-bottom: 20px; } .search_box ul{ margin-bottom: 30px; } .search_box ul li{ height: 40px; line-height: 40px; border-bottom: 1px solid #ccc; font-size: 14px; } .search_box ul li a{ color: #333; display: block; }