select { appearance: none; outline: none; -moz-appearance: none; -webkit-appearance: none; padding-left: 10px; } select option { outline: none; border: none; } @keyframes move { 0% { opacity: 1; transform: translateY(-5px); } 100% { opacity: 0; transform: translateY(0px); } } body, html { min-width: 1200px; width: 100%; } .header { width: 100%; height: 100px; background: #fff; } .header.fix { position: fixed; top: 0; left: 0; z-index: 120; } .header .header_cen { width: 1595px; height: 100%; margin: 0 auto; } .header .header_cen .logo { float: left; margin-left: 83px; line-height: 100px; } .header .header_cen .logo img { width: 100%; height: auto; } .header .header_cen > .nav { float: left; height: 100%; margin-left: 195px; } .header .header_cen > .nav > li { height: 100%; float: left; margin-right: 5px; } .header .header_cen > .nav > li.active > a { color: #fff; background: #0884d5; } .header .header_cen > .nav > li:hover > a { color: #fff; background: #0884d5; } .header .header_cen > .nav > li > a { height: 35px; display: inline-block; padding: 0 28px; border-radius: 35px; font-size: 16px; color: #333; transition: all 0.5s; line-height: 35px; margin-top: 32px; } .header .header_cen > .nav > li > .slider { width: 100%; height: auto; background: #f9f9f9; position: absolute; left: 0; top: 100px; z-index: 120; display: none; } .header .header_cen > .nav > li > .slider .slider_cen { width: 1200px; height: auto; margin: 0 auto; padding-bottom: 23px; } .header .header_cen > .nav > li > .slider .slider_cen .slider_l { float: left; width: 380px; height: auto; margin-top: 92px; } .header .header_cen > .nav > li > .slider .slider_cen .slider_l .line { width: 62px; height: 5px; background: #0067ac; } .header .header_cen > .nav > li > .slider .slider_cen .slider_l .name { font-size: 40px; color: #0067ac; font-weight: bold; padding-top: 10px; } .header .header_cen > .nav > li > .slider .slider_cen .slider_ll { float: left; width: 230px; height: auto; margin-top: 92px; } .header .header_cen > .nav > li > .slider .slider_cen .slider_ll .line { width: 62px; height: 5px; background: #0067ac; } .header .header_cen > .nav > li > .slider .slider_cen .slider_ll .name { font-size: 40px; color: #0067ac; font-weight: bold; padding-top: 10px; } .header .header_cen > .nav > li > .slider .slider_cen .slider_ll2 { float: left; width: 260px; height: auto; margin-top: 92px; } .header .header_cen > .nav > li > .slider .slider_cen .slider_ll2.slider_l3 { width: 245px; } .header .header_cen > .nav > li > .slider .slider_cen .slider_ll2 .line { width: 62px; height: 5px; background: #0067ac; } .header .header_cen > .nav > li > .slider .slider_cen .slider_ll2 .name { font-size: 40px; color: #0067ac; font-weight: bold; padding-top: 10px; } .header .header_cen > .nav > li > .slider .slider_cen .slider_ll2 .more { width: 160px; height: 40px; display: block; border: 1px solid #2c64ae; border-radius: 40px; text-align: center; line-height: 40px; font-size: 14px; color: #0c4da2; margin-top: 12px; transition: all 0.5s; } .header .header_cen > .nav > li > .slider .slider_cen .slider_ll2 .more:hover { background: #0884d5; border-color: #0884d5; color: #fff; } .header .header_cen > .nav > li > .slider .slider_cen .cont { float: left; padding-bottom: 20px; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_mes { width: 242px; height: auto; float: left; margin-top: 60px; border-right: 1px solid #dcdcde; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_mes .tit { font-size: 18px; color: #0884d5; padding-top: 3px; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_mes ul { width: 100%; padding-top: 2px; height: auto; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_mes ul li { float: left; width: 95px; height: auto; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_mes ul li a { font-size: 13px; color: #666; display: block; padding-bottom: 5px; transition: all 0.5s; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_mes ul li a:hover { color: #0884d5; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_str { height: auto; float: left; margin-top: 60px; margin-left: 95px; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_str .tit { font-size: 18px; color: #0884d5; padding-top: 3px; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_str ul { width: 100%; padding-top: 2px; height: auto; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_str ul li { float: left; width: 95px; height: auto; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_str ul li a { font-size: 13px; color: #666; display: block; padding-bottom: 5px; transition: all 0.5s; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_str ul li a:hover { color: #0884d5; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_tu { float: left; margin-left: 90px; margin-top: 65px; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_tu .tu { width: 201px; height: 105px; overflow: hidden; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_tu .tu:hover img { transform: scale(1.1); } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_tu .tu img { width: 100%; height: 100%; transition: all 0.5s; } .header .header_cen > .nav > li > .slider .slider_cen .cont .company_tu .txt { font-size: 12px; color: #666; line-height: 20px; padding-top: 10px; } .header .header_cen > .nav > li > .slider .slider_cen .programme { margin-top: 50px; float: right; } .header .header_cen > .nav > li > .slider .slider_cen .programme ul { overflow: hidden; } .header .header_cen > .nav > li > .slider .slider_cen .programme ul li:last-child { width: 230px; border: none; } .header .header_cen > .nav > li > .slider .slider_cen .programme ul li { width: 245px; min-height: 180px; float: left; box-sizing: border-box; border-right: 1px solid #f2f2f2; } .header .header_cen > .nav > li > .slider .slider_cen .programme ul li a { width: 100%; height: 100%; display: block; } .header .header_cen > .nav > li > .slider .slider_cen .programme ul li a:hover .text { color: #0884d5; } .header .header_cen > .nav > li > .slider .slider_cen .programme ul li a .ico { width: 92px; height: 92px; margin: 0 auto; background: url(../img/s1.png) no-repeat; } .header .header_cen > .nav > li > .slider .slider_cen .programme ul li a .ico.ico1 { background: url(../img/s2.png) no-repeat; } .header .header_cen > .nav > li > .slider .slider_cen .programme ul li a .ico.ico2 { background: url(../img/s3.png) no-repeat; } .header .header_cen > .nav > li > .slider .slider_cen .programme ul li a .ico.ico3 { background: url(../img/s4.png) no-repeat; } .header .header_cen > .nav > li > .slider .slider_cen .programme ul li a .text { text-align: center; font-size: 18px; color: #3c3c3c; transition: all 0.5s; padding-top: 24px; } .header .header_cen > .nav > li > .slider .slider_cen .ser { float: left; margin-top: 55px; } .header .header_cen > .nav > li > .slider .slider_cen .ser.ser2 { width: 950px; padding-bottom: 30px; } .header .header_cen > .nav > li > .slider .slider_cen .ser.ser2 ul li { margin-left: 0; padding-left: 60px; width: 175px; } .header .header_cen > .nav > li > .slider .slider_cen .ser.ser2 ul li:last-child { border: none; } .header .header_cen > .nav > li > .slider .slider_cen .ser > ul { float: left; } .header .header_cen > .nav > li > .slider .slider_cen .ser > ul li { width: 185px; min-height: 190px; border-right: 1px solid #dcdcde; float: left; margin-left: 115px; } .header .header_cen > .nav > li > .slider .slider_cen .ser > ul li .tit { font-size: 18px; color: #0884d5; line-height: 38px; padding-bottom: 2px; } .header .header_cen > .nav > li > .slider .slider_cen .ser > ul li a { display: block; padding-bottom: 7px; font-size: 13px; color: #666; } .header .header_cen > .nav > li > .slider .slider_cen .ser > ul li a:hover { color: #0884d5; } .header .header_cen > .nav > li > .slider .slider_cen .ser .txt_w { float: left; padding-left: 115px; } .header .header_cen > .nav > li > .slider .slider_cen .ser .txt_w a:last-child { padding-bottom: none; } .header .header_cen > .nav > li > .slider .slider_cen .ser .txt_w a { display: block; font-size: 18px; color: #0884d5; padding-bottom: 50px; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main { width: 935px; height: auto; float: right; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap { width: 935px; height: 283px; margin-top: 40px; overflow: hidden; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap > ul { width: 2000px; height: auto; position: relative; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap > ul li { width: 935px; height: 100%; float: left; margin-left: 1px; margin-top: 1px; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap > ul li .item_box { width: 100%; height: 141px; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap > ul li .item_box .item { width: 185px; height: 140px; float: left; border: 1px solid #eaeaeb; margin-left: -1px; margin-top: -1px; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap > ul li .item_box .item .ti { font-size: 18px; color: #0884d5; font-weight: bold; text-align: center; line-height: 140px; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap > ul li .item_box .item a { width: 100%; height: 100%; display: block; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap > ul li .item_box .item a:hover .tu img { transform: scale(1.1); } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap > ul li .item_box .item a:hover .txt { color: #0884d5; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap > ul li .item_box .item a .tu { width: 100%; height: 110px; text-align: center; line-height: 110px; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap > ul li .item_box .item a .tu img { max-width: 100%; max-height: 100%; transition: all 0.5s; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .wrap > ul li .item_box .item a .txt { font-size: 14px; color: #666; transition: all 0.5s; text-align: center; line-height: 22px; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .jb { width: 100%; height: auto; margin-top: 40px; text-align: center; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .jb a { width: 12px; height: 12px; border-radius: 50%; display: inline-block; background: #dadada; margin: 0 6px; } .header .header_cen > .nav > li > .slider .slider_cen .wrap_main .jb a.cur { background: #0884d5; } .header .header_cen .search { width: 175px; height: 25px; float: right; border: 1px solid #adadad; border-radius: 25px; margin-top: 37px; overflow: hidden; } .header .header_cen .search .submit { width: 19px; height: 25px; display: block; float: right; background: url(../img/search.png) no-repeat center center; border: none; margin-right: 10px; } .header .header_cen .search #text { width: 140px; height: 25px; display: block; float: left; border: none; font-size: 14px; color: #333; text-indent: 1em; line-height: 25px; border-radius: 25px; } @media (max-width: 1610px) { .header .header_cen { width: 1500px; } .header .header_cen .logo { margin-left: 30px; } .header .header_cen .nav { margin-left: 100px; } .header .header_cen .search { float: left; width: 140px; margin-left: 50px; } .header .header_cen .search #text { width: 105px; } } @media (max-width: 1500px) { .header .header_cen { width: 1200px; } .header .header_cen .logo { margin-left: 10px; } .header .header_cen .nav { margin-left: 50px; } .header .header_cen .nav > li > a { padding: 0 20px; } .header .header_cen .search { margin-left: 10px; } } .main { padding-top: 100px; } .main.welcome { width: 100%; height: auto; } .main.welcome .banner { width: 100%; height: 830px; position: relative; overflow: hidden; } .main.welcome .banner ul { width: 20000px; height: 100%; position: relative; } .main.welcome .banner ul li { width: 1920px; height: 100%; position: relative; text-align: center; float: left; } .main.welcome .banner ul li .mask { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.3); z-index: 3; } .main.welcome .banner ul li .wrap2 { display: inline-block; } .main.welcome .banner ul li .wrap2 .pic { position: relative; z-index: 4; margin-top: 220px; } .main.welcome .banner ul li .wrap2 .pic img { display: block; margin: 0 auto; width: 494px; height: 75px; } .main.welcome .banner ul li .wrap2 .descript { font-size: 28px; color: #fff; text-align: center; position: relative; z-index: 4; padding-top: 5px; opacity: 0.8; } .main.welcome .banner ul li .wrap2 .line { width: 50px; height: 2px; background: #fff; position: relative; z-index: 4; margin-top: 5px; } .main.welcome .banner .slider { width: 100%; height: auto; text-align: center; position: absolute; left: 0; z-index: 100; bottom: 25px; } .main.welcome .banner .slider a { width: 15px; height: 15px; display: inline-block; border-radius: 50%; background: #fff; margin: 0 5px; } .main.welcome .banner .slider a.current { background: #0884d5; } .main.welcome .banner .bx { width: 100%; height: auto; position: absolute; bottom: 65px; left: 0; z-index: 11; } .main.welcome .banner .bx .box { width: 1496px; height: auto; margin: 0 auto; } .main.welcome .banner .bx .box.js-m { transform: translateY(100px); opacity: 0; } .main.welcome .banner .bx .box ul { width: 100%; height: auto; } .main.welcome .banner .bx .box ul li:last-child { margin-right: none; } .main.welcome .banner .bx .box ul li { width: 367px; height: 200px; float: left; overflow: hidden; border: 1px solid transparent; margin-right: 7px; transition: transform 0.5s,border-color 0.5s; box-sizing: border-box; } .main.welcome .banner .bx .box ul li:hover { border-color: #e48d5a; transform: translateY(-18px); } .main.welcome .banner .bx .box ul li:hover a .box_r .more { border-color: #ff7e00; } .main.welcome .banner .bx .box ul li a { position: relative; width: 100%; height: 100%; display: block; color: #fff; } .main.welcome .banner .bx .box ul li a .mask { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.8); } .main.welcome .banner .bx .box ul li a .box_l { float: left; position: relative; z-index: 10; width: 43.5%; height: 100%; text-align: center; line-height: 198px; } .main.welcome .banner .bx .box ul li a .box_l img { max-width: 100%; max-height: 100%; } .main.welcome .banner .bx .box ul li a .box_r { width: 52%; height: auto; float: left; margin-right: 4.5%; position: relative; z-index: 10; padding-top: 45px; text-align: left; } .main.welcome .banner .bx .box ul li a .box_r .name { font-size: 14px; color: #fff; } .main.welcome .banner .bx .box ul li a .box_r .txt { font-size: 13px; color: #fff; opacity: 0.6; padding-top: 8px; line-height: 22px; } .main.welcome .banner .bx .box ul li a .box_r .more { width: 110px; height: 30px; border: 1px solid #fff; font-size: 12px; color: rgba(255, 255, 255, 0.8); text-align: center; margin-top: 20px; transition: all 0.5s; line-height: 30px; } @media (max-width: 1540px) { .main.welcome .banner .bx .box { width: 1200px; } .main.welcome .banner .bx .box ul li { width: 292px; height: 158.4px; margin-right: 5.6px; background-size: 100% 100% !important; } .main.welcome .banner .bx .box ul li a .box_l { float: left; width: 42.5%; height: 100%; margin-right: 1%; line-height: 158.4px; } .main.welcome .banner .bx .box ul li a .box_r { width: 50%; margin-right: 4.5%; padding-top: 10px; float: right; } .main.welcome .banner .bx .box ul li a .box_r .more { margin-top: 10px; height: 25px; line-height: 25px; } } .main.welcome .solution_main { width: 100%; height: auto; } .main.welcome .solution_main .title { text-align: center; font-size: 44px; color: #272626; line-height: 62px; padding-top: 55px; } .main.welcome .solution_main .j { width: 100%; height: auto; } .main.welcome .solution_main .j img { display: block; margin: 0 auto; } .main.welcome .solution_main .x { font-size: 14px; color: #7d7d7d; text-align: center; padding-top: 10px; } .main.welcome .solution_main .box3 { width: 89.5%; height: auto; margin: 0 auto; padding-top: 40px; padding-bottom: 62px; min-width: 1200px; } .main.welcome .solution_main .box3 ul { width: 100%; height: auto; overflow: hidden; } .main.welcome .solution_main .box3 ul li:last-child { border-right: none; } .main.welcome .solution_main .box3 ul.cu li:first-child { transition: all 0.7s; opacity: 1; transform: translateY(0px); } .main.welcome .solution_main .box3 ul.cu li:nth-child(2) { transition: all 0.7s 0.2s; opacity: 1; transform: translateY(0px); } .main.welcome .solution_main .box3 ul.cu li:nth-child(3) { transition: all 0.7s 0.4s; opacity: 1; transform: translateY(0px); } .main.welcome .solution_main .box3 ul.cu li:nth-child(4) { transition: all 0.7s 0.6s; opacity: 1; transform: translateY(0px); } .main.welcome .solution_main .box3 ul.cu li:nth-child(5) { transition: all 0.7s 0.8s; opacity: 1; transform: translateY(0px); } .main.welcome .solution_main .box3 ul li { width: 25%; height: auto; float: left; border-right: 1px solid #e8e8e8; box-sizing: border-box; opacity: 0; transform: translateY(30px); } .main.welcome .solution_main .box3 ul li:hover a .txt_w { color: #0884d5; } .main.welcome .solution_main .box3 ul li a { width: 100%; height: auto; display: block; color: #3c3c3c; } .main.welcome .solution_main .box3 ul li a .ico { width: 162px; height: auto; margin: 0 auto; } @media (max-width: 1400px) { .main.welcome .solution_main .box3 ul li a .ico { width: 140px; } } .main.welcome .solution_main .box3 ul li a .ico img { width: 100%; height: auto; display: block; } .main.welcome .solution_main .box3 ul li a .txt_w { text-align: center; font-size: 20px; color: #3c3c3c; padding-top: 12px; transition: color 0.5s; } .main.welcome .solution_main .box3 ul li a .con { font-size: 14px; color: #999999; padding-top: 7px; text-align: center; line-height: 20px; } .main.welcome .about_main { width: 100%; height: auto; padding-bottom: 85px; } .main.welcome .about_main .title { text-align: center; font-size: 44px; color: #fff; line-height: 60px; padding-top: 75px; } .main.welcome .about_main .j { width: 100%; height: auto; } .main.welcome .about_main .j img { display: block; margin: 0 auto; } .main.welcome .about_main .x { font-size: 24px; color: #fff; opacity: 0.8; text-align: center; font-weight: bold; padding-top: 10px; } .main.welcome .about_main .ab { width: 900px; height: auto; margin: 90px auto 0 auto; font-size: 14px; color: #fcf8f5; text-align: center; position: relative; padding-top: 28px; padding-bottom: 18px; } .main.welcome .about_main .ab .zy { position: absolute; left: 0; top: 0; width: 22px; height: 19px; background: url(../img/zy.png) no-repeat; } .main.welcome .about_main .ab .by { position: absolute; right: -15px; bottom: 0; width: 22px; height: 19px; background: url(../img/by.png) no-repeat; } .main.welcome .about_main .ab p { text-indent: 2em; } .main.welcome .about_main .more { width: 230px; height: 40px; background: #ff8e00; border-radius: 40px; font-size: 16px; color: #fff; text-align: center; line-height: 40px; display: block; transition: all 0.5s; margin: 100px auto 0 auto; } .main.welcome .about_main .more:hover { background: #0067ac; } .main.welcome .news_main { width: 100%; height: auto; } .main.welcome .news_main .title { text-align: center; font-size: 44px; color: #272626; line-height: 62px; padding-top: 68px; } .main.welcome .news_main .j { width: 100%; height: auto; } .main.welcome .news_main .j img { display: block; margin: 0 auto; } .main.welcome .news_main .news_box { width: 1200px; height: auto; margin: 0 auto; overflow: hidden; padding-bottom: 135px; padding-top: 45px; } .main.welcome .news_main .news_box ul { width: 110%; height: auto; } .main.welcome .news_main .news_box ul li { width: 371px; height: auto; float: left; margin-right: 43px; } .main.welcome .news_main .news_box ul li:hover a .tu img { transform: scale(1.1); } .main.welcome .news_main .news_box ul li:hover a .text { background: #219dee; } .main.welcome .news_main .news_box ul li:hover a .text .year .day, .main.welcome .news_main .news_box ul li:hover a .text .year .month { color: #fff; } .main.welcome .news_main .news_box ul li:hover a .text .con .tit, .main.welcome .news_main .news_box ul li:hover a .text .con .cont { color: #fff; } .main.welcome .news_main .news_box ul li a { width: 100%; height: auto; display: block; } .main.welcome .news_main .news_box ul li a .tu { width: 100%; height: 231px; overflow: hidden; } .main.welcome .news_main .news_box ul li a .tu img { width: 100%; height: 100%; transition: all 0.5s; } .main.welcome .news_main .news_box ul li a .text { width: 100%; height: 85px; background: #f7f7f7; padding-top: 35px; transition: all 0.5s; } .main.welcome .news_main .news_box ul li a .text .year { width: 100px; height: auto; float: left; } .main.welcome .news_main .news_box ul li a .text .year .day { font-size: 50px; color: #666; text-align: center; font-family: Arial; line-height: 40px; transition: all 0.5s; } .main.welcome .news_main .news_box ul li a .text .year .month { font-size: 13px; color: #797979; text-align: center; font-family: Arial; transition: all 0.5s; } .main.welcome .news_main .news_box ul li a .text .con { float: left; width: 271px; height: auto; } .main.welcome .news_main .news_box ul li a .text .con .tit { font-size: 16px; transition: all 0.5s; color: #666; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .main.welcome .news_main .news_box ul li a .text .con .cont { font-size: 14px; color: #666; transition: all 0.5s; line-height: 24px; opacity: 0.5; } .main.about { width: 100%; height: auto; } .main.about .ab_box { width: 100%; height: auto; position: relative; } .main.about .ab_box .mask { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.3); } .main.about .ab_box .nav_box { width: 100%; height: 90px; background: rgba(0, 0, 0, 0.5); position: relative; z-index: 10; text-align: center; } .main.about .ab_box .nav_box a { font-size: 18px; color: #fff; padding: 0 8px; height: 90px; display: inline-block; line-height: 90px; vertical-align: middle; position: relative; transition: all 0.5s; } .main.about .ab_box .nav_box a.active { color: #d3780d; } .main.about .ab_box .nav_box a.active .bor { width: 100%; } .main.about .ab_box .nav_box a:hover { color: #d3780d; } .main.about .ab_box .nav_box a:hover .bor { width: 100%; } .main.about .ab_box .nav_box a > .bor { width: 0%; height: 2px; background: #d3780d; position: absolute; left: 0; display: block; bottom: 0; transition: all 0.5s; } .main.about .ab_box .nav_box > span { background: #fff; display: inline-block; vertical-align: middle; font-size: 0; width: 2px; margin: 0 45px; height: 18px; } .main.about .ab_box .cont { width: 1200px; height: auto; margin: 0 auto; position: relative; z-index: 10; padding-bottom: 247px; padding-top: 95px; } .main.about .ab_box .cont.js-m { transform: translateY(100px); opacity: 0; } .main.about .ab_box .cont .pic { width: 100%; height: auto; } .main.about .ab_box .cont .pic img { display: block; margin: 0 auto; width: 356px; height: 53px; } .main.about .ab_box .cont .company { width: 1180px; margin-left: auto; margin-right: 20px; height: 335px; font-size: 14px; margin-top: 100px; line-height: 30px; color: #fff; } .main.about .ab_box .cont .company p:last-child { padding-bottom: 0; } .main.about .ab_box .cont .company p { text-indent: 2em; padding-bottom: 23px; } .main.about .classification { width: 100%; height: auto; } .main.about .classification .tit { text-align: center; font-size: 40px; color: #fff; padding-top: 12px; font-weight: bold; } .main.about .classification .txt_w { text-align: center; font-size: 14px; color: #fff; padding-bottom: 35px; } .main.about .classification .classification_main { width: 100%; height: auto; padding-top: 5px; min-width: 1200px; text-align: center; } .main.about .classification .classification_main.fix { position: fixed; top: 100px; z-index: 110; background: url(../img/nnn.jpg) no-repeat; background-size: 100% 100%; } .main.about .classification .classification_main a { width: 167px; height: 53px; display: inline-block; text-align: center; font-size: 18px; color: #fff; background: url(../img/a2.jpg) no-repeat; background-size: 100% 100%; line-height: 53px; transition: all 0.5s; } @media (max-width: 1400px) { .main.about .classification .classification_main a { width: 160px; } } .main.about .classification .classification_main a:hover { background: #fff; color: #0067ac; transform: translateY(-5px); } .main.about .classification .classification_main a.cur { background: #fff; color: #0067ac; transform: translateY(-5px); } .main.about .idea { width: 100%; height: auto; padding-top: 100px; } .main.about .idea .ti { font-size: 40px; color: #666; text-align: center; } .main.about .idea .line { width: 35px; height: 2px; background: #0884d5; margin: 10px auto 0 auto; } .main.about .idea .container { width: 1065px; height: auto; margin: 0 auto; padding-bottom: 130px; } .main.about .idea .container .container_l { width: 300px; height: 300px; border-radius: 50%; border: 1px solid #fde7cd; float: left; margin-top: 55px; } .main.about .idea .container .container_l.js-m { transform: translateX(-200px); opacity: 0; } .main.about .idea .container .container_l img { border-radius: 50%; } .main.about .idea .container .container_r { width: 595px; height: auto; float: right; margin-right: 80px; font-size: 16px; color: #666; padding-top: 100px; line-height: 30px; } .main.about .idea .container .container_r.js-m { transform: translateX(200px); opacity: 0; } .main.about .idea .container .container_r p { text-indent: 2em; padding-bottom: 30px; } .main.about .history { width: 100%; height: auto; padding-bottom: 123px; padding-top: 55px; } .main.about .history .ti { font-size: 40px; color: #666; text-align: center; } .main.about .history .line { width: 35px; height: 2px; background: #0884d5; margin: 10px auto 0 auto; } .main.about .history .bj { width: 1064px; height: 353px; margin: 58px auto 0 auto; position: relative; overflow: hidden; } .main.about .history .bj ul { width: 20000px; height: 100%; position: relative; } .main.about .history .bj ul li { width: 1064px; float: left; height: 353px; background: url(../img/bj.png) no-repeat; } .main.about .history .bj ul li .pic { width: 424px; height: 294px; float: left; border: 1px solid #d6d7d7; border-radius: 10px; margin-top: 28px; margin-left: 127px; } .main.about .history .bj ul li .pic img { border-radius: 10px; } .main.about .history .bj ul li .con { float: left; width: 480px; margin-top: 80px; position: relative; right: 12px; bottom: 30px; } .main.about .history .bj ul li .con .year { font-size: 18px; color: #0884d5; text-align: center; } .main.about .history .bj ul li .con .co { font-size: 14px; color: #0884d5; text-align: center; } .main.about .history .bj .btn { display: inline-block; text-align: right; position: absolute; right: 12px; bottom: 30px; z-index: 10; } .main.about .history .bj .btn .btn_l { width: 46px; height: 46px; display: inline-block; margin: 0 2px; cursor: pointer; background: url(../img/jl.png) no-repeat center center #ddd; } .main.about .history .bj .btn .btn_l:hover { background: url(../img/jll.png) no-repeat center center #0884d5; } .main.about .history .bj .btn .btn_r { width: 46px; display: inline-block; height: 46px; margin: 0 2px; cursor: pointer; background: url(../img/jr.png) no-repeat center center #ddd; } .main.about .history .bj .btn .btn_r:hover { background: url(../img/jrr.png) no-repeat center center #0884d5; } .main.about .history .year { width: 100%; height: auto; text-align: center; position: relative; margin-top: 70px; } @media (max-width: 1400px) { .main.about .history .year .a_box a { margin: 0 30px; } } .main.about .history .year .border { width: 100%; height: 2px; background: #0884d5; position: absolute; left: 0; top: 50%; margin-top: -1px; } .main.about .history .year a { width: 55px; height: 26px; background: #0884d5; display: inline-block; color: #fff; font-size: 14px; position: relative; z-index: 2; margin: 0 65px; line-height: 26px; } .main.about .history .year a.cur { background: #f98700; } .main.about .system { width: 100%; height: auto; padding-bottom: 65px; padding-top: 55px; } .main.about .system .ti { font-size: 40px; color: #666; text-align: center; } .main.about .system .line { width: 35px; height: 2px; background: #0884d5; margin: 10px auto 0 auto; } .main.about .system .pic { width: 100%; margin-top: 50px; height: auto; } .main.about .system .pic img { margin: 0 auto; display: block; } .main.about .care { width: 100%; height: auto; padding-bottom: 120px; padding-top: 55px; background: #f2f2f2; } .main.about .care .ti { font-size: 40px; color: #666; text-align: center; } .main.about .care .line { width: 35px; height: 2px; background: #0884d5; margin: 10px auto 0 auto; } .main.about .care .txt_w { font-size: 14px; color: #666; text-align: center; padding-top: 25px; } .main.about .care .box { width: 1245px; height: 335px; margin: 63px auto 0 auto; min-width: 1200px; position: relative; } @media (max-width: 1300px) { .main.about .care .box { width: 1200px; } } .main.about .care .box .left { width: 27px; height: 51px; position: absolute; left: 0; top: 50%; margin-top: -25px; cursor: pointer; background: url(../img/left.png) no-repeat; } .main.about .care .box .left:hover { background: url(../img/left1.png) no-repeat; } .main.about .care .box .right { width: 27px; height: 51px; position: absolute; cursor: pointer; right: 0; top: 50%; background: url(../img/right.png) no-repeat; margin-top: -25px; transition: all 0.5s; } .main.about .care .box .right:hover { background: url(../img/right1.png) no-repeat; } .main.about .care .box .care_main { width: 1065px; height: 100%; margin: 0 auto; overflow: hidden; } .main.about .care .box .care_main ul { width: 2000px; height: 100%; position: relative; } .main.about .care .box .care_main ul li { width: 338px; height: 335px; margin-right: 27px; float: left; } .main.about .care .box .care_main ul li:hover .tu img { transform: scale(1.1); } .main.about .care .box .care_main ul li:hover .txt { background: #0884d5; color: #fff; } .main.about .care .box .care_main ul li .tu { width: 338px; height: 272px; overflow: hidden; } .main.about .care .box .care_main ul li .tu img { width: 100%; height: 100%; transition: all 0.5s; } .main.about .care .box .care_main ul li .txt { width: 100%; height: 63px; transition: all 0.5s; background: #e6e6e6; font-size: 16px; color: #666; text-align: center; line-height: 63px; } .main.about .culture { width: 100%; height: auto; padding-bottom: 95px; padding-top: 55px; } .main.about .culture .ti { font-size: 40px; color: #666; text-align: center; } .main.about .culture .line { width: 35px; height: 2px; background: #0884d5; margin: 10px auto 0 auto; } .main.about .culture .cont { width: 1015px; height: auto; padding-top: 52px; margin: 0 auto; } .main.about .culture .cont div { font-size: 16px; color: #666; } .main.about .culture .cont div span { color: #f18300; } .main.about .culture .cont div.co { padding-left: 85px; padding-right: 20px; overflow: hidden; } .main.about .culture .cont div.co span { color: #0884d5; float: left; font-weight: bold; } .main.about .culture .cont div.co .text { float: left; } .main.about .culture .content { width: 1065px; height: 460px; margin: 65px auto 0 auto; background: #f2f2f2; } .main.about .culture .content .tu { float: left; padding-top: 40px; position: relative; left: 43px; z-index: 10; width: 494px; height: 378px; overflow: hidden; } .main.about .culture .content .tu img { width: 100%; height: auto; } .main.about .culture .content .cont_r { width: 424px; height: 420px; padding-top: 40px; float: right; background: url(../img/bg8.jpg) no-repeat; padding-left: 92px; padding-right: 52px; } .main.about .culture .content .cont_r .box { width: 100%; height: 326px; overflow: hidden; } .main.about .culture .content .cont_r .box ul { position: relative; height: auto; } .main.about .culture .content .cont_r .box ul li { width: 100%; height: auto; padding-bottom: 25px; } .main.about .culture .content .cont_r .box ul li .ti2 { font-size: 18px; color: #fff; line-height: 28px; } .main.about .culture .content .cont_r .box ul li .co { font-size: 14px; color: #b4d4ed; line-height: 22px; } .main.about .culture .content .cont_r .box ul li .co span { color: #fff; } .main.about .culture .content .cont_r .btn { width: 100%; margin-top: 13px; height: auto; } .main.about .culture .content .cont_r .btn .prev { width: 40px; height: 36px; display: inline-block; transition: all 0.5s; cursor: pointer; background: url(../img/ssss.png) no-repeat center center #004674; } .main.about .culture .content .cont_r .btn .prev:hover { background: url(../img/ssss.png) no-repeat center center #f98700; } .main.about .culture .content .cont_r .btn .next { width: 40px; height: 36px; transition: all 0.5s; cursor: pointer; margin-left: 6px; display: inline-block; background: url(../img/xxxx.png) no-repeat center center #004674; } .main.about .culture .content .cont_r .btn .next:hover { background: url(../img/xxxx.png) no-repeat center center #f98700; } .main.about .style { width: 100%; height: auto; padding-bottom: 100px; background: #f2f2f2; padding-top: 55px; } .main.about .style .ti { font-size: 40px; color: #666; text-align: center; } .main.about .style .line { width: 35px; height: 2px; background: #0884d5; margin: 10px auto 0 auto; } .main.about .style .txt_w { font-size: 14px; color: #666; text-align: center; padding-top: 45px; } .main.about .style .fc { width: 1065px; height: auto; text-align: center; padding-top: 85px; margin: 0 auto; } .main.about .style .fc .tu1 { width: 322px; height: 322px; display: inline-block; } .main.about .style .fc .tu1.tu2, .main.about .style .fc .tu1.tu3 { margin-left: -45px; } .main.about .style .fc .tu1 img { width: 100%; height: 100%; border-radius: 50%; } .main.about .style .box { width: 1245px; height: 335px; margin: 63px auto 0 auto; min-width: 1200px; position: relative; } @media (max-width: 1300px) { .main.about .style .box { width: 1200px; } } .main.about .style .box .left { width: 27px; height: 51px; position: absolute; left: 0; top: 50%; margin-top: -25px; cursor: pointer; background: url(../img/left.png) no-repeat; } .main.about .style .box .left:hover { background: url(../img/left1.png) no-repeat; } .main.about .style .box .right { width: 27px; height: 51px; position: absolute; cursor: pointer; right: 0; top: 50%; background: url(../img/right.png) no-repeat; margin-top: -25px; transition: all 0.5s; } .main.about .style .box .right:hover { background: url(../img/right1.png) no-repeat; } .main.about .style .box .care_main2 { width: 1065px; height: 100%; margin: 0 auto; overflow: hidden; } .main.about .style .box .care_main2 ul { width: 2000px; height: 100%; position: relative; } .main.about .style .box .care_main2 ul li { width: 335px; height: 335px; margin-right: 27px; float: left; } .main.about .style .box .care_main2 ul li .tu { width: 335px; height: 335px; overflow: hidden; border-radius: 50%; } .main.about .style .box .care_main2 ul li .tu img { width: 100%; border-radius: 50%; height: 100%; } .main.about .honor { width: 100%; height: auto; overflow: hidden; padding-top: 100px; } .main.about .honor .ti { font-size: 40px; color: #666; text-align: center; } .main.about .honor .ti.js-m { transform: translateX(-200px); opacity: 0; } .main.about .honor .line { width: 35px; height: 2px; background: #0884d5; margin: 10px auto 0 auto; } .main.about .honor .line.js-m { transform: translateX(200px); opacity: 0; } .main.about .honor .caroursel { width: 1065px; height: 365px; position: relative; margin: 100px auto 190px auto; } .main.about .honor .caroursel .caroursel_main { width: 790px; margin: 0 auto; overflow: hidden; height: 100%; } .main.about .honor .caroursel .caroursel_main ul { width: 100%; height: auto; position: relative; } .main.about .honor .caroursel .caroursel_main ul li { width: 266px; height: 344px; box-shadow: 8px 8px 8px #d6d6d6; border: 3px solid #fcc37f; position: absolute; left: 1000px; top: 0; } .main.about .honor .caroursel .caroursel_main ul li img { width: 100%; height: 100%; } .main.about .honor .caroursel .left { width: 27px; height: 51px; position: absolute; left: 0; top: 50%; margin-top: -25px; cursor: pointer; background: url(../img/left.png) no-repeat; } .main.about .honor .caroursel .left:hover { background: url(../img/left1.png) no-repeat; } .main.about .honor .caroursel .right { width: 27px; height: 51px; position: absolute; cursor: pointer; right: 0; top: 50%; background: url(../img/right.png) no-repeat; margin-top: -25px; transition: all 0.5s; } .main.about .honor .caroursel .right:hover { background: url(../img/right1.png) no-repeat; } .main.about .market { width: 100%; height: auto; padding-top: 58px; padding-bottom: 75px; } .main.about .market .ti { font-size: 40px; color: #666; text-align: center; } .main.about .market .ti.js-m { transform: translateX(-200px); opacity: 0; } .main.about .market .line { width: 35px; height: 2px; background: #0884d5; margin: 10px auto 0 auto; } .main.about .market .line.js-m { transform: translateX(200px); opacity: 0; } .main.about .market .market_main { width: 1065px; height: auto; margin: 0 auto; } .main.about .market .market_main ul { width: 100%; height: auto; margin-top: 123px; } .main.about .market .market_main ul li { width: 626px; height: 183px; margin-left: 120px; margin-top: 7px; background: url(../img/111.png) no-repeat; } .main.about .market .market_main ul li.js-m { transform: translateX(-200px); opacity: 0; } .main.about .market .market_main ul li.two { margin-left: 275px; } .main.about .market .market_main ul li.two.js-m { transform: translateX(200px); opacity: 0; } .main.about .market .market_main ul li.two .cont { float: right; margin-left: none; margin-right: -20px; background: url(../img/n2.png) no-repeat; } .main.about .market .market_main ul li.two .txt_w { color: #0884d5; margin-left: 130px; } .main.about .market .market_main ul li.three .cont { background: url(../img/n3.png) no-repeat; } .main.about .market .market_main ul li.three .txt_w { color: #dd9213; } .main.about .market .market_main ul li .cont { width: 220px; height: 194px; padding-top: 20px; margin-top: -30px; float: left; margin-left: -20px; background: url(../img/n1.png) no-repeat; } .main.about .market .market_main ul li .cont .num { font-size: 40px; color: #fff; text-align: center; line-height: 62px; } .main.about .market .market_main ul li .cont .txt { font-size: 30px; color: #fff; text-align: center; line-height: 40px; } .main.about .market .market_main ul li .txt_w { float: left; font-size: 18px; color: #f4815d; line-height: 30px; padding-top: 20px; margin-left: 40px; font-weight: bold; } .main.about .production { width: 100%; height: auto; padding-top: 55px; padding-bottom: 200px; overflow: hidden; } .main.about .production .ti { font-size: 40px; color: #666; text-align: center; } .main.about .production .ti.js-m { transform: translateX(-200px); opacity: 0; } .main.about .production .line { width: 35px; height: 2px; background: #0884d5; margin: 10px auto 0 auto; } .main.about .production .line.js-m { transform: translateX(200px); opacity: 0; } .main.about .production .txt_w { font-size: 14px; color: #666; text-align: center; padding-top: 27px; } .main.about .production .txt_w.js-m { transform: translateX(200px); opacity: 0; } .main.about .production .production_main { width: 100%; height: auto; min-width: 1200px; margin-top: 100px; position: relative; } .main.about .production .production_main .page_l { width: 50px; height: 100%; position: absolute; left: 0; top: 0; cursor: pointer; z-index: 100; background: url(../img/left2.png) no-repeat center center rgba(0, 0, 0, 0.7); } .main.about .production .production_main .page_r { width: 50px; height: 100%; position: absolute; right: 0; top: 0; z-index: 100; cursor: pointer; background: url(../img/right2.png) no-repeat center center rgba(0, 0, 0, 0.7); } .main.about .production .production_main ul { width: 100%; overflow: hidden; position: relative; height: auto; } .main.about .production .production_main ul li { height: auto; margin-right: 8px; float: left; transition: all 0.5s; position: relative; } .main.about .production .production_main ul li:hover { transform: scale(1.1); z-index: 10; } .main.about .production .production_main ul li:hover .mask { display: none; } .main.about .production .production_main ul li:hover .cont .ico, .main.about .production .production_main ul li:hover .cont .text { opacity: 0; } .main.about .production .production_main ul li:hover .box { opacity: 1; transform: scale(1); } .main.about .production .production_main ul li:hover .line { opacity: 0; } .main.about .production .production_main ul li .pic { width: 100%; height: auto; overflow: hidden; } .main.about .production .production_main ul li .box { width: 100%; height: 50px; text-align: center; font-size: 16px; color: #0884d5; position: absolute; left: 0; bottom: 40px; background: url(../img/cbg.png) no-repeat; line-height: 50px; opacity: 0; transform: scale(0.7); transition: all 0.7s; } .main.about .production .production_main ul li .mask { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.4); } .main.about .production .production_main ul li .cont { position: absolute; left: 0; top: 42%; margin-top: -54px; width: 100%; height: auto; text-align: center; } .main.about .production .production_main ul li .cont .ico img { display: block; margin: 0 auto; } .main.about .production .production_main ul li .cont > .line { width: 20px !important; height: 4px !important; background: #fff !important; margin: 20px auto; } .main.about .production .production_main ul li .cont .text { font-size: 20px; color: #fff; transition: all 0.5s; text-align: center; padding-top: 10px; } .main.news { width: 100%; height: auto; } .main.news .nav_box { width: 100%; height: 90px; background: rgba(0, 0, 0, 0.5); text-align: center; position: relative; } .main.news .nav_box a { font-size: 18px; color: #fff; padding: 0 8px; height: 90px; display: inline-block; line-height: 90px; vertical-align: middle; position: relative; transition: all 0.5s; } .main.news .nav_box a.active { color: #d3780d; } .main.news .nav_box a.active .bor { width: 100%; } .main.news .nav_box a:hover { color: #d3780d; } .main.news .nav_box a:hover .bor { width: 100%; } .main.news .nav_box a > .bor { width: 0%; height: 2px; background: #d3780d; position: absolute; left: 0; display: block; bottom: 0; transition: all 0.5s; } .main.news .nav_box > span { background: #fff; display: inline-block; vertical-align: middle; font-size: 0; width: 2px; margin: 0 45px; height: 18px; } .main.news .banner2 { width: 100%; height: 500px; position: relative; } .main.news .banner2 .pic { display: inline-block; position: absolute; left: 50%; top: 50%; margin-top: -26.5px; margin-left: -146.5px; height: auto; } .main.news .banner2 .pic img { display: block; width: 293px; height: 53px; margin: 0 auto; } .main.news .banner2 > .nav_box { width: 100%; height: 90px; background: rgba(0, 0, 0, 0.5); text-align: center; position: absolute; left: 0; bottom: 0; } .main.news .banner2 > .nav_box a { font-size: 18px; color: #fff; padding: 0 8px; height: 90px; display: inline-block; line-height: 90px; vertical-align: middle; position: relative; transition: all 0.5s; } .main.news .banner2 > .nav_box a.active { color: #d3780d; } .main.news .banner2 > .nav_box a.active .bor { width: 100%; } .main.news .banner2 > .nav_box a:hover { color: #d3780d; } .main.news .banner2 > .nav_box a:hover .bor { width: 100%; } .main.news .banner2 > .nav_box a > .bor { width: 0%; height: 2px; background: #d3780d; position: absolute; left: 0; display: block; bottom: 0; transition: all 0.5s; } .main.news .banner2 > .nav_box > span { background: #fff; display: inline-block; vertical-align: middle; font-size: 0; width: 2px; margin: 0 45px; height: 18px; } .main.news .tit { font-size: 39px; color: #fff; padding-top: 62px; text-align: center; } .main.news .position { width: 100%; height: 82px; border-bottom: 1px solid #d9d9d9; } .main.news .position .position_cen { width: 1200px; height: 100%; margin: 0 auto; font-size: 14px; color: #666; line-height: 82px; } .main.news .position .position_cen a { color: #666; } .main.news .position .position_cen a:hover { color: #0884d5; } .main.news .position .position_cen img { margin: 0 15px; } .main.news .position .position_cen span { color: #0884d5; } .main.news .detail { width: 1065px; height: auto; margin: 0 auto; padding-top: 40px; } .main.news .detail .title { width: 100%; height: auto; border-bottom: 1px solid #e5e5e5; padding-bottom: 35px; } .main.news .detail .title .t { font-size: 24px; color: #333; text-align: center; } .main.news .detail .title .mes { text-align: center; padding-top: 10px; } .main.news .detail .title .mes span { font-size: 12px; color: #999; display: inline-block; margin: 0 20px; } .main.news .detail .title .mes span.time { background: url(../img/time.png) no-repeat left center; padding-left: 20px; } .main.news .detail .title .mes span.source { background: url(../img/ly.png) no-repeat left center; padding-left: 20px; } .main.news .detail .title .mes span.number { background: url(../img/read.png) no-repeat left center; padding-left: 24px; } .main.news .detail .content { width: 100%; height: auto; font-size: 12px; color: #999; padding-bottom: 140px; padding-top: 15px; } .main.news .detail .content img { max-width: 100%; } .main.news .detail .content p { text-indent: 1em; line-height: 28px; padding-top: 28px; } .main.news .detail .content .tu { width: 100%; height: auto; margin-top: 35px; } .main.news .detail .content .tu img { display: block; margin: 0 auto; } .main.news .detail .content .txt { font-size: 14px; color: #666; text-align: center; padding-top: 8px; } .main.news .detail .content .back { width: 100%; height: auto; margin-top: 100px; } .main.news .detail .content .back div { width: 50%; } .main.news .detail .content .back div a { color: #666; font-size: 16px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .main.news .detail .content .back div a:hover { color: #0884d5; } .main.news .detail .content .back div a span { color: #666; } .main.news .detail .content .return { width: 202px; height: 45px; background: #0884d5; font-size: 16px; cursor: pointer; color: #fff; display: block; text-align: center; line-height: 45px; margin: 22px auto 0 auto; } .main.news .line { width: 35px; height: 3px; background: #fff; margin: 9px auto 0 auto; } .main.news .news_box { width: 1065px; height: auto; margin: 0 auto; padding-top: 70px; } .main.news .news_box ul { width: 100%; height: auto; } .main.news .news_box ul li:nth-child(even).js-m { transform: translateX(-200px); opacity: 0; } .main.news .news_box ul li { width: 100%; margin-bottom: 27px; height: 195px; } .main.news .news_box ul li.js-m { transform: translateX(200px); opacity: 0; } .main.news .news_box ul li:hover a { background: url(../img/2.png) no-repeat; transform: translateX(-20px); } .main.news .news_box ul li:hover a .tu img { transform: scale(1.1); } .main.news .news_box ul li:hover a .year .month, .main.news .news_box ul li:hover a .year .y { color: #666; } .main.news .news_box ul li:hover a .cont .ti, .main.news .news_box ul li:hover a .cont .con { color: #666; } .main.news .news_box ul li a { width: 100%; background: rgba(0, 0, 0, 0.5); height: 100%; display: block; transition: transform 0.5s; } .main.news .news_box ul li a .year { float: left; margin-left: 20px; padding-top: 35px; } .main.news .news_box ul li a .year .month { font-size: 30px; color: #ccc; line-height: 40px; } .main.news .news_box ul li a .year .y { font-size: 16px; color: #ccc; } .main.news .news_box ul li a .cont { float: left; width: 625px; height: auto; padding-top: 25px; margin-left: 65px; } .main.news .news_box ul li a .cont .ti { font-size: 25px; color: #ccc; } .main.news .news_box ul li a .cont .con { font-size: 16px; color: #ccc; line-height: 26px; } .main.news .news_box ul li a .tu { width: 187px; height: 142px; float: right; margin-right: 22px; overflow: hidden; margin-top: 27px; } .main.news .news_box ul li a .tu img { width: 100%; transition: all 0.5s; height: 100%; } .main.news .page2 { width: 100%; height: auto; padding-top: 50px; padding-bottom: 130px; } .main.news .page2 img { display: block; margin: 0 auto; } .main.service { width: 100%; height: auto; } .main.service .banner2 { width: 100%; height: 500px; position: relative; text-align: center; } .main.service .banner2 .wrap2 { display: inline-block; } .main.service .banner2 .wrap2 .pic { position: relative; z-index: 4; margin-top: 160px; } .main.service .banner2 .wrap2 .pic img { display: block; margin: 0 auto; width: 278px; height: 90px; } .main.service .banner2 .wrap2 .descript { font-size: 32px; color: #f98700; text-align: center; position: relative; z-index: 4; padding-top: 5px; } .main.service .classification { width: 100%; height: auto; } .main.service .classification .tit { text-align: center; font-size: 40px; color: #fff; padding-top: 12px; font-weight: bold; } .main.service .classification .txt_w { text-align: center; font-size: 14px; color: #fff; padding-bottom: 35px; } .main.service .classification .classification_main { width: 100%; height: auto; padding-top: 5px; text-align: center; } .main.service .classification .classification_main.fix { position: fixed; top: 100px; z-index: 110; background: url(../img/nnn.jpg) no-repeat; background-size: 100% 100%; } .main.service .classification .classification_main a { width: 167px; height: 53px; display: inline-block; text-align: center; font-size: 18px; color: #fff; background: url(../img/a2.jpg) no-repeat; line-height: 53px; transition: all 0.5s; } .main.service .classification .classification_main a:hover { background: #fff; color: #0067ac; transform: translateY(-5px); } .main.service .classification .classification_main a.cur { background: #fff; color: #0067ac; transform: translateY(-5px); } .main.service .after-sale { width: 100%; height: auto; padding-top: 55px; } .main.service .after-sale .tit { font-size: 40px; color: #666; text-align: center; } .main.service .after-sale .tit.js-m { transform: translateX(-200px); opacity: 0; } .main.service .after-sale .line { width: 35px; height: 2px; background: #0884d5; margin: 6px auto 0 auto; } .main.service .after-sale .line.js-m { transform: translateX(200px); opacity: 0; } .main.service .after-sale .box { width: 1065px; height: auto; margin: 0 auto; padding-top: 85px; } .main.service .after-sale .box ul { width: 100%; height: auto; } .main.service .after-sale .box ul li:last-child { margin-right: 0; } .main.service .after-sale .box ul li { width: 250px; float: left; background: #fff; margin-right: 20px; transition: background-color 1s,height 3s; } .main.service .after-sale .box ul li:hover { background: #0884d5; height: 312px; } .main.service .after-sale .box ul li:hover .ico .border { border: none; } .main.service .after-sale .box ul li:hover .ico .img_box { background: url(../img/b.png) no-repeat center center; } .main.service .after-sale .box ul li:hover .ico .img_box.img2 { background: url(../img/kfw.png) no-repeat center center; } .main.service .after-sale .box ul li:hover .ico .img_box.img3 { background: url(../img/sf.png) no-repeat center center; } .main.service .after-sale .box ul li:hover .ico .img_box.img4 { background: url(../img/x.png) no-repeat center center; } .main.service .after-sale .box ul li:hover .text { color: #fff; } .main.service .after-sale .box ul li:hover .con { display: block; transform: translateY(0px); } .main.service .after-sale .box ul li .ico { width: 120px; height: 120px; margin: 0 auto; position: relative; } .main.service .after-sale .box ul li .ico .img_box { width: 120px; height: 120px; transition: all 0.5s; background: url(../img/bao.png) no-repeat center center; } .main.service .after-sale .box ul li .ico .img_box.img2 { background: url(../img/kf.png) no-repeat center center; } .main.service .after-sale .box ul li .ico .img_box.img3 { background: url(../img/lc.png) no-repeat center center; } .main.service .after-sale .box ul li .ico .img_box.img4 { background: url(../img/wex.png) no-repeat center center; } .main.service .after-sale .box ul li .ico .border { border: 4px solid #0884d5; width: 112px; height: 112px; position: absolute; left: 0; top: 0; border-radius: 50%; } .main.service .after-sale .box ul li .text { font-size: 20px; color: #0884d5; text-align: center; padding-top: 10px; transition: all 0.5s; } .main.service .after-sale .box ul li .con { font-size: 12px; color: #fff; padding-top: 10px; display: none; transition: all 0.5s; transform: translateY(50px); text-align: center; } .main.service .after-sale .content { width: 1065px; height: auto; margin: 0 auto; font-size: 14px; color: #666; text-align: center; padding-top: 35px; padding-bottom: 110px; } .main.service .problem { width: 100%; height: auto; } .main.service .problem .problem_cen { width: 1065px; height: auto; margin: 0 auto; padding-top: 40px; padding-bottom: 78px; } .main.service .problem .problem_cen .tit { font-size: 40px; color: #666; text-align: center; } .main.service .problem .problem_cen .tit.js-m { transform: translateX(-200px); opacity: 0; } .main.service .problem .problem_cen .line { width: 35px; height: 2px; background: #0884d5; margin: 6px auto 0 auto; } .main.service .problem .problem_cen .line.js-m { transform: translateX(200px); opacity: 0; } .main.service .problem .problem_cen .classification2 { width: 100%; height: auto; text-align: center; margin-top: 30px; } .main.service .problem .problem_cen .classification2 a { display: inline-block; font-size: 14px; color: #666; background: #fff; width: 105px; text-align: center; margin: 0 5px; height: 35px; line-height: 35px; transition: all 0.5s; } .main.service .problem .problem_cen .classification2 a.current { background: #0884d5; color: #fff; } .main.service .problem .problem_cen .classification2 a:hover { background: #0884d5; color: #fff; } .main.service .problem .problem_cen .wrap { width: 100%; height: auto; padding-top: 30px; } .main.service .problem .problem_cen .wrap ul { width: 100%; height: auto; } .main.service .problem .problem_cen .wrap ul li { width: 1063px; border: 1px solid #e4e4e4; height: auto; background: #fff; border-radius: 25px; margin-top: 20px; } .main.service .problem .problem_cen .wrap ul li .questions { padding-left: 40px; height: auto; border-bottom: 1px solid #e4e4e4; padding-right: 55px; font-size: 18px; height: 85px; line-height: 85px; color: #666; cursor: pointer; } .main.service .problem .problem_cen .wrap ul li .questions span { font-size: 25px; color: #f98700; display: inline-block; vertical-align: top; margin-right: 15px; } .main.service .problem .problem_cen .wrap ul li .answer { padding-left: 40px; height: auto; margin: 12px 0; padding-right: 55px; display: none; overflow: hidden; } .main.service .problem .problem_cen .wrap ul li .answer.show { display: block; } .main.service .problem .problem_cen .wrap ul li .answer span { font-size: 25px; color: #0884d5; display: block; float: left; margin-right: 15px; } .main.service .problem .problem_cen .wrap ul li .answer .txt { float: left; font-size: 16px; width: 928px; color: #666; padding-top: 8px; line-height: 36px; } .main.service .download { width: 100%; height: auto; padding-top: 55px; padding-bottom: 100px; } .main.service .download .tit { font-size: 40px; color: #666; text-align: center; } .main.service .download .tit.js-m { transform: translateX(-200px); opacity: 0; } .main.service .download .line { width: 35px; height: 2px; background: #0884d5; margin: 6px auto 0 auto; } .main.service .download .line.js-m { transform: translateX(200px); opacity: 0; } .main.service .download .data { width: 100%; height: auto; text-align: center; padding-top: 43px; position: relative; z-index: 100; } .main.service .download .data .item { display: inline-block; width: 105px; height: 35px; font-size: 14px; color: #666; text-align: center; line-height: 35px; margin: 0 5px; position: relative; } .main.service .download .data .item.cur > a { color: #fff; background: #0884d5; } .main.service .download .data .item:hover > a { color: #fff; background: #0884d5; } .main.service .download .data .item:hover ul { display: block; } .main.service .download .data .item > a { width: 105px; height: 35px; display: block; background: #e5e5e5; color: #666; transition: all 0.5s; } .main.service .download .data .item ul { width: 103px; height: auto; border: 1px solid #0884d5; border-top: none; padding-top: 15px; display: none; position: absolute; left: 0; background: #fff; top: 35px; } .main.service .download .data .item ul li { width: 100%; height: 25px; font-size: 12px; color: #666; line-height: 25px; margin-bottom: 10px; } .main.service .download .data .item ul li a { width: 100%; height: 100%; display: block; color: #666; transition: all 0.5s; text-align: center; } .main.service .download .data .item ul li a:hover { background: #0884d5; color: #fff; } .main.service .download .container { width: 1065px; height: auto; overflow: hidden; margin: 60px auto 0 auto; } .main.service .download .container ul { width: 110%; height: auto; } .main.service .download .container ul li { width: 350px; height: 138px; margin-top: 30px; border: 1px solid #ededed; margin-right: 4px; float: left; } .main.service .download .container ul li:hover a { background: #0884d5; } .main.service .download .container ul li:hover a .img_box .bg { background: #fff; } .main.service .download .container ul li:hover a .cont .tit2, .main.service .download .container ul li:hover a .cont .descript { color: #fff; } .main.service .download .container ul li:hover a .cont .message .down { color: #fff; opacity: 0.6; background: url(../img/xzz.png) no-repeat left center; } .main.service .download .container ul li:hover a .cont .message .date { color: #fff; opacity: 0.6; background: url(../img/time3.png) no-repeat left center; } .main.service .download .container ul li a { width: 100%; height: 100%; display: block; color: #666; transition: all 0.5s; } .main.service .download .container ul li a .img_box { width: 135px; height: 108px; float: left; margin-top: 15px; margin-left: 15px; position: relative; } .main.service .download .container ul li a .img_box .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #fafafa; transition: all 0.5s; } .main.service .download .container ul li a .img_box .pic { width: 100%; height: 100%; position: relative; z-index: 10; text-align: center; line-height: 108px; } .main.service .download .container ul li a .img_box .pic img { max-width: 100%; max-height: 100%; display: inline-block; vertical-align: middle; } .main.service .download .container ul li a .cont { width: 167px; height: 108px; position: relative; float: left; padding-top: 20px; margin-left: 20px; } .main.service .download .container ul li a .cont .tit2 { font-size: 14px; color: #666; transition: all 0.5s; } .main.service .download .container ul li a .cont .descript { font-size: 12px; color: #999; transition: all 0.5s; line-height: 20px; } .main.service .download .container ul li a .cont .message { width: 100%; height: auto; position: absolute; left: 0; bottom: 0; } .main.service .download .container ul li a .cont .message .down { background: url(../img/xz.png) no-repeat left center; font-size: 12px; color: #999; padding-left: 25px; float: left; transition: all 0.5s; } .main.service .download .container ul li a .cont .message .date { background: url(../img/time2.png) no-repeat left center; font-size: 12px; color: #999; padding-left: 25px; transition: all 0.5s; float: right; } .main.service .download .more { width: 203px; height: 45px; background: #0884d5; color: #fff; text-align: center; line-height: 45px; clear: both; margin: 80px auto 0 auto; font-size: 16px; cursor: pointer; } .main.service .consultation { width: 100%; padding-top: 12px; height: auto; padding-bottom: 45px; margin-bottom: 85px; } .main.service .consultation .tit { font-size: 40px; color: #666; text-align: center; } .main.service .consultation .tit.js-m { transform: translateX(-200px); opacity: 0; } .main.service .consultation .line { width: 35px; height: 2px; background: #0884d5; margin: 6px auto 0 auto; } .main.service .consultation .line.js-m { transform: translateX(200px); opacity: 0; } .main.service .consultation .form { width: 945px; height: auto; margin: 0 auto; padding-top: 55px; } .main.service .consultation .form .mess { width: 100%; height: auto; margin-top: 20px; } .main.service .consultation .form .mess .name { height: auto; float: left; width: 435px; } .main.service .consultation .form .mess .name.name2 { float: right; } .main.service .consultation .form .mess .name label { float: left; font-size: 14px; color: #666; width: 70px; text-align: right; display: block; line-height: 40px; height: 40px; padding-right: 15px; } .main.service .consultation .form .mess .name .input { width: 345px; float: right; height: 37px; font-size: 14px; color: #666; line-height: 37px; border: 1px solid #dcdcdc; border-radius: 5px; position: relative; background: #fff; } .main.service .consultation .form .mess .name .input input { width: 304px; height: 35px; border: none; font-size: 14px; color: #666; border-radius: 5px; background: url(../img/ll.png) no-repeat right center; text-indent: 1em; } .main.service .consultation .form .mess .name .input select { width: 345px; height: 37px; font-size: 14px; color: #999; line-height: 37px; border: none; border-radius: 5px; background: url(../img/xxl.png) no-repeat 322px center; } .main.service .consultation .form .mess .name .input .l { background: url(../img/ll.png) no-repeat right center; position: absolute; left: 304px; top: 8px; width: 2px; height: 21px; } .main.service .consultation .form .mess .name .input .ico { width: 40px; height: 22px; background: url(../img/dw.png) no-repeat center center; position: absolute; right: 0; top: 7.5px; } .main.service .consultation .form .mess .name .input .ico.ico2 { background: url(../img/peo.png) no-repeat center center; } .main.service .consultation .form .mess .name .input .ico.ico-email { background: url(../img/em2.png) no-repeat center center; } .main.service .consultation .form .mess .name .input .ico.ico-product { background: url(../img/p.png) no-repeat center center; } .main.service .consultation .form .mess .name .input .ico.ico-qq { background: url(../img/q.png) no-repeat center center; } .main.service .consultation .form .mess .name .input .ico.ico3 { background: url(../img/add.png) no-repeat center center; } .main.service .consultation .form .mess .name .input .ico.ico4 { background: url(../img/tel.png) no-repeat center center; } .main.service .consultation .form .mess textarea { width: 850px; height: 185px; font-size: 14px; color: #666; border-radius: 5px; float: right; display: block; border: 1px solid #dcdcdc; resize: none; text-indent: 1em; } .main.service .consultation .form .submit { width: 100%; height: auto; text-align: center; margin-top: 35px; } .main.service .consultation .form .submit input { width: 200px; height: 38px; background: #0884d5; border: none; font-size: 16px; color: #fff; display: inline-block; text-align: center; line-height: 38px; } .main.contact { width: 100%; height: auto; } .main.contact .banner2 { width: 100%; height: 500px; position: relative; } .main.contact .banner2 > .nav_box { width: 100%; height: 90px; background: rgba(0, 0, 0, 0.5); text-align: center; position: absolute; left: 0; bottom: 0; } .main.contact .banner2 > .nav_box.fix { position: fixed; top: 100px; z-index: 110; } .main.contact .banner2 > .nav_box a { font-size: 18px; color: #fff; padding: 0 8px; height: 90px; display: inline-block; line-height: 90px; vertical-align: middle; position: relative; transition: all 0.5s; } .main.contact .banner2 > .nav_box a.active { color: #d3780d; } .main.contact .banner2 > .nav_box a.active .bor { width: 100%; } .main.contact .banner2 > .nav_box a:hover { color: #d3780d; } .main.contact .banner2 > .nav_box a:hover .bor { width: 100%; } .main.contact .banner2 > .nav_box a > .bor { width: 0%; height: 2px; background: #d3780d; position: absolute; left: 0; display: block; bottom: 0; transition: all 0.5s; } .main.contact .banner2 > .nav_box > span { background: #fff; display: inline-block; vertical-align: middle; font-size: 0; width: 2px; margin: 0 45px; height: 18px; } .main.contact .banner2 .pic { width: 100%; height: auto; padding-top: 205px; } .main.contact .banner2 .pic img { width: 381px; height: 53px; margin: 0 auto; display: block; } .main.contact .operator { width: 100%; height: auto; padding-top: 55px; padding-bottom: 110px; } .main.contact .operator .tit { font-size: 40px; color: #666; text-align: center; } .main.contact .operator .tit.js-m { transform: translateX(-200px); opacity: 0; } .main.contact .operator .line { width: 35px; height: 2px; background: #0884d5; margin: 6px auto 0 auto; } .main.contact .operator .line.js-m { transform: translateX(200px); opacity: 0; } .main.contact .operator .form { width: 945px; height: auto; margin: 0 auto; padding-top: 55px; } .main.contact .operator .form .mess { width: 100%; height: auto; margin-top: 30px; } .main.contact .operator .form .mess .name { height: auto; float: left; width: 435px; } .main.contact .operator .form .mess .name.name2 { float: right; } .main.contact .operator .form .mess .name label { float: left; font-size: 14px; color: #666; width: 70px; text-align: right; display: block; line-height: 40px; height: 40px; padding-right: 15px; } .main.contact .operator .form .mess .name .input { width: 345px; float: right; height: 37px; font-size: 14px; color: #666; line-height: 37px; border: 1px solid #dcdcdc; border-radius: 5px; position: relative; } .main.contact .operator .form .mess .name .input input { width: 304px; height: 35px; border: none; font-size: 14px; color: #666; border-radius: 5px; background: url(../img/ll.png) no-repeat right center; text-indent: 1em; } .main.contact .operator .form .mess .name .input .ico { width: 40px; height: 22px; background: url(../img/dw.png) no-repeat center center; position: absolute; right: 0; top: 7.5px; } .main.contact .operator .form .mess .name .input .ico.ico2 { background: url(../img/peo.png) no-repeat center center; } .main.contact .operator .form .mess .name .input .ico.ico3 { background: url(../img/add.png) no-repeat center center; } .main.contact .operator .form .mess .name .input .ico.ico4 { background: url(../img/tel.png) no-repeat center center; } .main.contact .operator .form .submit { width: 200px; height: 40px; display: block; font-size: 16px; color: #fff; text-align: center; line-height: 40px; background: #0884d5; border: none; cursor: pointer; margin: 70px auto 0 auto; } .main.contact .recruit { width: 100%; height: auto; padding-top: 35px; padding-bottom: 160px; } .main.contact .recruit .tit { font-size: 40px; color: #666; text-align: center; } .main.contact .recruit .tit.js-m { transform: translateX(-200px); opacity: 0; } .main.contact .recruit .line { width: 35px; height: 2px; background: #0884d5; margin: 6px auto 0 auto; } .main.contact .recruit .line.js-m { transform: translateX(200px); opacity: 0; } .main.contact .recruit .box { width: 1065px; height: auto; margin: 0 auto; padding-top: 50px; } .main.contact .recruit .box ul { width: 100%; height: auto; } .main.contact .recruit .box ul li { width: 100%; height: auto; border-bottom: 1px solid #fff; padding-bottom: 10px; margin-bottom: 20px; } .main.contact .recruit .box ul li.active .ti { background: #0884d5; } .main.contact .recruit .box ul li.active .ti .fl { color: #fff; } .main.contact .recruit .box ul li.active .ti .fr { background: url(../img/jian3.png) no-repeat right center; } .main.contact .recruit .box ul li .ti { width: 1025px; height: 70px; background: #fff; padding: 0 20px; line-height: 70px; cursor: pointer; } .main.contact .recruit .box ul li .ti .fl { font-size: 16px; color: #666; } .main.contact .recruit .box ul li .ti .fr { background: url(../img/jia.png) no-repeat right center; width: 16px; height: 70px; } .main.contact .recruit .box ul li .message { padding: 0 18px; width: 1029px; height: auto; display: none; } .main.contact .recruit .box ul li .message.show { display: block; } .main.contact .recruit .box ul li .message .zw { font-size: 16px; color: #666; padding-top: 22px; } .main.contact .recruit .box ul li .message .zw span { color: #333; } .main.contact .recruit .box ul li .message .tit2 { font-size: 14px; color: #333333; padding-top: 10px; padding-bottom: 5px; } .main.contact .recruit .box ul li .message p { font-size: 12px; color: #666; padding-top: 3px; } .main.contact .recruit .box ul li .message .apply { width: 122px; height: 37px; text-align: center; line-height: 37px; font-size: 16px; color: #fff; background: #0884d5; display: block; margin-bottom: 15px; margin-top: 25px; } .main.contact .us { width: 100%; height: auto; padding-top: 35px; padding-bottom: 170px; } .main.contact .us .tit { font-size: 40px; color: #666; text-align: center; } .main.contact .us .tit.js-m { transform: translateX(-200px); opacity: 0; } .main.contact .us .line { width: 35px; height: 2px; background: #0884d5; margin: 6px auto 0 auto; } .main.contact .us .line.js-m { transform: translateX(200px); opacity: 0; } .main.contact .us .information { width: 940px; height: auto; margin: 0 auto; padding-top: 40px; } .main.contact .us .information div { font-size: 18px; color: #666; float: left; min-width: 270px; padding-left: 40px; margin-top: 20px; } .main.contact .us .information div span { color: #0884d5; } .main.contact .us .information div.qq { background: url(../img/qq.png) no-repeat left center; } .main.contact .us .information div.tel { background: url(../img/tel2.png) no-repeat left center; } .main.contact .us .information div.email { background: url(../img/em.png) no-repeat left center; } .main.contact .us .information div.wx { background: url(../img/wx.png) no-repeat left center; } .main.contact .us .information div.address { background: url(../img/address.png) no-repeat left center; } .main.contact .us #map { width: 1065px; height: 500px; margin: 0 auto; margin-top: 70px; } .main.contact .us #map .anchorBL { display: none; } .main.solution { width: 100%; height: auto; } .main.solution .banner2 { width: 100%; height: 600px; text-align: center; position: relative; } .main.solution .banner2 .wrap2 { display: inline-block; } .main.solution .banner2 .wrap2 .pic { position: relative; z-index: 4; margin-top: 200px; } .main.solution .banner2 .wrap2 .pic img { display: block; margin: 0 auto; width: 494px; height: 75px; } .main.solution .banner2 .wrap2 .descript { font-size: 28px; color: #fff; text-align: center; position: relative; z-index: 4; padding-top: 5px; opacity: 0.8; } .main.solution .banner2 .wrap2 .line { width: 50px; height: 2px; background: #fff; position: relative; z-index: 4; margin-top: 8px; } .main.solution .banner2 .wrap2 .more { width: 152px; height: 60px; background: #f98700; text-align: center; line-height: 60px; display: block; font-size: 22px; color: #fff; margin-top: 50px; } .main.solution .classification { width: 100%; height: auto; } .main.solution .classification .tit { text-align: center; font-size: 40px; color: #fff; padding-top: 12px; font-weight: bold; } .main.solution .classification .txt_w { text-align: center; font-size: 14px; color: #fff; padding-bottom: 35px; } .main.solution .classification .classification_main { width: 100%; height: auto; padding-top: 5px; text-align: center; } .main.solution .classification .classification_main.fix { position: fixed; top: 100px; z-index: 110; background: url(../img/nnn.jpg) no-repeat; background-size: 100% 100%; } .main.solution .classification .classification_main a { width: 167px; height: 53px; display: inline-block; text-align: center; font-size: 18px; color: #fff; background: url(../img/a2.jpg) no-repeat; line-height: 53px; transition: all 0.5s; } .main.solution .classification .classification_main a:hover { background: #fff; color: #0067ac; transform: translateY(-5px); } .main.solution .classification .classification_main a.cur { background: #fff; color: #0067ac; transform: translateY(-5px); } .main.solution .solution_box { width: 1435px; height: auto; margin: 0 auto; } .main.solution .solution_box .title { text-align: center; font-size: 44px; color: #272626; line-height: 62px; padding-top: 55px; } .main.solution .solution_box .j { width: 100%; height: auto; margin-top: 4px; } .main.solution .solution_box .j img { display: block; margin: 0 auto; } .main.solution .solution_box .x { font-size: 14px; color: #7d7d7d; text-align: center; padding-top: 10px; } .main.solution .solution_box .system { width: 100%; height: 342px; padding-bottom: 100px; overflow: hidden; padding-top: 55px; } .main.solution .solution_box .system ul { width: 110%; height: 100%; } .main.solution .solution_box .system ul.cu li:first-child { transition: all 0.7s; opacity: 1; transform: translateY(0px); } .main.solution .solution_box .system ul.cu li:nth-child(2) { transition: all 0.7s 0.2s; opacity: 1; transform: translateY(0px); } .main.solution .solution_box .system ul.cu li:nth-child(3) { transition: all 0.7s 0.4s; opacity: 1; transform: translateY(0px); } .main.solution .solution_box .system ul.cu li:nth-child(4) { transition: all 0.7s 0.6s; opacity: 1; transform: translateY(0px); } .main.solution .solution_box .system ul.cu li:nth-child(5) { transition: all 0.7s 0.8s; opacity: 1; transform: translateY(0px); } .main.solution .solution_box .system ul li { width: 338px; height: 342px; float: left; margin-right: 27px; opacity: 0; transform: translateY(100px); } .main.solution .solution_box .system ul li a { width: 100%; height: 100%; position: relative; display: block; } .main.solution .solution_box .system ul li a:hover .wrap { transform: translateY(-45px); } .main.solution .solution_box .system ul li a:hover .wrap .con { opacity: 0.7; } .main.solution .solution_box .system ul li a:hover .wrap .txt { color: #0884d5; } .main.solution .solution_box .system ul li a:hover .wrap .ico { background: url(../img/xx2.png) no-repeat center center; } .main.solution .solution_box .system ul li a:hover .wrap .ico.ico2 { background: url(../img/xx1.png) no-repeat center center; } .main.solution .solution_box .system ul li a:hover .wrap .ico.ico3 { background: url(../img/xx3.png) no-repeat center center; } .main.solution .solution_box .system ul li a:hover .wrap .ico.ico4 { background: url(../img/xx4.png) no-repeat center center; } .main.solution .solution_box .system ul li a .tu { width: 100%; height: 100%; overflow: hidden; } .main.solution .solution_box .system ul li a .tu img { width: 100%; height: 100%; } .main.solution .solution_box .system ul li a .mask { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); position: absolute; left: 0; top: 0; } .main.solution .solution_box .system ul li a .wrap { width: 100%; height: auto; padding-top: 150px; position: absolute; left: 0; top: 0; transition: all 0.5s; } .main.solution .solution_box .system ul li a .wrap .ico { width: 51px; height: 51px; background: url(../img/x2.png) no-repeat center center; margin: 0 auto; transition: all 0.5s; } .main.solution .solution_box .system ul li a .wrap .ico.ico2 { background: url(../img/x1.png) no-repeat center center; } .main.solution .solution_box .system ul li a .wrap .ico.ico3 { background: url(../img/x3.png) no-repeat center center; } .main.solution .solution_box .system ul li a .wrap .ico.ico4 { background: url(../img/x4.png) no-repeat center center; } .main.solution .solution_box .system ul li a .wrap .txt { font-size: 14px; color: #fff; padding-top: 9px; text-align: center; transition: all 0.5s; } .main.solution .solution_box .system ul li a .wrap .con { text-align: center; font-size: 12px; color: #fff; line-height: 20px; padding-top: 15px; opacity: 0; transition: all 0.5s; } .main.solution .field { width: 1065px; height: auto; margin: 0 auto; padding-top: 45px; padding-bottom: 20px; } .main.solution .field .tit { font-size: 26px; color: #0884d5; font-weight: bold; } .main.solution .field .case { margin: 0 48px; width: 969px; padding-top: 30px; } .main.solution .field .case ul { width: 100%; height: auto; overflow: hidden; } .main.solution .field .case ul li:nth-child(even) { float: right; } .main.solution .field .case ul li { width: 436px; height: auto; float: left; margin-bottom: 58px; } .main.solution .field .case ul li:hover a .tu img { transform: scale(1.1); } .main.solution .field .case ul li:hover a .cont .co { color: #0884d5; } .main.solution .field .case ul li a { width: 100%; height: auto; display: block; } .main.solution .field .case ul li a .tu { width: 436px; height: 290px; overflow: hidden; } .main.solution .field .case ul li a .tu img { width: 100%; height: 100%; transition: all 0.5s; } .main.solution .field .case ul li a .cont { width: 100%; height: auto; } .main.solution .field .case ul li a .cont .ti { font-size: 18px; color: #0884d5; text-align: center; padding-top: 16px; } .main.solution .field .case ul li a .cont .co { font-size: 14px; color: #666; padding-top: 3px; text-indent: 2em; transition: all 0.5s; line-height: 26px; } .main.solution .field .case_detail { width: 100%; height: auto; font-size: 14px; color: #6d6d6d; line-height: 30px; padding-bottom: 40px; } .main.solution .field .case_detail p { text-indent: 2em; padding-top: 12px; } .main.solution .field .case_detail img { max-width: 100%; } .main.solution .field .case_detail .tu { width: 100%; height: auto; padding-top: 32px; } .main.solution .field .case_detail .tu img { width: 100%; height: auto; } .main.solution .field .return { width: 145px; height: 45px; margin: 0 auto 48px auto; display: block; background: #0884d5; border-radius: 45px; font-size: 14px; color: #fff; text-align: center; line-height: 45px; } .main.solution .related { width: 100%; height: auto; background: #f2f2f2; padding-bottom: 55px; margin-bottom: 130px; } .main.solution .related .related_cen { width: 1065px; height: auto; margin: 0 auto; padding-top: 35px; } .main.solution .related .related_cen .tit { font-size: 26px; color: #0884d5; font-weight: bold; } .main.solution .related .related_cen .wrap { width: 100%; height: auto; overflow: hidden; margin-top: 22px; } .main.solution .related .related_cen .wrap ul { width: 110%; height: auto; } .main.solution .related .related_cen .wrap ul li { width: 250px; height: auto; float: left; margin-right: 20px; margin-bottom: 20px; } .main.solution .related .related_cen .wrap ul li:hover a .content .img_box .bg { background: #fff; } .main.solution .related .related_cen .wrap ul li:hover a .content .img_box .pic img { transform: scale(1.1); } .main.solution .related .related_cen .wrap ul li:hover a .content .txt { color: #0884d5; background: #fff; } .main.solution .related .related_cen .wrap ul li:hover a .mo { background: #0884d5; color: #fff; border-color: #0884d5; } .main.solution .related .related_cen .wrap ul li a { width: 100%; height: auto; display: block; } .main.solution .related .related_cen .wrap ul li a .content { width: 248px; height: 276px; border: 1px solid #e6e6e6; } .main.solution .related .related_cen .wrap ul li a .content .img_box { width: 100%; height: 210px; position: relative; } .main.solution .related .related_cen .wrap ul li a .content .img_box .pic { width: 100%; height: 100%; text-align: center; line-height: 210px; position: relative; z-index: 10; background: url(../img/bgg.png) no-repeat bottom center; } .main.solution .related .related_cen .wrap ul li a .content .img_box .pic img { max-width: 90%; max-height: 90%; display: inline-block; vertical-align: middle; transition: all 0.5s; } .main.solution .related .related_cen .wrap ul li a .content .img_box .bg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; transition: all 0.5s; background: #fafafa; } .main.solution .related .related_cen .wrap ul li a .content .txt { width: 100%; height: 66px; background: #fafafa; font-size: 14px; color: #666; transition: all 0.5s; text-align: center; line-height: 66px; } .main.solution .related .related_cen .wrap ul li a .mo { width: 90px; height: 22px; border: 1px solid #d1d1d1; font-size: 12px; color: #d1d1d1; display: block; border-radius: 22px; transition: all 0.5s; text-align: center; line-height: 22px; margin: 34px auto 0 auto; } .main.solution .related .related_cen .more2 { width: 202px; height: 45px; background: #0884d5; font-size: 16px; cursor: pointer; color: #fff; text-align: center; line-height: 45px; margin: 35px auto 0 auto; } .main.product { width: 100%; height: auto; } .main.product .banner2 { width: 100%; height: 600px; text-align: center; position: relative; } .main.product .banner2 .wrap2 { display: inline-block; position: absolute; left: 50%; top: 200px; } .main.product .banner2 .wrap2 .pic { position: relative; z-index: 4; } .main.product .banner2 .wrap2 .pic img { display: block; margin: 0 auto; width: 494px; height: 75px; } .main.product .banner2 .wrap2 .descript { font-size: 28px; color: #fff; text-align: center; position: relative; z-index: 4; padding-top: 5px; opacity: 0.8; } .main.product .banner2 .wrap2 .line { width: 50px; height: 2px; background: #fff; position: relative; z-index: 4; margin-top: 8px; } .main.product .banner2 .wrap2 .more { width: 152px; height: 60px; background: #f98700; text-align: center; line-height: 60px; display: block; font-size: 22px; color: #fff; margin-top: 50px; } .main.product .search_main { width: 100%; height: auto; background: #f7f7f7; margin-bottom: 95px; padding-bottom: 35px; } .main.product .search_main.no { margin-bottom: 0; } .main.product .search_main .title { font-size: 40px; color: #0884d5; font-weight: bold; text-align: center; padding-top: 5px; } .main.product .search_main .txt { font-size: 14px; color: #999; text-align: center; } .main.product .search_main .search { width: 100%; height: auto; margin-top: 18px; text-align: center; } .main.product .search_main .search .select { display: inline-block; width: 240px; height: 38px; position: relative; vertical-align: middle; margin: 0 25px; } .main.product .search_main .search .select select { width: 238px; height: 37px; border: 1px solid #0884d5; font-size: 14px; color: #666; background: url(../img/xl.png) no-repeat 212px center; } .main.product .search_main .search .select .l { width: 1px; height: 32px; background: #0884d5; position: absolute; right: 35px; top: 2px; } .main.product .search_main .search .search2 { width: 238px; height: 35px; position: relative; display: inline-block; border: 1px solid #0884d5; margin: 0 25px; vertical-align: middle; } .main.product .search_main .search .search2 input[type="text"] { width: 205px; height: 34px; float: left; display: block; background: none; font-size: 14px; color: #666; text-indent: 1em; border: none; } .main.product .search_main .search .search2 input[type="submit"] { width: 19px; height: 35px; background: url(../img/sss.png) no-repeat center center; float: left; border: none; } .main.product .branch { width: 100%; height: auto; } .main.product .branch .branch_cen { width: 1200px; height: auto; margin: 0 auto; } .main.product .branch .branch_cen .tit { float: left; font-size: 30px; color: #fff; font-weight: bold; line-height: 92px; margin-left: 65px; } .main.product .branch .branch_cen .container { float: right; margin-top: 38px; } .main.product .branch .branch_cen .container a { width: 167px; height: 53px; font-size: 18px; color: #fff; text-align: center; line-height: 53px; display: block; background: url(../img/a2.jpg) no-repeat; background-size: cover !important; transition: all 0.5s; margin-left: 5px; float: left; } .main.product .branch .branch_cen .container a.active { background: #fff; transform: translateY(-5px); color: #0067ac; } .main.product .branch .branch_cen .container a:hover { background: #fff; transform: translateY(-5px); color: #0067ac; } .main.product .product_main { width: 100%; height: auto; } .main.product .product_main .box1 { width: 100%; height: auto; margin-bottom: 100px; } .main.product .product_main .box1.box2 { background: #f2f2f2; } .main.product .product_main .box1.box2 .box_cen .box_r { margin-left: 85px; margin-right: 35px; } .main.product .product_main .box1.box2 .box_cen .box_r .en { color: #0884d5; text-align: left; } .main.product .product_main .box1.box2 .box_cen .box_r .cont { width: 100%; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .zh { color: #0884d5; float: left; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn { float: right; display: block; width: 143px; height: 44px; line-height: 44px; border-radius: 5px; color: #fff; background: #f98700; font-size: 16px; text-align: center; position: relative; top: -18px; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn div { width: 28px; height: 28px; text-align: center; line-height: 28px; float: left; margin-right: 10px; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn div.left { background: url(../img/prev.png) no-repeat center center #c2c2c2; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn div.left:hover { background: url(../img/prev.png) no-repeat center center #f98700; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn div.right { background: url(../img/next.png) no-repeat center center #c2c2c2; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn div.right:hover { background: url(../img/next.png) no-repeat center center #f98700; } .main.product .product_main .box1.box2 .box_cen .box_r .wrap ul li:hover a .mo { background: #0884d5; border-color: #0884d5; color: #fff; } .main.product .product_main .box1.box2 .box_cen .box_r .wrap ul li:hover a .txt { background: #fff; color: #0884d5; } .main.product .product_main .box1.box2 .box_cen .box_r .wrap ul li a .mo { border-color: #999; color: #999; } .main.product .product_main .box1 .box_cen { width: 1340px; height: auto; margin: 0 auto; } .main.product .product_main .box1 .box_cen .box_l { width: 440px; height: 450px; float: left; padding-top: 57px; padding-bottom: 55px; overflow: hidden; } .main.product .product_main .box1 .box_cen .box_l img { width: 100%; height: auto; } .main.product .product_main .box1 .box_cen .box_r { width: 770px; height: auto; float: left; padding-top: 45px; margin-left: 35px; } .main.product .product_main .box1 .box_cen .box_r .en { font-size: 40px; color: #fff; line-height: 54px; opacity: 0.1; } .main.product .product_main .box1 .box_cen .box_r .cont { width: 100%; } .main.product .product_main .box1 .box_cen .box_r .cont .zh { font-size: 23px; color: #fff; float: left; } .main.product .product_main .box1 .box_cen .box_r .cont .btn { float: right; margin-top: 7px; display: block; width: 143px; height: 44px; line-height: 44px; border-radius: 5px; color: #fff; background: #f98700; font-size: 16px; text-align: center; position: relative; top: -18px; } .main.product .product_main .box1 .box_cen .box_r .cont .btn div { width: 28px; height: 28px; text-align: center; line-height: 28px; float: right; margin-left: 10px; cursor: pointer; } .main.product .product_main .box1 .box_cen .box_r .cont .btn div.left { background: url(../img/prev.png) no-repeat center center #1a5397; } .main.product .product_main .box1 .box_cen .box_r .cont .btn div.left:hover { background: url(../img/prev.png) no-repeat center center #f98700; } .main.product .product_main .box1 .box_cen .box_r .cont .btn div.right { background: url(../img/next.png) no-repeat center center #1a5397; } .main.product .product_main .box1 .box_cen .box_r .cont .btn div.right:hover { background: url(../img/next.png) no-repeat center center #f98700; } .main.product .product_main .box1 .box_cen .box_r .wrap { width: 100%; height: auto; overflow: hidden; margin-top: 22px; } .main.product .product_main .box1 .box_cen .box_r .wrap ul { width: 110%; height: auto; position: relative; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li { width: 250px; height: auto; float: left; margin-right: 10px; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li:hover a .content .img_box .bg { background: #fff; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li:hover a .content .img_box .pic img { transform: scale(1.1); } .main.product .product_main .box1 .box_cen .box_r .wrap ul li:hover a .content .txt { color: #0884d5; background: #fff; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li:hover a .mo { background: #fff; color: #0884d5; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a { width: 100%; height: auto; display: block; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a .content { width: 248px; height: 276px; border: 1px solid #e6e6e6; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a .content .img_box { width: 100%; height: 210px; position: relative; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a .content .img_box .pic { width: 100%; height: 100%; text-align: center; line-height: 210px; position: relative; z-index: 10; background: url(../img/bgg.png) no-repeat bottom center; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a .content .img_box .pic img { max-width: 90%; max-height: 90%; display: inline-block; vertical-align: middle; transition: all 0.5s; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a .content .img_box .bg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; transition: all 0.5s; background: #fafafa; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a .content .txt { width: 100%; height: 66px; background: #fafafa; font-size: 14px; color: #666; transition: all 0.5s; text-align: center; line-height: 66px; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a .mo { width: 90px; height: 22px; border: 1px solid #95c4e7; font-size: 12px; color: #fff; display: block; border-radius: 22px; transition: all 0.5s; text-align: center; line-height: 22px; margin: 34px auto 0 auto; } @media (max-width: 1400px) { .main.product .product_main .box1.box2 { background: #f2f2f2; } .main.product .product_main .box1.box2 .box_cen .box_r { margin-left: 0px; margin-right: 25px; } .main.product .product_main .box1.box2 .box_cen .box_r .en { color: #0884d5; text-align: right; margin-right: 20px; } .main.product .product_main .box1.box2 .box_cen .box_r .cont { width: 695px; margin-right: 22px; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .zh { color: #0884d5; float: right; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn { float: left; margin-left: 135px; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn div { width: 28px; height: 28px; text-align: center; line-height: 28px; float: left; margin-right: 10px; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn div.left { background: url(../img/prev.png) no-repeat center center #c2c2c2; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn div.left:hover { background: url(../img/prev.png) no-repeat center center #f98700; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn div.right { background: url(../img/next.png) no-repeat center center #c2c2c2; } .main.product .product_main .box1.box2 .box_cen .box_r .cont .btn div.right:hover { background: url(../img/next.png) no-repeat center center #f98700; } .main.product .product_main .box1.box2 .box_cen .box_r .wrap ul li:hover a .mo { background: #0884d5; border-color: #0884d5; color: #fff; } .main.product .product_main .box1.box2 .box_cen .box_r .wrap ul li:hover a .txt { background: #fff; color: #0884d5; } .main.product .product_main .box1.box2 .box_cen .box_r .wrap ul li a .mo { border-color: #999; color: #999; } .main.product .product_main .box1 .box_cen { width: 1200px; } .main.product .product_main .box1 .box_cen .box_r { width: 735px; float: left; margin-left: 24px; } .main.product .product_main .box1 .box_cen .box_r .en { margin-left: 20px; } .main.product .product_main .box1 .box_cen .box_r .cont { margin-left: 20px; width: 685px; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li { width: 237px; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a .content { width: 237px; height: 265px; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a .content .img_box { height: 200px; width: 100%; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a .content .img_box .pic { height: 200px; line-height: 200px; } .main.product .product_main .box1 .box_cen .box_r .wrap ul li a .content .txt { height: 65px; line-height: 65px; } } .main.product .proinfo-ban { width: 100%; height: 600px; position: relative; } .main.product .proinfo-ban .list { width: 1065px; height: 430px; margin: 0 auto; padding-top: 170px; position: relative; } .main.product .proinfo-ban .list ul { position: relative; } .main.product .proinfo-ban .list ul li { width: 1065px; height: auto; position: absolute; left: 0; top: 0; } .main.product .proinfo-ban .list ul li.cur .tips { opacity: 1; } .main.product .proinfo-ban .list ul li.cur .tu { opacity: 1; right: 0; transition: all 0.5s; overflow: hidden; } .main.product .proinfo-ban .list ul li .tips { float: left; opacity: 0; width: 450px; } .main.product .proinfo-ban .list ul li .tips h2 { font-size: 25px; color: #0884d5; font-weight: bold; } .main.product .proinfo-ban .list ul li .tips .xh { font-size: 14px; color: #0884d5; opacity: 0.7; line-height: 30px; } .main.product .proinfo-ban .list ul li .tips .con { font-size: 12px; color: #666; line-height: 30px; padding-top: 30px; } .main.product .proinfo-ban .list ul li .tu { float: right; display: block; margin-right: 110px; opacity: 0; right: -200px; height: 300px; position: relative; width: 400px; text-align: center; line-height: 300px; } .main.product .proinfo-ban .list ul li .tu img { display: inline-block; max-width: 100%; max-height: 100%; } .main.product .proinfo-ban .list .btn { position: absolute; right: 0; bottom: 45px; margin-right: 100px; } .main.product .proinfo-ban .list .btn .btn_list { float: left; width: 98px; height: 65px; cursor: pointer; border: 1px solid #cad9e1; text-align: center; line-height: 65px; margin-right: 13px; } .main.product .proinfo-ban .list .btn .btn_list.current { border-color: #0884d5; } .main.product .proinfo-ban .list .btn .btn_list img { max-width: 90%; max-height: 90%; } .main.product .classification { width: 100%; height: auto; } .main.product .classification .tit { text-align: center; font-size: 40px; color: #fff; padding-top: 12px; font-weight: bold; } .main.product .classification .txt_w { text-align: center; font-size: 14px; color: #fff; padding-bottom: 35px; } .main.product .classification .classification_main { width: 100%; height: auto; padding-top: 5px; text-align: center; } .main.product .classification .classification_main.fix { position: fixed; top: 100px; z-index: 110; background: url(../img/nnn.jpg) no-repeat; background-size: 100% 100%; } .main.product .classification .classification_main a { width: 210px; height: 53px; display: inline-block; text-align: center; font-size: 18px; color: #fff; background: url(../img/a2.jpg) no-repeat; background-size: cover; line-height: 53px; transition: all 0.5s; } .main.product .classification .classification_main a:hover { background: #fff; color: #0067ac; transform: translateY(-5px); } .main.product .classification .classification_main a.cur { background: #fff; color: #0067ac; transform: translateY(-5px); } .main.product .td { width: 100%; height: auto; } .main.product .td .w { width: 1070px; height: auto; overflow: hidden; margin: 0 auto; padding-top: 100px; } .main.product .td .w ul { width: 2000px; height: auto; position: relative; } .main.product .td .w ul li { width: 265px; height: 170px; float: left; padding-top: 10px; border-right: 1px solid #ebebeb; } .main.product .td .w ul li:hover .sign, .main.product .td .w ul li:hover .t, .main.product .td .w ul li:hover .txt { transform: translateY(-10px); } .main.product .td .w ul li:hover .t, .main.product .td .w ul li:hover .txt { color: #0884d5; } .main.product .td .w ul li .sign { width: 52px; height: 52px; margin: 0 auto; transition: all 0.5s; } .main.product .td .w ul li .sign img { width: 100%; height: 100%; } .main.product .td .w ul li .t { font-size: 16px; color: #0884d5; transition: all 0.5s; padding-top: 15px; padding-left: 10px; padding-right: 10px; line-height: 24px; text-align: center; } .main.product .td .w ul li .txt { font-size: 12px; color: #666; transition: all 0.5s; line-height: 20px; padding: 0 30px; text-align: center; } .main.product .td .switch { text-align: center; margin: 100px auto 90px auto; width: 1070px; } .main.product .td .switch div { display: inline-block; width: 30px; margin: 0 3px; height: 22px; cursor: pointer; } .main.product .td .switch div.prev { background: url(../img/pr1.png) no-repeat center center #ccc; } .main.product .td .switch div.prev:hover { background: url(../img/pr1.png) no-repeat center center #0884d5; } .main.product .td .switch div.next { background: url(../img/r1.png) no-repeat center center #ccc; } .main.product .td .switch div.next:hover { background: url(../img/r1.png) no-repeat center center #0884d5; } .main.product .parameter { width: 100%; height: auto; } .main.product .parameter .parameter_cen { width: 1065px; height: auto; margin: 0 auto; padding-top: 83px; } .main.product .parameter .parameter_cen .ti { font-size: 26px; color: #0884d5; font-weight: bold; } .main.product .parameter .parameter_cen .table-list { width: 100%; height: auto; } .main.product .parameter .parameter_cen .table-list .table-nav { width: 1015px; height: 42px; background: #333; padding: 0 25px; margin-top: 44px; } .main.product .parameter .parameter_cen .table-list .table-nav .fl, .main.product .parameter .parameter_cen .table-list .table-nav .fr { font-size: 16px; color: #fff; line-height: 42px; } .main.product .parameter .parameter_cen .table-list .parameter_main { width: 100%; height: auto; padding-bottom: 55px; } .main.product .parameter .parameter_cen .table-list .parameter_main ul { width: 100%; height: auto; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li { width: 100%; margin-bottom: 1px; height: auto; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li.active .ti { background: #0884d5; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li.active .ti .btn { background: url(../img/jian3.png) no-repeat center center; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li.active .ti .fl { color: #fff; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .ti { padding: 0 28px; background: #0884d5; height: 42px; line-height: 42px; cursor: pointer; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .ti .btn { background: url(../img/jia3.png) no-repeat center center; width: 12px; height: 42px; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .ti .fl { font-size: 16px; color: #fff; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .message { width: 100%; height: auto; display: none; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .message.show { display: block; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .message table { width: 100%; height: auto; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .message table tr:nth-child(even) { background: #f8f8f8; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .message table tr { width: 100%; height: 42px; background: #f8f8f8; border-bottom: 1px solid #ececec; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .message table tr.bg { background: #f8f8f8; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .message table tr td:first-child { width: 157px !important; float: left; height: 100% !important; line-height: 42px; font-size: 12px !important; color: #666; border-right: 1px solid #ececec; padding-left: 58px !important; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .message table tr td:first-child span { background: none !important; font-size: 12px !important; color: #666 !important; font-family: "Microsoft YaHei" !important; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .message table tr td:last-child { width: 849px !important; font-size: 12px; color: #666; height: 100% !important; line-height: 42px; text-align: center; } .main.product .parameter .parameter_cen .table-list .parameter_main ul li .message table tr td:last-child span { background: none !important; font-size: 12px !important; color: #666 !important; font-family: "Microsoft YaHei" !important; } .main.product .recommend { width: 1065px; height: auto; margin: 0 auto; padding-top: 80px; padding-bottom: 104px; } .main.product .recommend .ti { font-size: 26px; color: #0884d5; font-weight: bold; } .main.product .recommend .recommend_main { width: 100%; height: auto; overflow: hidden; margin-top: 40px; } .main.product .recommend .recommend_main ul { width: 110%; height: auto; } .main.product .recommend .recommend_main ul li { width: 235px; height: 265px; background: #f8f8f8; float: left; margin-right: 33px; border: 1px solid #f8f8f8; margin-bottom: 33px; } .main.product .recommend .recommend_main ul li a { width: 100%; height: 255px; display: block; position: relative; padding-top: 10px; } .main.product .recommend .recommend_main ul li a:hover .mask { display: block; } .main.product .recommend .recommend_main ul li a:hover .ico { opacity: 1; } .main.product .recommend .recommend_main ul li a .mask { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); position: absolute; left: 0; top: 0; display: none; } .main.product .recommend .recommend_main ul li a .ico { width: 69px; height: 68px; background: url(../img/search2.png) no-repeat; position: absolute; left: 50%; top: 50%; margin-left: -34px; margin-top: -34px; transition: all 0.5s; opacity: 0; } .main.product .recommend .recommend_main ul li a .pic { width: 215px; height: 135px; background: #fff; text-align: center; margin: 0 auto; line-height: 135px; } .main.product .recommend .recommend_main ul li a .pic img { max-width: 100%; max-height: 100%; } .main.product .recommend .recommend_main ul li a .con { width: 100%; height: auto; } .main.product .recommend .recommend_main ul li a .con .en { font-size: 14px; color: #666; padding-top: 20px; text-align: center; } .main.product .recommend .recommend_main ul li a .con .cont { font-size: 14px; color: #0884d5; padding-top: 29px; text-align: center; } .main.product .recommend .more { width: 202px; height: 45px; background: #0884d5; font-size: 16px; cursor: pointer; color: #fff; text-align: center; line-height: 45px; margin: 22px auto 0 auto; } .main.product .download { width: 100%; height: auto; padding-bottom: 155px; } .main.product .download .download_cen { width: 1065px; height: auto; margin: 0 auto; padding-top: 77px; } .main.product .download .download_cen .ti { font-size: 26px; color: #0884d5; font-weight: bold; } .main.product .download .download_cen .container { width: 1065px; height: auto; overflow: hidden; margin: 85px auto 0 auto; } .main.product .download .download_cen .container ul { width: 110%; height: auto; } .main.product .download .download_cen .container ul li { width: 350px; height: 138px; margin-top: 30px; border: 1px solid #ededed; margin-right: 4px; float: left; } .main.product .download .download_cen .container ul li:hover a { background: #0884d5; } .main.product .download .download_cen .container ul li:hover a .img_box .bg { background: #fff; } .main.product .download .download_cen .container ul li:hover a .cont .tit2, .main.product .download .download_cen .container ul li:hover a .cont .descript { color: #fff; } .main.product .download .download_cen .container ul li:hover a .cont .message .down { color: #fff; opacity: 0.6; background: url(../img/xzz.png) no-repeat left center; } .main.product .download .download_cen .container ul li:hover a .cont .message .date { color: #fff; opacity: 0.6; background: url(../img/time3.png) no-repeat left center; } .main.product .download .download_cen .container ul li a { width: 100%; height: 100%; display: block; color: #666; background: #fff; transition: all 0.5s; } .main.product .download .download_cen .container ul li a .img_box { width: 135px; height: 108px; float: left; margin-top: 15px; margin-left: 15px; position: relative; } .main.product .download .download_cen .container ul li a .img_box .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #fafafa; transition: all 0.5s; } .main.product .download .download_cen .container ul li a .img_box .pic { width: 100%; height: 100%; position: relative; z-index: 10; text-align: center; line-height: 108px; } .main.product .download .download_cen .container ul li a .img_box .pic img { max-width: 100%; max-height: 100%; display: inline-block; vertical-align: middle; } .main.product .download .download_cen .container ul li a .cont { width: 167px; height: 108px; position: relative; float: left; padding-top: 20px; margin-left: 20px; } .main.product .download .download_cen .container ul li a .cont .tit2 { font-size: 14px; color: #666; transition: all 0.5s; } .main.product .download .download_cen .container ul li a .cont .descript { font-size: 12px; color: #999; transition: all 0.5s; line-height: 20px; } .main.product .download .download_cen .container ul li a .cont .message { width: 100%; height: auto; position: absolute; left: 0; bottom: 0; } .main.product .download .download_cen .container ul li a .cont .message .down { background: url(../img/xz.png) no-repeat left center; font-size: 12px; color: #999; padding-left: 25px; float: left; transition: all 0.5s; } .main.product .download .download_cen .container ul li a .cont .message .date { background: url(../img/time2.png) no-repeat left center; font-size: 12px; color: #999; padding-left: 25px; transition: all 0.5s; float: right; } .main.product .field { width: 100%; height: auto; padding-bottom: 140px; padding-top: 80px; } .main.product .field .ti { font-size: 26px; width: 1065px; height: auto; margin: 0 auto; color: #0884d5; font-weight: bold; } .main.product .field .container2 { width: 1245px; height: auto; position: relative; margin: 57px auto 0 auto; } @media (max-width: 1300px) { .main.product .field .container2 { width: 1200px; } } .main.product .field .container2 .field_box { width: 1065px; height: 342px; margin: 0 auto; overflow: hidden; } .main.product .field .container2 .field_box ul { width: 2000px; height: 100%; position: relative; } .main.product .field .container2 .field_box ul li { width: 338px; height: 342px; float: left; margin-right: 27px; } .main.product .field .container2 .field_box ul li a { width: 100%; height: 100%; position: relative; display: block; } .main.product .field .container2 .field_box ul li a:hover .wrap { transform: translateY(-45px); } .main.product .field .container2 .field_box ul li a:hover .wrap .con { opacity: 0.7; } .main.product .field .container2 .field_box ul li a:hover .wrap .txt { color: #0884d5; } .main.product .field .container2 .field_box ul li a:hover .wrap .ico { background: url(../img/xx1.png) no-repeat center center; } .main.product .field .container2 .field_box ul li a:hover .wrap .ico.ico2 { background: url(../img/xx2.png) no-repeat center center; } .main.product .field .container2 .field_box ul li a:hover .wrap .ico.ico3 { background: url(../img/xx3.png) no-repeat center center; } .main.product .field .container2 .field_box ul li a:hover .wrap .ico.ico4 { background: url(../img/xx4.png) no-repeat center center; } .main.product .field .container2 .field_box ul li a .tu { width: 100%; height: 100%; overflow: hidden; } .main.product .field .container2 .field_box ul li a .tu img { width: 100%; height: 100%; } .main.product .field .container2 .field_box ul li a .mask { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); position: absolute; left: 0; top: 0; } .main.product .field .container2 .field_box ul li a .wrap { width: 100%; height: auto; padding-top: 150px; position: absolute; left: 0; top: 0; transition: all 0.5s; } .main.product .field .container2 .field_box ul li a .wrap .ico { width: 51px; height: 51px; background: url(../img/x1.png) no-repeat center center; margin: 0 auto; transition: all 0.5s; } .main.product .field .container2 .field_box ul li a .wrap .ico.ico2 { background: url(../img/x2.png) no-repeat center center; } .main.product .field .container2 .field_box ul li a .wrap .ico.ico3 { background: url(../img/x3.png) no-repeat center center; } .main.product .field .container2 .field_box ul li a .wrap .ico.ico4 { background: url(../img/x4.png) no-repeat center center; } .main.product .field .container2 .field_box ul li a .wrap .txt { font-size: 14px; color: #fff; padding-top: 9px; text-align: center; transition: all 0.5s; } .main.product .field .container2 .field_box ul li a .wrap .con { text-align: center; font-size: 12px; color: #fff; line-height: 20px; padding-top: 15px; padding-left: 20px; padding-right: 20px; opacity: 0; transition: all 0.5s; } .main.product .field .container2 .left { width: 27px; height: 51px; position: absolute; left: 0; top: 50%; margin-top: -25px; cursor: pointer; background: url(../img/left.png) no-repeat; } .main.product .field .container2 .left:hover { background: url(../img/left1.png) no-repeat; } .main.product .field .container2 .right { width: 27px; height: 51px; position: absolute; cursor: pointer; right: 0; top: 50%; background: url(../img/right.png) no-repeat; margin-top: -25px; transition: all 0.5s; } .main.product .field .container2 .right:hover { background: url(../img/right1.png) no-repeat; } .main.product .related { width: 100%; height: auto; background: #f2f2f2; padding-bottom: 55px; margin-bottom: 130px; } .main.product .related.related2 { margin-bottom: 0; padding-top: 55px; padding-bottom: 220px; } .main.product .related.related2 .related_cen { padding-top: 50px; } .main.product .related.related2 .related_cen .wrap ul li { margin-bottom: 45px; } .main.product .related .item { width: 1065px; height: auto; margin: 0 auto; } .main.product .related .item .group { float: left; width: 154px; height: auto; margin-right: 25px; position: relative; } .main.product .related .item .group .group-tit { width: 100%; height: 52px; background: url(../img/xll.png) no-repeat 130px center #989898; font-size: 18px; color: #fff; line-height: 52px; box-sizing: border-box; padding-left: 16px; cursor: pointer; } .main.product .related .item .group .group-tit.xdd { background: #989898 !important; } .main.product .related .item .group .group-tit.cur { background: url(../img/xll.png) no-repeat 130px center #0884d5; } .main.product .related .item .group .group-tit.cur.xdd { background: #0884d5 !important; } .main.product .related .item .group .group-con { width: 100%; height: auto; position: absolute; top: 52px; background: #0884d5; z-index: 100; display: none; left: 0; } .main.product .related .item .group .group-con a { display: block; width: 100%; height: 38px; border-top: 1px solid #fff; font-size: 14px; color: #fff; text-align: center; line-height: 38px; } .main.product .related .related_cen { width: 1065px; height: auto; margin: 0 auto; padding-top: 35px; } .main.product .related .related_cen .tit { font-size: 26px; color: #0884d5; font-weight: bold; } .main.product .related .related_cen .wrap { width: 100%; height: auto; overflow: hidden; margin-top: 22px; } .main.product .related .related_cen .wrap ul { width: 110%; height: auto; } .main.product .related .related_cen .wrap ul li { width: 250px; height: auto; float: left; margin-right: 20px; margin-bottom: 20px; } .main.product .related .related_cen .wrap ul li:hover a .content .img_box .bg { background: #fff; } .main.product .related .related_cen .wrap ul li:hover a .content .img_box .pic img { transform: scale(1.1); } .main.product .related .related_cen .wrap ul li:hover a .content .txt { color: #0884d5; background: #fff; } .main.product .related .related_cen .wrap ul li:hover a .mo { background: #0884d5; color: #fff; border-color: #0884d5; } .main.product .related .related_cen .wrap ul li a { width: 100%; height: auto; display: block; } .main.product .related .related_cen .wrap ul li a .content { width: 248px; height: 276px; border: 1px solid #e6e6e6; } .main.product .related .related_cen .wrap ul li a .content .img_box { width: 100%; height: 210px; position: relative; } .main.product .related .related_cen .wrap ul li a .content .img_box .pic { width: 100%; height: 100%; text-align: center; line-height: 210px; position: relative; z-index: 10; background: url(../img/bgg.png) no-repeat bottom center; } .main.product .related .related_cen .wrap ul li a .content .img_box .pic img { max-width: 90%; max-height: 90%; display: inline-block; vertical-align: middle; transition: all 0.5s; } .main.product .related .related_cen .wrap ul li a .content .img_box .bg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; transition: all 0.5s; background: #fafafa; } .main.product .related .related_cen .wrap ul li a .content .txt { width: 100%; height: 66px; background: #fafafa; font-size: 14px; color: #666; transition: all 0.5s; text-align: center; line-height: 66px; } .main.product .related .related_cen .wrap ul li a .mo { width: 90px; height: 22px; border: 1px solid #d1d1d1; font-size: 12px; color: #d1d1d1; display: block; border-radius: 22px; transition: all 0.5s; text-align: center; line-height: 22px; margin: 34px auto 0 auto; } .scroll-down { width: 24px; height: auto; position: absolute; left: 50%; margin-left: -12px; cursor: pointer; bottom: 17px; z-index: 15; } .scroll-down .s1 { width: 4px; height: 4px; margin: 5px auto 0 auto; background: #d4d8dd; border-radius: 50%; animation: move 1.2s 0.8s linear forwards infinite; } .scroll-down .s2 { width: 6px; margin: 5px auto 0 auto; height: 6px; background: #d4d8dd; border-radius: 50%; animation: move 1.2s 0.6s linear forwards infinite; } .scroll-down .s3 { width: 8px; height: 8px; margin: 5px auto 0 auto; border-radius: 50%; background: #d4d8dd; animation: move 1.2s 0.4s linear forwards infinite; } .scroll-down .s4 { width: 24px; height: 24px; margin: 5px auto 0 auto; border-radius: 50%; animation: move 1.2s linear forwards infinite; background: url(../img/xxx.png) no-repeat center center #d4d8dd; } .footer { width: 100%; height: auto; } .footer .foot { width: 100%; height: auto; background: #ccc; } .footer .foot .foot_cen { width: 1200px; height: auto; margin: 0 auto; padding-bottom: 18px; } .footer .foot .foot_cen ul { float: left; padding-top: 50px; } .footer .foot .foot_cen ul li { width: 137px; height: auto; margin-right: 28px; float: left; } .footer .foot .foot_cen ul li a { display: block; font-size: 13px; color: #666; padding-top: 5px; transition: all 0.5s; } .footer .foot .foot_cen ul li a.big { font-size: 18px; color: #333; padding-bottom: 10px; } .footer .foot .foot_cen ul li a:hover { color: #0884d5; } .footer .foot .foot_cen .code { width: 90px; height: auto; background: url(../img/l.png) no-repeat left top; float: right; padding-left: 90px; margin-top: 73px; } .footer .foot .foot_cen .code .code1 { width: 87px; height: auto; float: left; padding-top: 7px; } .footer .foot .foot_cen .code .code1.code2 { float: right; } .footer .foot .foot_cen .code .code1 .tu { width: 87px; overflow: hidden; height: 87px; } .footer .foot .foot_cen .code .code1 .tu img { width: 100%; height: 100%; } .footer .foot .foot_cen .code .code1 .txt { font-size: 16px; color: #919692; text-align: center; } .footer .copyright { width: 100%; height: 50px; background: #000; } .footer .copyright .copyright_cen { width: 1415px; margin: 0 auto; } @media (max-width: 1450px) { .footer .copyright .copyright_cen { width: 1200px; } } .footer .copyright .copyright_cen .fl { font-size: 13px; color: #fff; line-height: 50px; } .footer .copyright .copyright_cen .fr { font-size: 13px; color: #fff; text-align: right; line-height: 50px; } .footer .copyright .copyright_cen .fr a { color: #fff; } .footer .copyright .copyright_cen .fr a:hover { color: #0884d5; } .back_top { width: 65px; height: auto; position: fixed; right: 20px; bottom: 100px; display: none; z-index: 1000; } .back_top .top { width: 65px; height: 62px; display: block; position: relative; } .back_top .top:hover .ico { transform: rotateY(-180deg); } .back_top .top:hover .txt { transform: rotateY(0deg); } .back_top .top .ico { width: 65px; height: 62px; background: url(../img/top.png) no-repeat; text-align: center; line-height: 62px; position: absolute; left: 0; backface-visibility: hidden; top: 0; transform: rotateY(0deg); transition: all 1s; } .back_top .top .txt { font-size: 14px; color: #fff; width: 100%; height: 47px; position: absolute; background: url(../img/j14.png) no-repeat; transition: all 1s; text-align: center; transform: rotateY(180deg); line-height: 20px; padding-top: 15px; backface-visibility: hidden; } .back_top .kf { width: 65px; height: 62px; margin-top: 5px; display: block; position: relative; } .back_top .kf:hover .ico { transform: rotateY(-180deg); } .back_top .kf:hover .txt { transform: rotateY(0deg); } .back_top .kf .ico { width: 65px; height: 62px; background: url(../img/kf2.png) no-repeat; text-align: center; line-height: 62px; position: absolute; left: 0; backface-visibility: hidden; top: 0; transform: rotateY(0deg); transition: all 1s; } .back_top .kf .txt { font-size: 14px; color: #fff; width: 100%; height: 47px; position: absolute; background: #219dee; transition: all 1s; text-align: center; transform: rotateY(180deg); line-height: 20px; padding-top: 15px; backface-visibility: hidden; } .back_top .contact { width: 65px; height: 62px; margin-top: 5px; display: block; position: relative; } .back_top .contact:hover .ico { transform: rotateY(-180deg); } .back_top .contact:hover .txt { transform: rotateY(0deg); } .back_top .contact .ico { width: 65px; height: 62px; background: url(../img/jr2.png) no-repeat; text-align: center; line-height: 62px; position: absolute; left: 0; backface-visibility: hidden; top: 0; transform: rotateY(0deg); transition: all 1s; } .back_top .contact .txt { font-size: 14px; color: #fff; width: 100%; height: 47px; position: absolute; background: #219dee; transition: all 1s; text-align: center; transform: rotateY(180deg); line-height: 20px; padding-top: 15px; backface-visibility: hidden; } .js-m { transform: translateY(100px); opacity: 0; } .js-left { transform: translateX(-100px); opacity: 0; } .mask10 { width: 100%; height: 100%; background: #000; opacity: 0.5; position: fixed; top: 0; left: 0; z-index: 1000; display: none; } .join_proput { width: 750px; height: 546px; padding: 12px 45px 0 45px; position: fixed; left: 50%; margin-left: -435px; top: 50%; margin-top: -273px; z-index: 1001; background: #fff; display: none; padding-bottom: 80px; transition: all 0.5s; } .join_proput .close { width: 26px; height: 26px; background: url(../img/close.png) no-repeat; position: absolute; right: -36px; cursor: pointer; top: 0; } .join_proput .cont { width: 100%; height: 580px; padding: 0 20px; box-sizing: border-box; } .join_proput .cont h2 { font-size: 24px; color: #333; line-height: 50px; text-align: center; } .join_proput .cont .text { font-size: 16px; color: #333; padding-bottom: 20px; font-weight: bold; padding-top: 20px; } .join_proput .cont .text span { color: #666; margin-left: 30px; font-weight: normal; } .join_proput .cont .text span i { color: #d90708; font-size: 16px; font-style: normal; } .join_proput .cont .input { width: 100%; height: auto; margin-bottom: 10px; position: relative; } .join_proput .cont .input .nn { width: 710px; height: auto; } .join_proput .cont .input .nn label { font-size: 14px; float: left; height: 37px; line-height: 37px; display: block; width: 100px; } .join_proput .cont .input .nn input[type="text"] { width: 565px; height: 33px; border: 1px solid #e6e6e6; border-radius: 5px; display: block; font-size: 14px; line-height: 33px; float: left; text-indent: 1em; color: #999; transition: all 0.3s; } .join_proput .cont .input .nn input[type="text"]:focus { border-color: #0884d5; } .join_proput .cont .input .n { float: left; position: relative; } .join_proput .cont .input .n.n2 { margin-left: 30px; } .join_proput .cont .input .n label { font-size: 14px; float: left; height: 37px; line-height: 37px; display: block; width: 100px; } .join_proput .cont .input .n > .text2 { width: 565px; height: 33px; float: left; } .join_proput .cont .input .n > .text2 .file { float: left; position: relative; } .join_proput .cont .input .n > .text2 .file > span { width: 88px; height: 35px; background: #f0f0f0; display: inline-block; font-size: 14px; color: #f98700; border-radius: 5px; text-align: center; line-height: 35px; float: left; border: 1px solid #d6d6d6; } .join_proput .cont .input .n > .text2 .file input { opacity: 0; width: 90px; height: 35px; position: absolute; left: 0; top: 0; } .join_proput .cont .input .n > .text2 em { font-size: 14px; color: #999; margin-left: 15px; font-style: normal; line-height: 37px; } .join_proput .cont .input .n .t { width: 213px; height: 33px; border: 1px solid #e6e6e6; border-radius: 5px; display: block; float: left; position: relative; } .join_proput .cont .input .n .t .txt { font-size: 14px; color: #999; line-height: 33px; text-align: center; position: absolute; left: 50%; top: 0; margin-left: -43px; } .join_proput .cont .input .n .t > input { width: 65px; height: 31px; border: none; border-radius: 33px; text-indent: 1em; } .join_proput .cont .input .n > input[type="text"] { width: 213px; height: 33px; border: 1px solid #e6e6e6; border-radius: 5px; display: block; font-size: 14px; line-height: 33px; float: left; text-indent: 1em; color: #999; transition: all 0.3s; } .join_proput .cont .input .n > input[type="text"]:focus { border-color: #0884d5; } .join_proput .cont .input .n > span { position: absolute; right: -14px; color: #d90708; font-size: 16px; top: 50%; margin-top: -15px; } .join_proput .cont .submit { width: 100%; height: auto; text-align: center; margin-top: 75px; } .join_proput .cont .submit input { width: 210px; height: 45px; text-align: center; line-height: 45px; font-size: 16px; border: none; margin: 0 15px; color: #fff; display: inline-block; } .join_proput .cont .submit input[type="submit"] { background: #0884d5; } .join_proput .cont .submit input[type="reset"] { background: #b2b2b2; } .proput { width: 646px; height: 546px; padding: 12px 58px 0 58px; position: fixed; left: 50%; margin-left: -323px; top: 50%; margin-top: -273px; z-index: 1001; background: #fff; display: none; transition: all 0.5s; } .proput .close { width: 26px; height: 26px; background: url(../img/close.png) no-repeat; position: absolute; right: -36px; cursor: pointer; top: 0; } .proput h2 { font-size: 24px; color: #333; line-height: 80px; } .proput .input { width: 100%; height: auto; margin-bottom: 10px; } .proput .input input[type="text"] { width: 298px; height: 33px; border: 1px solid #e6e6e6; border-radius: 5px; display: block; font-size: 14px; line-height: 33px; text-indent: 1em; color: #999; transition: all 0.3s; } .proput .input input[type="text"]:focus { border-color: #0884d5; } .proput .input .n { float: left; position: relative; } .proput .input .n.n2 { margin-left: 37px; } .proput .input .n label { font-size: 14px; float: left; height: 37px; line-height: 37px; display: block; width: 100px; } .proput .input .n > .text2 { width: 565px; height: 33px; float: left; } .proput .input .n > .text2 .file { float: left; position: relative; } .proput .input .n > .text2 .file > span { width: 88px; height: 35px; background: #f0f0f0; display: inline-block; font-size: 14px; color: #f98700; border-radius: 5px; text-align: center; line-height: 35px; float: left; border: 1px solid #d6d6d6; } .proput .input .n > .text2 .file input { opacity: 0; width: 90px; height: 35px; position: absolute; left: 0; top: 0; } .proput .input .n > .text2 em { font-size: 14px; color: #999; margin-left: 15px; font-style: normal; line-height: 37px; } .proput .input .n .t { width: 213px; height: 33px; border: 1px solid #e6e6e6; border-radius: 5px; display: block; float: left; position: relative; } .proput .input .n .t .txt { font-size: 14px; color: #999; line-height: 33px; text-align: center; position: absolute; left: 50%; top: 0; margin-left: -43px; } .proput .input .n .t > input { width: 65px; height: 31px; border: none; border-radius: 33px; text-indent: 1em; } .proput .input .n > input[type="text"] { width: 213px; height: 33px; border: 1px solid #e6e6e6; border-radius: 5px; display: block; font-size: 14px; line-height: 33px; float: left; text-indent: 1em; color: #999; transition: all 0.3s; } .proput .input .n > input[type="text"]:focus { border-color: #0884d5; } .proput .input .n > span { position: absolute; right: -14px; color: #d90708; font-size: 16px; top: 50%; margin-top: -15px; } .proput .input select { width: 298px; height: 33px; border: 1px solid #e6e6e6; border-radius: 5px; display: block; color: #999; font-size: 14px; line-height: 33px; transition: all 0.3s; background: url(../img/xx.png) no-repeat 96% center; } .proput .input select:focus { border-color: #0884d5; outline: none !important; } .proput .input textarea { width: 100%; height: 110px; border: 1px solid #e6e6e6; display: block; box-sizing: border-box; color: #999; font-size: 14px; line-height: 33px; text-indent: 1em; transition: all 0.3s; resize: none; } .proput .input textarea:focus { border-color: #0884d5; } .proput .submit { width: 100%; height: auto; text-align: center; } .proput .submit input { width: 150px; height: 40px; border: none; border-radius: 5px; background: #0884d5; font-size: 14px; color: #fff; display: inline-block; } ::-moz-placeholder { color: #999 !important; } ::-webkit-input-placeholder { color: #999 !important; } :-ms-input-placeholder { color: #999 !important; } .page { padding: 0px 0 10px; font-size: 12px; font-weight: bold; line-height: 22px; text-align: center; clear: both; } .page a { text-decoration: none; color: #fff; border: 1px solid transparent; padding: 4px 10px; font-size: 18px; text-align: center; margin: 0 5px; } .page a.active { border-color: #f98700; color: #f98700; } .page a:hover { text-decoration: none; color: #f98700; border-color: #f98700; } /*# sourceMappingURL=style.css.map */