.company_modes1 { color: #21d06e; border-bottom: 2px solid #21d06e; } .banner { position: relative; width: 100%; overflow: hidden; } .banner .ul { overflow: hidden; white-space: nowrap; } .banner .ul .li { display: inline; } .banner .ul .li img { width: 100%; min-width: 1360px; } .banner .banner-next { width: 28px; } .banner .banner-next #next-img { position: absolute; width: 28px; height: 28px; top: 50%; left: 20px; } .banner .banner-pre { width: 28px; } .banner .banner-pre #pre-img { position: absolute; width: 28px; height: 28px; top: 50%; right: 20px; } .banner .light-wraper-div { width: 100%; min-width: 1200px; position: absolute; bottom: 80px; } .banner .light-wraper { width: 110px; margin: 0 auto; } .banner .light-wraper .banner-light { margin: 0 10px; float: left; width: 16px; height: 16px; background: #ffffff; border-radius: 50%; } .banner .light-wraper .banner-light:nth-child(1) { background: orange; } .out_wraper { width: 100%; text-align: center; } .inner_wraper { width: 1200px; margin: 0 auto; } .clearFix::after { display: block; content: ""; clear: both; } .title_line { margin: 20px auto; width: 52px; height: 2px; background: #0abb58; border-radius: 1px; } .news { padding-top: 30px; } .news .first_title { margin: 0 auto; top: 630px; width: 112px; height: 27px; font-size: 28px; font-family: MicrosoftYaHei; font-weight: 400; color: #323534; } .news .second_title { margin-top: 31px; text-align: center; height: 40px; width: 324px; margin: 0 auto; } .news .second_title .company_news { float: left; width: 160px; height: 40px; line-height: 40px; background: #21d06e; border: 1px solid #21d06e; border-radius: 6px 0 0 6px; box-sizing: border-box; cursor: pointer; } .news .second_title .industry_news { float: left; width: 160px; height: 40px; line-height: 40px; border: 1px solid #21d06e; background: #ffffff; border-radius: 0 6px 6px 0; box-sizing: border-box; cursor: pointer; } .news .content { margin: 30px 0; text-align: center; } .news .content .onews .content1, .news .content .inews .content1 { float: left; margin: 0 5px; width: 383px; background: #ffffff; border: 1px solid #dddddd; text-align: left; position: relative; height: 250px; } .news .content .onews .content1 .top .logo, .news .content .inews .content1 .top .logo { width: 84px; height: 70px; background: #21d06e; position: relative; float: left; } .news .content .onews .content1 .top .logo img, .news .content .inews .content1 .top .logo img { width: 100%; } .news .content .onews .content1 .top .logo .years, .news .content .inews .content1 .top .logo .years { position: absolute; top: 15px; left: 24px; width: 37px; height: 12px; font-size: 14px; font-family: MicrosoftYaHei; font-weight: bold; color: #ffffff; line-height: 24px; } .news .content .onews .content1 .top .logo .nowdays, .news .content .inews .content1 .top .logo .nowdays { position: absolute; top: 50px; left: 15px; height: 15px; font-size: 20px; font-family: MicrosoftYaHei; font-weight: 400; color: #21d06e; line-height: 24px; } .news .content .onews .content1 .top .title, .news .content .inews .content1 .top .title { padding: 15px; width: 258px; height: 38px; font-size: 16px; font-family: MicrosoftYaHei; font-weight: 400; color: #333333; line-height: 24px; float: left; } .news .content .onews .content1 .news_content, .news .content .inews .content1 .news_content { padding: 22px; font-size: 14px; font-family: MicrosoftYaHei; font-weight: 400; color: #666666; line-height: 30px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; /* -webkit-line-clamp: 2; */ -webkit-line-clamp: 3; -webkit-box-orient: vertical; height: 75px; } .news .content .onews .content1 .details, .news .content .inews .content1 .details { position: absolute; width: 98px; height: 32px; background: #ffffff; border: 1px solid #1bb65f; border-radius: 6px; bottom: 20px; right: 20px; cursor: pointer; outline: none; } .news .content .onews .content1 .details:hover, .news .content .inews .content1 .details:hover { background: #1bb65f; } .news .content .onews { display: none; } .news .more_items { margin: 30px auto; width: 200px; height: 40px; line-height: 40px; background: #fffefe; border: 1px solid #21d06e; border-radius: 6px; cursor: pointer; } .news .more_items:hover { background: #21d06e; } .product .product_title { background: #eee; padding-top: 32px; height: 102px; font-size: 28px; font-family: MicrosoftYaHeiUI; font-weight: 400; color: #373d41; line-height: 38px; } .product .product_content { height: 450px; background: #017738; position: relative; background-image: url('home_pic/pro_bg.png'); } .product .product_content .left { position: absolute; } .product .product_content .left .left1 { position: absolute; left: 10px; top: 114px; } .product .product_content .left .left2 { position: absolute; left: 10px; top: 213px; } .product .product_content .inner_wraper .items_wraper { width: 1200px; height: 450px; overflow: hidden; } .product .product_content .inner_wraper .items_wraper .items1 { float: left; width: 240px; height: 450px; background: #000000; position: relative; } .product .product_content .inner_wraper .items_wraper .items1 .logo { padding-top: 152px; padding-left: 96px; width: 49px; height: 60px; } .product .product_content .inner_wraper .items_wraper .items1 .logo img { width: 100%; } .product .product_content .inner_wraper .items_wraper .items1 .logo_line { width: 80px; height: 1px; background: #ffffff; margin: 33px auto 27px; } .product .product_content .inner_wraper .items_wraper .items1 .logo_title { text-align: center; width: 129px; height: 40px; font-size: 16px; font-family: MicrosoftYaHei-Bold; font-weight: bold; padding-left: 57px; color: #ffffff; line-height: 24px; } .product .product_content .inner_wraper .items_wraper .items1 .items1_content { padding: 22px; text-align: left; font-size: 14px; font-family: MicrosoftYaHei; font-weight: 400; color: #ffffff; line-height: 24px; display: none; } .product .product_content .inner_wraper .items_wraper .items1 .more_details { position: absolute; bottom: 30px; width: 116px; height: 36px; line-height: 36px; background: none; border: 1px solid #ffffff; border-radius: 6px; font-size: 14px; font-family: MicrosoftYaHei; font-weight: 400; color: #ffffff; left: 62px; cursor: pointer; } .product .product_content .inner_wraper .items_wraper .items1:nth-child(odd) { background: rgba(0, 0, 0, 0.4); } .product .product_content .inner_wraper .items_wraper .items1:nth-child(even) { background: rgba(0, 0, 0, 0.2); } .product .product_content .inner_wraper .items_wraper .items1:hover { width: 240px; height: 450px; background: rgba(33, 208, 110, 0.76); position: relative; } .product .product_content .inner_wraper .items_wraper .items1:hover .logo { padding-top: 40px; padding-left: 96px; width: 49px; height: 60px; } .product .product_content .inner_wraper .items_wraper .items1:hover .logo img { width: 100%; } .product .product_content .inner_wraper .items_wraper .items1:hover .logo_line { width: 80px; height: 1px; background: #ffffff; margin: 33px auto 27px; } .product .product_content .inner_wraper .items_wraper .items1:hover .logo_title { text-align: center; width: 129px; height: 40px; font-size: 16px; font-family: MicrosoftYaHei-Bold; font-weight: bold; padding-left: 57px; color: #ffffff; line-height: 24px; } .product .product_content .inner_wraper .items_wraper .items1:hover .items1_content { display: block; padding: 22px; text-align: left; font-size: 14px; font-family: MicrosoftYaHei; font-weight: 400; color: #ffffff; line-height: 24px; } .product .product_content .inner_wraper .items_wraper .items1:hover .more_details { position: absolute; bottom: 30px; width: 116px; height: 36px; line-height: 36px; background: none; border: 1px solid #ffffff; border-radius: 6px; font-size: 14px; font-family: MicrosoftYaHei; font-weight: 400; color: #ffffff; left: 62px; } .product .product_content .inner_wraper .items_wraper .items1:hover .more_details:hover { width: 116px; height: 36px; background: #ffffff; border: 1px solid rgba(255, 255, 255, 0.85); border-radius: 6px; color: green; } .product .product_content .right { position: absolute; top: 0; right: 0; } .product .product_content .right .right1 { position: absolute; right: 10px; top: 114px; } .product .product_content .right .right2 { position: absolute; right: 10px; top: 213px; } .solution { width: 100%; height: 804px; background: #ffffff; padding-top: 90px; } .solution .first_title { font-size: 28px; font-family: MicrosoftYaHeiUI; font-weight: 400; color: #373d41; line-height: 38px; margin-bottom: 31px; } .solution .second_title { font-size: 14px; font-family: MicrosoftYaHei; font-weight: 400; color: #44484a; line-height: 38px; } .solution .solution-content .solution-right { width: 1120px; margin: 0 auto; } .solution .solution-content .solution-right .solution-big { float: left; width: 535px; height: 540px; margin: 0 10px; background: #fafdfb; border: 1px solid #eeeeee; } .solution .solution-content .solution-right .solution-big .top { width: 535px; height: 150px; background: #67B68A; text-align: center; } .solution .solution-content .solution-right .solution-big .top .logo { padding-top: 20px; } .solution .solution-content .solution-right .solution-big .top .logo img { width: 35px; height: 40px; } .solution .solution-content .solution-right .solution-big .top .first-title { font-size: 18px; font-family: MicrosoftYaHei-Bold; font-weight: bold; color: #ffffff; line-height: 38px; } .solution .solution-content .solution-right .solution-big .top .second-title { font-size: 14px; font-family: MicrosoftYaHei; font-weight: 400; color: #edfff5; line-height: 38px; } .solution .solution-content .solution-right .solution-big .bottom .item-show { display: none; } .solution .solution-content .solution-right .solution-big .bottom .item-title-show { display: none; } .solution .solution-content .solution-right .solution-big .bottom .span { font-size: 14px; font-family: MicrosoftYaHei; font-weight: 400; color: #666666; line-height: 22px; text-align: left; height: 85px; } .solution .solution-content .solution-right .solution-big .bottom .left-content { text-align: left; padding: 25px 20px 0 20px; height: 150px; font-size: 14px; font-family: MicrosoftYaHei; font-weight: 400; color: #666666; line-height: 22px; } .solution .solution-content .solution-right .solution-big .bottom .more-details { height: 40px; position: relative; margin-top: 20px; } .solution .solution-content .solution-right .solution-big .bottom .more-details button { position: absolute; width: 98px; height: 32px; background: #ffffff; border: 1px solid #1bb65f; border-radius: 6px; right: 19px; } .solution .solution-content .solution-right .solution-big .bottom .more-details button:hover { width: 98px; height: 32px; background: #21d06e; border: 1px solid #21d06e; border-radius: 6px; cursor: pointer; } .solution .solution-content .solution-right .solution-big .bottom .left-content-bottom { text-align: left; } .solution .solution-content .solution-right .solution-big .bottom .left-content-bottom .items { margin: 11px 15px 11px 0; float: left; width: 230px; height: 48px; line-height: 48px; background: #f2f2f2; text-align: left; position: relative; } .solution .solution-content .solution-right .solution-big .bottom .left-content-bottom .items span { padding-left: 40px; font-size: 12px; font-family: MicrosoftYaHei; font-weight: 400; color: #333333; line-height: 22px; } .solution .solution-content .solution-right .solution-big .bottom .left-content-bottom .items img { position: absolute; left: 10px; top: 16px; } .solution .solution-content .solution-right .solution-big:hover { background: #fafdfb; border: 1px solid #eeeeee; box-shadow: 0px 6px 10px 0px rgba(7, 0, 2, 0.12), 0px -5px 10px 0px rgba(7, 0, 2, 0.12); } .solution .solution-content .solution-right .solution-big:hover .top { background: #21D06E; } .solution .solution-content .solution-right .solution-big:hover .items { background: #dcfceb; cursor: pointer; } .aboutUs { height: 600px; background: #f7f7f7; } .aboutUs .header-top { padding-top: 35px; } .aboutUs .header-top p { font-size: 28px; font-family: MicrosoftYaHeiUI; font-weight: 400; color: #373d41; line-height: 38px; } .aboutUs .about-content { width: 1200px; height: 420px; background: #00ff7d; box-shadow: 0 0 8px 0 #c7c7c7; position: relative; } .aboutUs .about-content img { width: 100%; height: 100%; } .aboutUs .about-content p { position: absolute; top: 95px; right: 30px; width: 360px; height: 138px; font-size: 14px; font-family: MicrosoftYaHei; font-weight: 400; color: #ffffff; } .aboutUs .about-content .right-content { text-align: left; line-height: 30px; } .aboutUs .about-content .more-content { position: absolute; width: 98px; height: -36px; border: 2px solid #ffffff; border-radius: 6px; right: 150px; bottom: 65px; background: #eee; cursor: pointer; }