#power{ width:100%; height:auto; margin:0 auto; padding:0px; } #power_video{ width:100%; min-width:1200px; height:644px; overflow:hidden; } #power_video .mvideo{ width:100%; height:644px; position:absolute; } #power_video h2{ width:760px; height:80px; font-size:48px; line-height:68px; margin:233px auto 10px; color:#ffffff; text-align:center; } #power_video p{ width:800px; height:100px; font-size:18px; line-height:28px; margin:10px auto; color:#ffffff; text-align:center; } #power_video .lunbo_video_s{ width:1920px; height:644px; } #power_diagram_pc{ width:100%; min-width:1200px; height:966px; padding-top:0px; background:#111111; float:left; } #power_diagram_pc_content{ width:1200px; height:auto; margin: 0 auto; padding-top:10px; } #power_diagram_pc_content h2{ width:760px; height:50px; font-size:40px; line-height:60px; margin:75px auto 10px; color:#ffffff; text-align:center; } #power_diagram_pc_show{ width:1200px; height:auto; float:left; margin:0px 0px 28px; } #power_diagram_pc_show>ol{ width:1200px; margin:0 auto; } #power_diagram_pc_show>ol>li{ display:none; } #power_diagram_pc_show>ol>li:first-child{ display:block; } #power_diagram_pc_btn{ width:1200px; height:250px; margin: 0 auto; } #power_diagram_pc_btn li{ width:300px; height:250px; float:left; cursor:pointer; } #power_diagram_pc_btn ol{ width:100%; height:auto; padding-left:40px; } #power_diagram_pc_btn ol li{ width:100%; height:30px; font-size:16px; line-height:30px; color:#ffffff; } #diagram_pc_btn_1 h2,#diagram_pc_btn_2 h2,#diagram_pc_btn_3 h2,#diagram_pc_btn_4 h2{ width:100%; height: 36px; margin:10px auto; font-size: 24px; line-height: 36px; display: block; text-align:center; color:#ffffff; } #diagram_pc_btn_1 ol li,#diagram_pc_btn_2 ol li,#diagram_pc_btn_3 ol li,#diagram_pc_btn_4 ol li{ height:30px; line-height:30px; color:#ffffff; text-align:left; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 12px; padding-left:20px; } #diagram_pc_btn_1,#diagram_pc_btn_2,#diagram_pc_btn_3,#diagram_pc_btn_4{ padding:10px 40px; } #power_diagram_pc_btn .p_active>h2,#power_diagram_pc_btn .p_active>ol>li{ color:#8fc31f; } #power_diagram_pc_btn .p_active>ol>li{ color:#8fc31f; background:url(../images/app/power/diagram_m2_pro_d2.png) no-repeat 2px 12px; } #power_automation_pc{ width:100%; min-width:1200px; height:970px; padding-top: 0px; float:left; background:url(../images/app/power/automation_bg.jpg) #000 top center; } #power_automation_pc_content{ width:1200px; height:auto; margin: 0 auto; padding-top:10px; } #power_automation_pc_content h2{ width:760px; height:50px; font-size:40px; line-height:60px; margin:75px auto 50px; color:#ffffff; text-align:center; } #power_automation_pc_show{ width:430px; height:766px; float:left; margin:0px 0px 28px; } #power_automation_pc_show>ol{ width:430px; height:766px; margin:0 auto; } #power_automation_pc_show>ol>li{ display:none; } #power_automation_pc_show>ol>li:first-child{ display:block; } #power_automation_pc_text{ width:590px; height:726px; float:left; margin-top:40px; cursor:pointer; } #automation_pc_text_1{ width:506px; height:163px; float:left; margin:25px 36px; background:rgb(255,255,255,0.1); border-radius:6px; } #automation_pc_text_2{ width:506px; height:163px; float:left; margin:25px 36px; background:rgb(255,255,255,0.1); border-radius:6px; } #automation_pc_text_3{ width:506px; height:186px; float:left; margin:25px 36px; background:rgb(255,255,255,0.1); border-radius:6px; } .automation_pc_pro_1{ width:50%; height:164px; float:left; } .automation_pc_pro_1 h3{ font-size:22px; line-height:40px; color:#8fc31f; text-align:center; font-weight:normal; margin-top:8px; color:#ffffff; } .automation_pc_pro_2{ width:50%; height:164px; float:left; padding-left:10px; } .automation_pc_pro_2 h3{ font-size:16px; line-height:28px; font-weight:normal; margin-top:30px; margin-bottom:4px; color:#ffffff; } .automation_pc_pro_2 ul{ width:100%; height:auto; color:#585858; } .automation_pc_pro_2 ul li{ width:100%; font-size:14px; line-height:22px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 9px; padding-left:20px; color:#ffffff; } .automation_pc_pro_ico1{ width:50px; height:50px; margin:36px auto 0px; background:url(../images/app/power/automation_pc_pro_ico1.png) center center / 50px 50px no-repeat; background-size:cover; } .automation_pc_pro_ico2{ width:50px; height:50px; margin:36px auto 0px; background:url(../images/app/power/automation_pc_pro_ico2.png) center center / 50px 50px no-repeat; background-size:cover; } .automation_pc_pro_ico3{ width:50px; height:50px; margin:36px auto 0px; background:url(../images/app/power/automation_pc_pro_ico3.png) center center / 50px 50px no-repeat; background-size:cover; } #power_automation_pc_text .p_active{ background:rgb(143,195,31,0.1); border:1px solid #314602; } #power_automation_pc_text .p_active h3{ color:#8fc31f; } #power_automation_pc_text .p_active li{ background:url(../images/app/power/diagram_m2_pro_d2.png) no-repeat 2px 9px; color:#8fc31f; } #power_automation_pc_text .p_active .automation_pc_pro_ico1{ background:url(../images/app/power/automation_pc_pro_ico4.png) center center / 50px 50px no-repeat; } #power_automation_pc_text .p_active .automation_pc_pro_ico2{ background:url(../images/app/power/automation_pc_pro_ico5.png) center center / 50px 50px no-repeat; } #power_automation_pc_text .p_active .automation_pc_pro_ico3{ background:url(../images/app/power/automation_pc_pro_ico6.png) center center / 50px 50px no-repeat; } .power-button{ width:180px; height:50px; background:#89c122; color:#ffffff !important; font-size:16px; line-height:50px; text-align:center; display:block; float:left; border-radius:4px; margin:5px 12px; } .power-button:hover{ background:#83b31d; } @media (min-width: 300px) { #power_video{ width:100%; min-width:300px; height:175px; overflow:hidden; background:url(../images/app/power/power_video_s.jpg) no-repeat; background-size:100% 100%; } #power_video .mvideo{ width:100%; height:175px; position:absolute; } #power_video h2{ width:260px; height:32px; font-size:20px; line-height:32px; margin:73px auto 6px; color:#ffffff; text-align:center; font-weight:bold; } #power_video p{ display:none; } #power_video .lunbo_video_s{ width:300px; height:101px; display:none; } #power_diagram_mobile{ width:100%; height:auto; background:#111111; margin: 0px auto; padding:36px 10px 20px; } #power_diagram_mobile h2{ font-size:24px; line-height:38px; margin:14px auto 10px; color:#ffffff; text-align:center; } #power_diagram_mobile_content{ width:100%; max-width:780px; margin:0 auto; } #power_diagram_mobile_btn{ width:100%; height:auto; overflow:hidden; margin-top:20px; } #power_diagram_mobile_btn li{ width:50%; float:left; margin-bottom:10px; } #power_diagram_mobile_btn h2{ font-size:17px; line-height:36px; color:#ffffff; text-align:left; margin:0px auto 0px; } #power_diagram_mobile_btn ol{ width:132px; height:auto; overflow:hidden; } #power_diagram_mobile_btn ol li{ width:100%; height:auto; font-size:12px; line-height:20px; color:#ffffff; text-align:left; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 8px; padding-left:16px; } #power_automation_mobile{ width:100%; height:auto; background:#1b1b1b; margin: 0px auto; padding:36px 10px 20px; overflow:hidden; } #power_automation_mobile h2{ font-size:24px; line-height:38px; margin:14px auto 10px; color:#ffffff; text-align:center; } #power_automation_mobile_text{ width:100%; height:auto; float:left; margin:16px 0px 30px; } #automation_mobile_text_1{ width:270px; height:136px; margin:15px auto; background:rgb(255,255,255,0.1); border-radius:6px; } #automation_mobile_text_2{ width:270px; height:146px; margin:15px auto; background:rgb(255,255,255,0.1); border-radius:6px; } #automation_mobile_text_3{ width:270px; height:146px; margin:15px auto; background:rgb(255,255,255,0.1); border-radius:6px; } .automation_mobile_pro_1{ width:36%; height:144px; float:left; } .automation_mobile_pro_1 h3{ font-size:14px; line-height:22px; color:#8fc31f; text-align:center; font-weight:normal; margin-top:8px; color:#ffffff; } .automation_mobile_pro_2{ width:64%; height:144px; float:left; padding-left:10px; } .automation_mobile_pro_2 h3{ font-size:14px; line-height:26px; font-weight:normal; margin-top:20px; margin-bottom:4px; color:#ffffff; } .automation_mobile_pro_2 ul{ width:100%; height:auto; color:#585858; } .automation_mobile_pro_2 ul li{ width:100%; font-size:12px; line-height:22px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 7px; padding-left:20px; color:#ffffff; } .automation_mobile_pro_ico1{ width:40px; height:40px; margin:26px auto 0px; background:url(../images/app/power/automation_pc_pro_ico1.png) center center no-repeat; background-size:cover; } .automation_mobile_pro_ico2{ width:40px; height:40px; margin:26px auto 0px; background:url(../images/app/power/automation_pc_pro_ico2.png) center center no-repeat; background-size:cover; } .automation_mobile_pro_ico3{ width:40px; height:40px; margin:26px auto 0px; background:url(../images/app/power/automation_pc_pro_ico3.png) center center no-repeat; background-size:cover; } #power_diagram_m1{ width:100%; height:auto; background:#f0f1f2; margin: 0px auto; padding:33px 10px 20px; overflow:hidden; } #power_diagram_m1 h2{ font-size:24px; line-height:38px; margin:17px auto 10px; color:#000000; text-align:center; } .diagram_m1_pro{ width:270px; height:auto; margin:13px auto 26px; background:#ffffff; overflow:hidden; } .diagram_m1_pro_l{ width:100%; height:180px; float:left; } .diagram_m1_pro_r{ width:100%; height:130px; float:left; } .diagram_m1_pro_r1{ width:40%; height:auto; float:left; } .diagram_m1_pro_r1 h3{ font-size:14px; line-height:26px; color:#8fc31f; text-align:center; margin-top:8px; } .diagram_m1_pro_r2{ width:60%; height:auto; float:left; padding-top:10px; padding-left:10px; } .diagram_m1_pro_r2 h3{ font-size:14px; line-height:26px; font-weight:bold; margin-top:2px; margin-bottom:2px; } .diagram_m1_pro_r2 ul{ width:100%; height:auto; color:#585858; } .diagram_m1_pro_r2 ul li{ width:100%; font-size:12px; line-height:22px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 8px; padding-left:14px; } .diagram_m1_pro_ico1{ width:60px; height:60px; margin:10px auto 0px; background:url(../images/app/power/m1_pro_ico1.jpg) center center no-repeat; background-size:cover; } .diagram_m1_pro_ico2{ width:60px; height:60px; margin:10px auto 0px; background:url(../images/app/power/m1_pro_ico2.jpg) center center no-repeat; background-size:cover; } #power_diagram_m2{ width:100%; height:auto; background:#f0f1f2; margin: 0px auto; padding:0px 10px 40px; overflow:hidden; } #power_diagram_m2_content{ width:100%; height:auto; margin:0px auto; overflow:hidden; } #power_diagram_m2 h2{ font-size:24px; line-height:38px; color:#333; text-align:center; margin:4px auto 4px auto; display:block; } #power_diagram_m2 a{ color:#000; } .diagram_m2_group{ width:100%; height:auto; float:left; background:#ffffff; margin:10px 26px 16px 0px; overflow:hidden; padding:0px; } .diagram_m2_group h2{ font-size:18px !important; line-height:24px !important; color:#1d1d1f !important; margin:25px auto 10px auto !important; } .diagram_m2_pro{ width:280px; height:100px; margin:5px auto 10px; } .diagram_m2_pro_l{ width:100px; height:100px; float:left; padding-top:10px; } .diagram_m2_pro_r{ width:180px; height:100px; float:left; padding-left:10px; } .diagram_m2_pro_r h3{ font-size:14px; line-height:26px; font-weight:bold; margin-top:5px; margin-bottom:0px; } .diagram_m2_pro_r ul{ width:100%; height:auto; color:#585858; } .diagram_m2_pro_r ul li{ width:100%; font-size:12px; line-height:20px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 8px; padding-left:20px; } .diagram_m2_btn{ width:274px; height:70px; margin:10px auto; overflow:hidden; } .power-button{ width:120px; height:30px; background:#89c122; color:#ffffff !important; font-size:12px; line-height:30px; text-align:center; display:block; float:left; border-radius:4px; margin:5px 8px; } } /*閽堝iphone5s*/ @media (min-width: 315px) { #power_video{ height:184px; } #power_video .mvideo{ width:100%; height:184px; position:absolute; } #power_video h2{ width:260px; height:32px; font-size:20px; line-height:32px; margin:75px auto 6px; } .diagram_m1_pro{ width:284px; height:auto; margin:13px auto 26px; } .diagram_m1_pro_l{ width:100%; height:190px; float:left; } .diagram_m1_pro_r{ width:100%; height:130px; float:left; } } /*閽堝1080*1920鐨刟ndroid*/ @media (min-width: 360px) { #power_video{ height:210px; } #power_video .mvideo{ width:100%; height:210px; position:absolute; } #power_video h2{ width:300px; height:32px; font-size:20px; line-height:32px; margin:80px auto 6px; } #power_diagram_mobile_btn{ width:100%; height:auto; overflow:hidden; margin-top:20px; } #power_diagram_mobile_btn li{ width:50%; float:left; margin-bottom:20px; padding-left:8px; } #power_diagram_mobile_btn h2{ font-size:18px; line-height:36px; color:#ffffff; text-align:left; margin:0px auto 0px; } #power_diagram_mobile_btn ol{ width:156px; height:auto; overflow:hidden; } #power_diagram_mobile_btn ol li{ width:100%; height:26px; font-size:14px; line-height:24px; color:#ffffff; text-align:left; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 8px; padding-left:16px; margin-bottom:0px; } #power_automation_mobile{ width:100%; height:auto; background:#1b1b1b; margin: 0px auto; padding:36px 10px 20px; overflow:hidden; } #power_automation_mobile h2{ font-size:24px; line-height:38px; margin:14px auto 10px; color:#ffffff; text-align:center; } #power_automation_mobile_text{ width:100%; height:auto; float:left; margin:16px 0px 30px; } #automation_mobile_text_1{ width:320px; height:136px; margin:15px auto; background:rgb(255,255,255,0.1); border-radius:6px; } #automation_mobile_text_2{ width:320px; height:136px; margin:15px auto; background:rgb(255,255,255,0.1); border-radius:6px; } #automation_mobile_text_3{ width:320px; height:150px; margin:15px auto; background:rgb(255,255,255,0.1); border-radius:6px; } .automation_mobile_pro_1{ width:40%; height:144px; float:left; padding:0 6px; } .automation_mobile_pro_1 h3{ font-size:14px; line-height:22px; color:#8fc31f; text-align:center; font-weight:normal; margin-top:8px; color:#ffffff; } .automation_mobile_pro_2{ width:60%; height:144px; float:left; padding-left:10px; } #power_diagram_m1{ width:100%; min-width:360px; height:auto; } .diagram_m1_pro{ width:310px; height:auto; margin:13px auto 26px; } .diagram_m1_pro_l{ width:100%; height:208px; float:left; } #power_diagram_m2{ width:100%; min-width:360px; height:auto; } #power_diagram_m2_content{ width:310px; height:auto; margin:0px auto; } .diagram_m2_pro{ width:300px; height:100px; margin:5px auto 10px; } .diagram_m2_pro_l{ width:100px; height:100px; float:left; padding-top:10px; } .diagram_m2_pro_r{ width:200px; height:100px; float:left; padding-left:10px; } } /*閽堝iphone6*/ @media (min-width: 375px) { #power_video{ height:219px; } #power_video .mvideo{ width:100%; height:219px; position:absolute; } #power_video h2{ width:300px; height:32px; font-size:22px; line-height:34px; margin:82px auto 6px; } #power_diagram_mobile_btn li{ width:50%; float:left; margin-bottom:20px; padding-left:12px; } #power_diagram_mobile_btn ol{ width:162px; height:auto; overflow:hidden; } #automation_mobile_text_1{ width:330px; height:136px; margin:15px auto; } #automation_mobile_text_2{ width:330px; height:136px; margin:15px auto; } #automation_mobile_text_3{ width:330px; height:150px; margin:15px auto; } } /*閽堝鍏ㄩ潰灞忓畨鍗?/ @media (min-width: 390px) { #power_video{ height:228px; } #power_video .mvideo{ width:100%; height:228px; position:absolute; } #power_video h2{ width:300px; height:34px; font-size:22px; line-height:34px; margin:86px auto 6px; } #power_diagram_mobile_btn{ width:100%; height:auto; overflow:hidden; margin-top:20px; } #power_diagram_mobile_btn li{ width:50%; float:left; margin-bottom:20px; padding-right:20px; } #power_diagram_m1 { width:100%; min-width:390px; height:auto; } .diagram_m1_pro{ width:330px; height:auto; margin:13px auto 26px; } .diagram_m1_pro_l{ width:100%; height:220px; float:left; } .diagram_m1_pro_ico1{ margin:14px auto 0px; } .diagram_m1_pro_ico2{ margin:14px auto 0px; } #power_diagram_m2{ width:100%; min-width:390px; height:auto; } #power_diagram_m2_content{ width:330px; height:auto; margin:0px auto; } .diagram_m2_pro{ width:310px; height:100px; margin:5px auto 10px; } .diagram_m2_pro_l{ width:100px; height:100px; float:left; padding-top:10px; margin-right:10px; } .diagram_m2_pro_r{ width:200px; height:100px; float:left; padding-left:10px; } } @media (min-width: 400px) { #power_video{ height:234px; } #power_video .mvideo{ width:100%; height:234px; position:absolute; } #power_video h2{ width:300px; height:34px; font-size:22px; line-height:34px; margin:88px auto 6px; } #automation_mobile_text_1{ width:340px; height:136px; margin:15px auto; } #automation_mobile_text_2{ width:340px; height:136px; margin:15px auto; } #automation_mobile_text_3{ width:340px; height:150px; margin:15px auto; } } /*閽堝iphone6s plus*/ @media (min-width: 410px) { #power_video{ height:239px; } #power_video .mvideo{ width:100%; height:239px; position:absolute; } #power_video h2{ width:300px; height:36px; font-size:24px; line-height:36px; margin:92px auto 6px; } #power_automation_mobile{ width:100%; height:auto; background:#1b1b1b; margin: 0px auto; padding:36px 10px 20px; overflow:hidden; } #power_automation_mobile h2{ font-size:24px; line-height:38px; margin:14px auto 10px; color:#ffffff; text-align:center; } #power_automation_mobile_text{ width:100%; height:auto; float:left; margin:16px 0px 30px; } #automation_mobile_text_1{ width:370px; height:136px; margin:15px auto; background:rgb(255,255,255,0.1); border-radius:6px; } #automation_mobile_text_2{ width:370px; height:136px; margin:15px auto; background:rgb(255,255,255,0.1); border-radius:6px; } #automation_mobile_text_3{ width:370px; height:150px; margin:15px auto; background:rgb(255,255,255,0.1); border-radius:6px; } .automation_mobile_pro_1{ width:40%; height:144px; float:left; padding:0 6px; } .automation_mobile_pro_1 h3{ font-size:16px; line-height:22px; color:#8fc31f; text-align:center; font-weight:normal; margin-top:8px; color:#ffffff; } .automation_mobile_pro_2{ width:60%; height:144px; float:left; padding-left:10px; } .automation_mobile_pro_2 h3{ font-size:16px; line-height:26px; font-weight:normal; margin-top:20px; margin-bottom:4px; color:#ffffff; } #power_diagram_m1 { width:100%; min-width:390px; height:auto; } .diagram_m1_pro{ width:360px; height:auto; margin:13px auto 26px; } .diagram_m1_pro_l{ width:100%; height:240px; float:left; } .diagram_m1_pro_r1 h3{ font-size:16px; line-height:28px; color:#8fc31f; text-align:center; margin-top:8px; } .diagram_m1_pro_r2 h3{ font-size:16px; line-height:28px; font-weight:bold; margin-top:2px; margin-bottom:2px; } .diagram_m1_pro_r2 ul li{ width:100%; font-size:12px; line-height:22px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 8px; padding-left:14px; } #power_diagram_m2 { width:100%; min-width:390px; height:auto; } #power_diagram_m2_content{ width:360px; height:auto; margin:0px auto; } .diagram_m2_pro{ width:330px; height:100px; margin:5px auto 10px; } .diagram_m2_pro_l{ width:120px; height:100px; float:left; padding-top:10px; margin-right:10px; } .diagram_m2_pro_r{ width:200px; height:100px; float:left; padding-left:10px; } } @media (min-width: 414px) { #power_video{ height:242px; } #power_video .mvideo{ width:100%; height:242px; position:absolute; } #power_video h2{ width:320px; height:36px; font-size:24px; line-height:36px; margin:93px auto 6px; } #power_diagram_mobile_btn li{ width:50%; float:left; margin-bottom:20px; padding-left:18px; } } /*閽堝1440*2560鐨刟ndroid*/ @media (min-width: 480px) { #power_video{ height:280px; } #power_video .mvideo{ width:100%; height:280px; position:absolute; } #power_video h2{ width:340px; height:38px; font-size:24px; line-height:36px; margin:93px auto 6px; } #power_diagram_mobile_btn li{ width:50%; float:left; margin-bottom:20px; padding-left:24px; } #power_automation_mobile{ width:100%; height:auto; background:#1b1b1b; margin: 0px auto; padding:36px 10px 20px; overflow:hidden; } #power_automation_mobile h2{ font-size:24px; line-height:38px; margin:14px auto 10px; color:#ffffff; text-align:center; } #power_automation_mobile_text{ width:100%; height:auto; float:left; margin:16px 0px 30px; } #automation_mobile_text_1{ width:400px; height:136px; margin:20px auto; background:rgb(255,255,255,0.1); border-radius:6px; } #automation_mobile_text_2{ width:400px; height:136px; margin:20px auto; background:rgb(255,255,255,0.1); border-radius:6px; } #automation_mobile_text_3{ width:400px; height:160px; margin:20px auto; background:rgb(255,255,255,0.1); border-radius:6px; } .automation_mobile_pro_1{ width:40%; height:144px; float:left; padding:0 6px; } .automation_mobile_pro_1 h3{ font-size:16px; line-height:22px; color:#8fc31f; text-align:center; font-weight:normal; margin-top:15px; color:#ffffff; } .automation_mobile_pro_2{ width:60%; height:144px; float:left; padding-left:10px; } .automation_mobile_pro_2 h3{ font-size:16px; line-height:26px; font-weight:normal; margin-top:20px; margin-bottom:4px; color:#ffffff; } .automation_mobile_pro_2 ul li{ width:100%; font-size:14px; line-height:24px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 7px; padding-left:20px; color:#ffffff; } #power_diagram_m1{ width:100%; min-width:480px; height:auto; } .diagram_m1_pro{ width:420px; height:auto; margin:13px auto 26px; } .diagram_m1_pro_l{ width:100%; height:280px; float:left; } #power_diagram_m2 { width:100%; min-width:480px; height:auto; } #power_diagram_m2_content{ width:420px; height:auto; margin:0px auto; } .diagram_m2_pro{ width:380px; height:100px; margin:5px auto 10px; } .diagram_m2_pro_l{ width:140px; height:100px; float:left; padding-top:0px; margin-right:20px; } .diagram_m2_pro_r{ width:220px; height:100px; float:left; padding-left:10px; } } @media (min-width: 500px) { #power_video{ height:292px; } #power_video .mvideo{ width:100%; height:292px; position:absolute; } #power_video h2{ width:360px; height:40px; font-size:26px; line-height:38px; margin:120px auto 6px; } #power_diagram_mobile_btn{ width:420px; height:auto; overflow:hidden; margin:20px auto 10px; } #power_diagram_m1 { width:100%; min-width:500px; height:auto; } #power_diagram_m2 { width:100%; min-width:500px; height:auto; } .diagram_m2_group{ padding:0px 0px 10px; } .diagram_m2_btn{ width:360px; height:70px; margin:10px auto; overflow:hidden; } .power-button{ width:140px; height:30px; background:#89c122; color:#ffffff !important; font-size:12px; line-height:30px; text-align:center; display:block; float:left; border-radius:4px; margin:15px 18px 5px; } } @media (min-width: 600px) { #power_video{ height:350px; } #power_video .mvideo{ width:100%; height:350px; position:absolute; } #power_video h2{ width:400px; height:50px; font-size:30px; line-height:42px; } #power_diagram_mobile h2{ font-size:28px; line-height:40px; margin:2px auto 10px; } #power_diagram_mobile_btn{ width:480px; height:auto; overflow:hidden; margin:20px auto 10px; } #power_diagram_mobile_btn h2{ font-size:18px; line-height:36px; color:#ffffff; text-align:left; margin:0px auto 0px;} #power_automation_mobile h2{ font-size:28px; line-height:40px; margin:2px auto 10px; } #power_diagram_m1 { width:100%; min-width:600px; height:auto; padding:35px 10px 20px; } #power_diagram_m1 h2{ font-size:28px; line-height:40px; margin:2px auto 10px; } .diagram_m1_pro{ width:270px; height:auto; margin:13px 10px 26px; background:#ffffff; overflow:hidden; float:left; } .diagram_m1_pro_l{ width:100%; height:180px; float:left; } .diagram_m1_pro_r{ width:100%; height:130px; float:left; } .diagram_m1_pro_r1{ width:40%; height:auto; float:left; } .diagram_m1_pro_r1 h3{ font-size:14px; line-height:26px; color:#8fc31f; text-align:center; margin-top:8px; } .diagram_m1_pro_r2{ width:60%; height:auto; float:left; padding-top:10px; padding-left:10px; } .diagram_m1_pro_r2 h3{ font-size:14px; line-height:26px; font-weight:bold; margin-top:2px; margin-bottom:2px; } .diagram_m1_pro_r2 ul{ width:100%; height:auto; color:#585858; } .diagram_m1_pro_r2 ul li{ width:100%; font-size:12px; line-height:20px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 8px; padding-left:14px; } .diagram_m1_pro_ico1{ width:60px; height:60px; margin:10px auto 0px; background:url(../images/app/power/m1_pro_ico1.jpg) center center no-repeat; background-size:cover; } .diagram_m1_pro_ico2{ width:60px; height:60px; margin:10px auto 0px; background:url(../images/app/power/m1_pro_ico2.jpg) center center no-repeat; background-size:cover; } #power_diagram_m2 { width:100%; min-width:600px; height:auto; padding:0px 10px 40px; } #power_diagram_m2 h2{ font-size:28px; line-height:40px; } #power_diagram_m2_content{ width:100%; height:auto; margin:0px auto; overflow:hidden; } .diagram_m2_group{ width:270px; padding:0px; margin:10px 9px 16px 10px; float:left; } .diagram_m2_pro{ width:270px; height:100px; margin:5px auto 10px; } .diagram_m2_pro_l{ width:90px; height:100px; float:left; padding-top:10px;margin-right:0px; } .diagram_m2_pro_r{ width:180px; height:100px; float:left; padding-left:10px; } } @media (min-width: 700px) { #power_video{ height:409px; } #power_video .mvideo{ width:100%; height:409px; position:absolute; } #power_video h2{ width:500px; height:60px; font-size:38px; line-height:52px; margin:140px auto 6px; } #power_video p{ width:600px; height:100px; font-size:18px; line-height:28px; margin:10px auto; color:#ffffff; text-align:center; display:block; } #power_diagram_mobile_btn{ width:670px; height:auto; overflow:hidden; margin:20px auto 10px; } #power_diagram_mobile_btn li{ width:167px; float:left; margin-bottom:20px; padding-left:18px; padding-right:0px; } #power_diagram_mobile h2{ font-size:32px; line-height:48px; } #power_diagram_mobile_btn h2{ font-size:18px; line-height:36px; color:#ffffff; text-align:left; margin:0px auto 0px; } #power_diagram_m1 { width:100%; min-width:700px; height:auto; } #power_diagram_m1 h2{ font-size:32px; line-height:48px; } .diagram_m1_pro{ width:320px; height:auto; } .diagram_m1_pro_l{ width:100%; height:214px; float:left; } #power_diagram_m2 { width:100%; min-width:700px; height:auto; } #power_diagram_m2 h2{ font-size:32px; line-height:48px; } .diagram_m2_group{ width:320px; padding:0px; margin:10px 9px 16px 11px; float:left; } .diagram_m2_pro{ width:320px; height:100px; margin:5px auto 10px; } .diagram_m2_pro_l{ width:110px; height:100px; float:left; padding-top:10px; margin-left:6px;margin-right:4px; } .diagram_m2_pro_r{ width:200px; height:100px; float:left; padding-left:10px; } .diagram_m2_btn{ width:600px; height:70px; margin:10px auto; overflow:hidden; padding:0 120px; } } @media (min-width: 767px) { #power_video{ height:448px; background-size:100% 100%;} #power_video .mvideo{ width:767px; height:448px; position:absolute; } #power_video h2{ width:500px; height:60px; font-size:38px; line-height:52px; margin:140px auto 6px; } #power_diagram_mobile_btn{ width:720px; height:auto; overflow:hidden; margin:20px auto 10px; } #power_diagram_mobile_btn li{ width:180px; float:left; margin-bottom:20px; padding-left:24px; padding-right:0px; } #power_automation_mobile_text{ width:100%; height:auto; float:left; margin:16px 0px 30px; } #power_diagram_mobile h2,#power_automation_mobile h2{ font-size:40px; line-height:60px; margin:30px auto 10px; } #power_diagram_mobile_btn h2{ font-size:18px; line-height:36px; color:#ffffff; text-align:left; margin:0px auto 0px; } #automation_mobile_text_1{ width:340px; height:146px; margin:20px 16px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } #automation_mobile_text_2{ width:340px; height:146px; margin:20px 16px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } #automation_mobile_text_3{ width:340px; height:156px; margin:20px 16px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } .automation_mobile_pro_1{ width:40%; height:144px; float:left; padding:0 6px; } .automation_mobile_pro_1 h3{ font-size:16px; line-height:22px; color:#8fc31f; text-align:center; font-weight:normal; margin-top:15px; color:#ffffff; } .automation_mobile_pro_2{ width:60%; height:144px; float:left; padding-left:10px; } .automation_mobile_pro_2 h3{ font-size:16px; line-height:26px; font-weight:normal; margin-top:20px; margin-bottom:4px; color:#ffffff; } .automation_mobile_pro_2 ul li{ width:100%; font-size:12px; line-height:22px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 7px; padding-left:20px; color:#ffffff; } #power_diagram_m1{ width:100%; min-width:767px; height:auto; padding:60px 30px 20px; } #power_diagram_m1 h2{ font-size:40px; line-height:60px; color:#333; text-align:center; margin:6px auto 7px auto; } .diagram_m1_pro{ width:330px; height:auto; } .diagram_m1_pro_l{ width:100%; height:214px; float:left; } #power_diagram_m2 { width:100%; min-width:767px; height:auto; } #power_diagram_m2 h2{ font-size:40px; line-height:60px; color:#333; text-align:center; margin:20px auto 7px auto; } #power_diagram_m2_content{ width:100%; height:auto; padding:0px 10px; overflow:hidden; } .diagram_m2_group{ width:330px; padding:0px; margin:10px 0px 16px 20px; float:left; } .diagram_m2_pro{ width:330px; height:100px; margin:5px auto 10px; } .diagram_m2_pro_l{ width:120px; height:100px; float:left; padding-top:10px; margin-left:6px;margin-right:4px; } .diagram_m2_pro_r{ width:200px; height:100px; float:left; padding-left:10px; } .diagram_m2_btn{ width:600px; height:70px; margin:10px auto; overflow:hidden; padding:0 106px; } } @media (min-width: 770px) { #power_video{ height:450px; background-size:100% 100%;} #power_video .mvideo{ width:770px; height:450px; position:absolute; } } @media (min-width: 785px) { #power_video{ height:458px; background-size:100% 100%;} #power_video .mvideo{ width:785px; height:458px; position:absolute; } } @media (min-width: 800px) { #power_diagram_mobile_btn{ width:740px; height:auto; overflow:hidden; margin:20px auto 10px; } #power_diagram_mobile_btn li{ width:184px; float:left; margin-bottom:20px; padding-left:24px; padding-right:0px; } #automation_mobile_text_1{ width:344px; height:146px; margin:20px 20px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } #automation_mobile_text_2{ width:344px; height:146px; margin:20px 20px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } #automation_mobile_text_3{ width:344px; height:156px; margin:20px 20px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } } @media (min-width: 880px) { #power_video{ height:514px; background-size:100% 100%;} #power_video .mvideo{ width:880px; height:514px; position:absolute; } #power_video p{ width:660px; } #power_diagram_mobile h2{ font-size:40px; line-height:60px; } #power_diagram_mobile_btn h2{ font-size:18px; line-height:36px; color:#ffffff; text-align:left; margin:0px auto 0px; } #power_automation_mobile{ padding:36px 10px 40px; } #power_automation_mobile h2{ font-size:40px; line-height:60px; } #power_automation_mobile_text{ width:780px; height:auto; float:none; margin:16px auto 30px; } #automation_mobile_text_1{ width:360px; height:146px; margin:20px 13px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } #automation_mobile_text_2{ width:360px; height:146px; margin:20px 13px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } #automation_mobile_text_3{ width:360px; height:156px; margin:20px 13px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } #power_diagram_m1 { width:100%; min-width:880px; height:auto; padding:60px 40px 20px; } .diagram_m1_pro{ width:360px; height:auto; margin:13px 20px 26px; } .diagram_m1_pro_l{ width:100%; height:240px; float:left; } #power_diagram_m2 { width:100%; min-width:880px; height:auto; } #power_diagram_m2_content{ width:100%; height:auto; padding:0px 31px; overflow:hidden; } .diagram_m2_group{ width:360px; padding:0px; margin:10px 18px 26px 20px; float:left; } .diagram_m2_pro{ width:360px; height:100px; margin:5px auto 10px; } .diagram_m2_pro_l{ width:120px; height:100px; float:left; padding-top:10px; margin-left:10px; margin-right:6px; } .diagram_m2_pro_r{ width:220px; height:100px; float:left; padding-left:10px; } .diagram_m2_btn{ width:700px; height:70px; margin:10px auto; overflow:hidden; padding:0 132px; } } @media (min-width: 980px) { #power_video{ height:572px; background-size:100% 100%; } #power_video .mvideo{ width:980px; height:572px; position:absolute; } #power_diagram_m1{ width:100%; min-width:980px; height:auto; padding:60px 46px 20px; } .diagram_m1_pro{ width:400px; height:auto; margin:13px 22px 26px; } .diagram_m1_pro_l{ width:100%; height:268px; float:left; } #power_diagram_m2 { width:100%; min-width:980px; height:auto; } #power_diagram_m2_content{ width:100%; height:auto; padding:0px 38px; overflow:hidden; } .diagram_m2_group{ width:400px; padding:0px; margin:10px 18px 26px 20px; float:left; } .diagram_m2_pro{ width:400px; height:110px; margin:5px auto 10px; } .diagram_m2_pro_l{ width:126px; height:110px; float:left; padding-top:10px; margin-left:10px; margin-right:6px; } .diagram_m2_pro_r{ width:250px; height:110px; float:left; padding-left:10px; } .diagram_m2_btn{ width:800px; height:70px; margin:10px auto; overflow:hidden; padding:0 210px; } } @media (min-width: 1024px) { #power{ width:100%; height:auto; margin:0 auto; padding:0px;} #power_video{ width:100%; min-width:1024px; height:644px;overflow:hidden; background:none;} #power_video .mvideo{ width:100%; height:644px; position:absolute; } #power_video h2{ width:760px; height:80px; font-size:48px; line-height:68px; margin:233px auto 10px; color:#ffffff; text-align:center; } #power_video p{ width:800px; height:100px; font-size:18px; line-height:28px; margin:10px auto; color:#ffffff; text-align:center; } #power_video .lunbo_video_s{ width:1920px; height:644px; display:block; } #power_diagram_m1{ width:100%; min-width:1024px; height:auto; background:#f0f1f2; padding:36px 10px 20px; overflow:hidden; } #power_diagram_m1 h2{ font-size:40px; line-height:60px; color:#333; text-align:center; margin:65px auto 30px auto; display:block; } .diagram_m1_pro{ width:1024px; height:342px; margin:13px auto 26px; float:none; } .diagram_m1_pro_r{ width:50%; height:342px; float:right; background:#ffffff; } .diagram_m1_pro_l{ width:50%; height:342px; float:right; } .diagram_m1_pro_r1{ width:50%; height:342px; float:left; } .diagram_m1_pro_r1 h3{ font-size:22px; line-height:40px; color:#8fc31f; text-align:center; margin-top:8px; } .diagram_m1_pro_r2{ width:50%; height:342px; float:left; padding-top:104px; padding-left:10px; } .diagram_m1_pro_r2 h3{ font-size:20px; line-height:42px; font-weight:bold; margin-top:0px; margin-bottom:10px; } .diagram_m1_pro_r2 ul{ width:100%; height:auto; color:#585858; } .diagram_m1_pro_r2 ul li{ width:100%; font-size:16px; line-height:32px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 13px; padding-left:20px; } .diagram_m1_pro_ico1{ width:100px; height:100px; margin:100px auto 0px; background:url(../images/app/power/m1_pro_ico1.jpg) center center no-repeat; background-size:cover; } .diagram_m1_pro_ico2{ width:100px; height:100px; margin:100px auto 0px; background:url(../images/app/power/m1_pro_ico2.jpg) center center no-repeat; background-size:cover; } #power_diagram_m2{ width:100%; height:auto; background:#f0f1f2; margin: 0px auto; padding:33px 10px 110px; overflow:hidden; } #power_diagram_m2_content{ width:1024px; height:auto; margin:0px auto; overflow:hidden; padding:0px; } #power_diagram_m2 h2{ font-size:40px; line-height:60px; color:#333; text-align:center; margin:4px auto 30px auto; display:block; } #power_diagram_m2 a{ color:#000; } .diagram_m2_group{ width:333px; height:560px; float:left; background:#ffffff; margin:10px 12px 60px 0px; overflow:hidden; } .diagram_m2_group h2{ font-size:24px !important; line-height:36px !important; color:#1d1d1f !important; margin:55px auto 18px auto !important; } .diagram_m2_pro{ width:333px; height:130px; margin:13px auto 0px; } .diagram_m2_pro_l{ width:133px; height:130px; float:left; padding-top:18px; margin:0px; } .diagram_m2_pro_r{ width:200px; height:130px; float:left; padding-left:12px; margin:0px; } .diagram_m2_pro_r h3{ font-size:16px; line-height:28px; font-weight:bold; margin-top:20px; margin-bottom:0px; } .diagram_m2_pro_r ul{ width:100%; height:auto; color:#585858; } .diagram_m2_pro_r ul li{ width:100%; font-size:12px; line-height:22px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 8px; padding-left:16px; } .diagram_m2_btn{ width:410px; height:70px; margin:10px auto; overflow:hidden; padding:0px; } .power-button{ width:180px; height:50px; background:#89c122; color:#ffffff !important; font-size:16px; line-height:50px; text-align:center; display:block; float:left; border-radius:4px; margin:5px 12px; } .diagram_m2_group a:hover h3{ color:#8fc31f !important; } .diagram_m2_group a:hover li{ background:url(../images/app/power/diagram_m2_pro_d2.png) no-repeat 2px 8px; color:#8fc31f !important; } } @media (min-width: 1080px) { #power_video{ width:100%; min-width:1080px; height:644px;overflow:hidden; } #power_automation_mobile_text{ width:1050px; height:auto; float:none; margin:16px auto 30px; } #automation_mobile_text_1{ width:329px; height:160px; margin:20px 10px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } #automation_mobile_text_2{ width:329px; height:160px; margin:20px 10px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } #automation_mobile_text_3{ width:329px; height:160px; margin:20px 10px; background:rgb(255,255,255,0.1); border-radius:6px; float:left; } } @media (min-width: 1200px) { #power_video{ width:100%; min-width:1200px; height:644px;overflow:hidden; } #power_diagram_m1{ width:100%; height:1100px; background:#f0f1f2; margin:0px auto; padding:33px 10px 20px; overflow:hidden; } #power_diagram_m1 h2{ font-size:40px; line-height:60px; color:#333; text-align:center; margin:65px auto 38px auto; display:block; } .diagram_m1_pro{ width:1200px; height:400px; margin:13px auto 26px; } .diagram_m1_pro_l{ width:50%; height:400px; float:right; } .diagram_m1_pro_r{ width:50%; height:400px; float:right; background:#ffffff; } .diagram_m1_pro_r1{ width:50%; height:400px; float:left; } .diagram_m1_pro_r1 h3{ font-size:22px; line-height:40px; color:#8fc31f; text-align:center; margin-top:8px; } .diagram_m1_pro_r2{ width:50%; height:400px; float:left; padding-top:104px; padding-left:10px; } .diagram_m1_pro_r2 h3{ font-size:20px; line-height:42px; font-weight:bold; margin-top:20px; margin-bottom:10px; } .diagram_m1_pro_r2 ul{ width:100%; height:auto; color:#585858; } .diagram_m1_pro_r2 ul li{ width:100%; font-size:18px; line-height:32px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 13px; padding-left:20px; } .diagram_m1_pro_ico1{ width:100px; height:100px; margin:126px auto 0px; background:url(../images/app/power/m1_pro_ico1.jpg) center center / 100px 100px no-repeat; background-size:cover; } .diagram_m1_pro_ico2{ width:100px; height:100px; margin:126px auto 0px; background:url(../images/app/power/m1_pro_ico2.jpg) center center / 100px 100px no-repeat; background-size:cover; } #power_diagram_m2{ width:100%; height:auto; background:#f0f1f2; margin: 0px auto; padding:33px 10px 120px; overflow:hidden; } #power_diagram_m2_content{ width:1200px; height:auto; margin:0px auto; overflow:hidden; } #power_diagram_m2 h2{ font-size:40px; line-height:60px; color:#333; text-align:center; margin:4px auto 38px auto; display:block; } #power_diagram_m2 a{ color:#000; } .diagram_m2_group{ width:382px; height:618px; float:left; background:#ffffff; margin:10px 26px 70px 0px; overflow:hidden; } .diagram_m2_group h2{ font-size:24px !important; line-height:36px !important; color:#1d1d1f !important; margin:55px auto 18px auto !important; } .diagram_m2_pro{ width:382px; height:150px; margin:13px auto 0px; } .diagram_m2_pro_l{ width:165px; height:150px; float:left; padding-top:16px; } .diagram_m2_pro_r{ width:217px; height:150px; float:left; padding-left:4px; } .diagram_m2_pro_r h3{ font-size:16px; line-height:28px; font-weight:bold; margin-top:25px; margin-bottom:0px; } .diagram_m2_pro_r ul{ width:100%; height:auto; color:#585858; } .diagram_m2_pro_r ul li{ width:100%; font-size:14px; line-height:22px; background:url(../images/app/power/diagram_m2_pro_d.png) no-repeat 2px 8px; padding-left:20px; } .diagram_m2_btn{ width:410px; height:70px; margin:10px auto; overflow:hidden; } .diagram_m2_group a:hover h3{ color:#8fc31f !important; } .diagram_m2_group a:hover li{ background:url(../images/app/power/diagram_m2_pro_d2.png) no-repeat 2px 8px; color:#8fc31f !important; } }