#advertising{ z-index:2; margin:0; } .content{ padding:0px 20px; } @media only screen and (max-width:767px) { .tc_video { display:none; width:500px; height:280px; position:fixed; left:65%; top:55%; } .v_con01{ display:none; width:500px; height:280px; position:fixed; left:65%; top:55%; } .v_close{ position:absolute; top:53%; margin-top:-220px; left:37%; margin-left:360px; cursor:pointer; z-index:1003; display:none; } } @media screen and (min-width:768px) { .v_close{ display:block; } } @media only screen and (max-width:519px) { .tc_video { display:none; width:300px; height:169px; position:fixed; left:11%; margin-left:0px; top: 68%; } .v_con01{ display:none; width:350px; height:197px; position:fixed; left:15%; margin-left:0px; top: 65%; } .v_close{ position:absolute; top:43%; margin-top:0px; left:72%; margin-left:0px; cursor:pointer; z-index:1003; display:none; } } @media only screen and (max-width:480px) { } @media only screen and (max-width:414px) { .v_con01{ display:none; width:330px; height:186px; position:fixed; left:11%; margin-left:0px; top:65%; } } @media only screen and (max-width:375px) { .v_con01{ display:none; width:310px; height:175px; position:fixed; left:9%; margin-left:0px; top:65%; } } @media only screen and (max-width:365px) { .tc_video { display:none; width:300px; height:169px; position:fixed; left:6%; margin-left:0px; top:68%; } .v_con01{ display:none; width:300px; height:169px; position:fixed; left:6%; margin-left:0px; top:68%; } .v_close{ position:absolute; top:38%; margin-top:0px; left:88%; margin-left:0px; cursor:pointer; z-index:1003; display:none; } } @media only screen and (max-width:320px) { .v_con01{ left:3%; } } @media (min-width: 300px) { #advertising{ width:100%; height:349px; position:relative; top:75px; } .slides{ height:274px; } .section-bg{ width:100%; height:274px; background:url(../images/can/adx_sbg.jpg) no-repeat; position:absolute; background-size:100% 100%; z-index:3; } .section-bg .slider-text{ width:255px; height:180px; margin:16px 10px 10px 10px; padding:0; } .secondary-heading{ width:255px; color:#fff; font-size:22px; line-height:22px; margin:0 0 4px 0; padding:0; position:relative; text-align:center; } .sub-heading{ width:255px; color:#fff; font-size:12px; line-height:18px; margin:0; padding:0; position:relative; text-align:center; } .content{ padding:0px 10px; margin:30px 0px; } .yang_card_pro_list{ width:100%; max-width:1200px; margin:0px auto; padding:0px; } .yang_card_h3{ font-size:26px; color:#000000; text-align:center; line-height:32px; padding-bottom:0px; padding-top:0px; margin-bottom:0px; font-weight:bold; } .yang_card_p{ width:100%; padding:0 5px;font-size:12px; color:#666666; line-height:22px; text-align:center; } .yang_card_img{ width:100%; height:auto; float:left; margin-top:5px; padding-bottom:35px; } .ct_dt{ color:#ffffff; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 20px; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:282px; height:260px; background:#f5f5f5; margin:26px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:70px; height:122px; float:left; } #can-pro-ico01>a,#can-pro-ico02>a,#can-pro-ico03>a,#can-pro-ico04>a,#can-pro-ico05>a,#can-pro-ico06>a{ width:60px; height:120px; display:block; margin:0px; padding:0px; } .pro-ico01 svg,.pro-ico02 svg,.pro-ico03 svg,.pro-ico04 svg,.pro-ico05 svg,.pro-ico06 svg{ width:40px; height:40px; fill:#646464; margin-left:10px; } .nav-can-pro h3{ font-size:14px; text-align:center ;margin-top:0px; } .nav-can-pro .active>a{ position:relative; } .nav-can-pro .active>a>div>svg{ fill:#8fc31f; } .nav-can-pro .active h3{ color:#8fc31f; } #canindexpro .tab-content{ margin-top:6px; } .canpro1{ width:280px; height:auto; float:left; } .canpro1_top{ width:280px; height:auto; float:left; } .canpro1_right_div{ width:280px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro1_bottom{ display:none; } .canpro2{ width:280px; height:auto; float:left; } .canpro2_left{ float:left; display:none; } .canpro2_right{ width:280px; height:auto; float:left; } .canpro2_right_div{ width:280px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro3{ width:280px; height:auto; float:left; } .canpro3_left{ float:left; display:none; } .canpro3_right{ width:280px; height:auto; float:left; } .canpro3_right_div{ width:280px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro1_photo,.canpro2_photo,.canpro3_photo{ width:280px; height:216px; float:right; margin:0px; } .canpro1_information,.canpro2_information,.canpro3_information{ width:260px; height:auto; float:right; margin:0px auto 30px; } .canpro1_information h3,.canpro2_information h3,.canpro3_information h3{ width:240px;font-size:20px; line-height:30px; color:#303233; margin-top:0px; } .canpro1_information p,.canpro2_information p,.canpro3_information p{ width:240px; font-size:14px; line-height:26px; color: #555555; margin-top:8px; word-break:break-word; } .canpro1_information span,.canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:10px; display:none; } .canpro1_information span:hover,.canpro2_information span:hover{ background:#83b31d; } #canindex1{ width:100%; height:880px; margin:0px; padding:35px 0 0; overflow:auto; background:url(../images/can/canindex1.jpg) center center no-repeat; } #canindex2{ width:100%; height:auto; margin:0px; padding:25px 0 30px; overflow:auto; background:#ffffff; } #canindex3{ width:100%; height:auto; margin:0px; padding:0px; overflow:auto; background:#ffffff; } .canindex1_show{ width:280px; height:auto; margin-top:10px; } .canindex1_show_div{ width:278px; height:118px; float:left; padding:20px 10px; } .canindex1_show_div h3{ width:100%; font-size:24px; font-weight:bold; line-height:30px; color:#ffffff; } .canindex1_show_div p{ width:100%; font-size:14px; line-height:26px; color:#ffffff; } .canindex1_ico{ width:60px; height:60px; display:none; } .technical_article{ width:280px; height:auto; margin:10px auto 8px auto; float:left; } .technical_article_ico{ width:38px; height:40px; margin:0; padding:0px; float:left; } .technical_article_list{ width:238px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:20px; line-height:22px; color:#303233; font-weight:bold; margin-top:10px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:0; } .technical_article_list ul li{ font-size:14px; line-height:22px; color:#646464; } .technical_article_list ul li a{ color:#646464; } .technical_article_list ul li a:hover{ color:#8fc31f; } .video-preview{ width:280px; height:158px; } } /*閽堝iphone5s*/ @media (min-width: 315px) { #advertising{ width:100%; height:362px; position:relative; top:75px; } .slides{ height:287px; } .section-bg{ width:100%; height:287px; } .section-bg .slider-text{ width:265px; height:180px; margin:16px 10px 10px 10px; padding:0; } .secondary-heading{ width:265px; color:#fff; font-size:24px; line-height:30px; margin:0 0 5px 0; padding:0; position:relative; } .sub-heading{ width:265px; color:#fff; font-size:12px; line-height:18px; margin:0; padding:0; position:relative; } .content{ padding:0px 20px; } } /*閽堝1080*1920鐨刟ndroid*/ @media (min-width: 360px) { #advertising{ width:100%; height:403px; position:relative; top:75px; } .slides{ height:328px; } .section-bg{ width:100%; height:328px; } .section-bg .slider-text{ width:300px; height:190px; margin:20px 11px 10px 14px; padding:0; } .secondary-heading{ width:300px; color:#fff; font-size:26px; line-height:20px; margin:0 0 15px 0; padding:0; position:relative; } .sub-heading{ width:300px; color:#fff; font-size:16px; line-height:22px; margin:0; padding:0; position:relative; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 20px; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:320px; height:260px; background:#f5f5f5; margin:26px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:76px; height:122px; float:left; } .nav-can-pro .active>a{ position:relative; } .nav-can-pro .active>a>div>svg{ fill:#8fc31f; } .nav-can-pro h3{ font-size:14px; text-align:center;margin-top:0px; } #canindexpro .tab-content{ margin-top:6px; } .canpro1{ width:340px; height:auto; float:left; } .canpro1_top{ width:340px; height:auto; float:left; } .canpro1_right_div{ width:324px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro2{ width:340px; height:auto; float:left; } .canpro2_right{ width:340px; height:auto; float:left; } .canpro2_right_div{ width:324px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro3{ width:340px; height:auto; float:left; } .canpro3_right{ width:340px; height:auto; float:left; } .canpro3_right_div{ width:324px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro1_photo,.canpro2_photo,.canpro3_photo{ width:316px; height:216px; float:right; margin:0px; } .canpro1_information,.canpro2_information,.canpro3_information{ width:274px; height:auto; float:right; margin:0px auto 30px; } .canpro1_information h3,.canpro2_information h3,.canpro3_information h3{ width:240px; font-size:20px; line-height:30px; color:#303233; margin-top:0px; } .canpro1_information p,.canpro2_information p,.canpro3_information p{ width:240px; font-size:14px; line-height:26px; color: #555555; margin-top:8px; word-break:break-word; } .canpro1_information span,.canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:10px; display:none; } #canindex1{ width:100%; height:880px; margin:0px; padding:35px 0 0; overflow:auto; background:url(../images/can/canindex1.jpg) center center no-repeat; } #canindex2{ width:100%; height:auto; margin:0px; padding:25px 0 30px; overflow:auto; background:#ffffff; } #canindex3{ width:100%; height:auto; margin:0px; padding:0px; overflow:auto; background:#ffffff; } .canindex1_show{ width:340px; height:auto; margin-top:10px; } .canindex1_show_div{ width:318px; height:118px; float:left; padding:20px 10px; } .canindex1_show_div h3{ width:100%; font-size:24px; font-weight:bold; line-height:30px; color:#ffffff; } .canindex1_show_div p{ width:100%; font-size:14px; line-height:26px; color:#ffffff; } .canindex1_ico{ width:60px; height:60px; display:none; } .technical_article{ width:340px; height:auto; margin:10px auto 8px auto; float:left; } .technical_article_ico{ width:38px; height:40px; margin:0; padding:0px; float:left; } .technical_article_list{ width:288px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:20px; line-height:22px; color:#303233; font-weight:bold; margin-top:10px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:0; } .technical_article_list ul li{ font-size:14px; line-height:22px; color:#646464; } .technical_article_list ul li a{ color:#646464; } .technical_article_list ul li a:hover{ color:#8fc31f; } .video-preview{ width:320px; height:181px; } } /*閽堝iphone6*/ @media (min-width: 375px) { #advertising{ width:100%; height:417px; position:relative; top:75px; } .slides{ height:342px; } .section-bg{ width:100%; height:342px; } .section-bg .slider-text{ width:300px; height:210px; margin:20px 11px 10px 21px; padding:0; } .secondary-heading{ width:300px; color:#fff; font-size:26px; line-height:26px; margin:0 0 10px 0; padding:0; position:relative; } .sub-heading{ width:300px; color:#fff; font-size:16px; line-height:26px; margin:0; padding:0; position:relative; } .content{ padding:0px 23px; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 20px; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:350px; height:160px; background:#f5f5f5; margin:26px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:56px; height:90px; float:left; } #can-pro-ico01>a,#can-pro-ico02>a,#can-pro-ico03>a,#can-pro-ico04>a,#can-pro-ico05>a,#can-pro-ico06>a{ width:50px; height:90px; display:block; margin:0px; padding:0px; } .pro-ico01 svg,.pro-ico02 svg,.pro-ico03 svg,.pro-ico04 svg,.pro-ico05 svg,.pro-ico06 svg{ width:40px; height:40px; fill:#646464; margin-left:5px; } .nav-can-pro h3{ font-size:14px; text-align:center;margin-top:0px; } #canindexpro .tab-content{ margin-top:6px; } .canpro1{ width:350px; height:auto; float:left; } .canpro1_top{ width:350px; height:auto; float:left; } .canpro1_right_div{ width:334px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro2{ width:350px; height:auto; float:left; } .canpro2_right{ width:350px; height:auto; float:left; } .canpro2_right_div{ width:334px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro3{ width:350px; height:auto; float:left; } .canpro3_right{ width:350px; height:auto; float:left; } .canpro3_right_div{ width:334px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro1_photo,.canpro2_photo,.canpro3_photo{ width:326px; height:240px; float:right; margin:0px; } .canpro1_information,.canpro2_information,.canpro3_information{ width:290px; height:auto; float:right; margin:0px auto 30px; } .canpro1_information h3,.canpro2_information h3,.canpro3_information h3{ width:250px; font-size:20px; line-height:30px; color:#303233; margin-top:0px; } .canpro1_information p,.canpro2_information p,.canpro3_information p{ width:250px; font-size:14px; line-height:26px; color: #555555; margin-top:8px; word-break:break-word; } .canpro1_information span,.canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:10px; display:none; } #canindex1{ width:100%; height:880px; margin:0px; padding:35px 0 0; overflow:auto; background:url(../images/can/canindex1.jpg) center center no-repeat; } #canindex2{ width:100%; height:auto; margin:0px; padding:25px 0 30px; overflow:auto; background:#ffffff; } #canindex3{ width:100%; height:auto; margin:0px; padding:0px; overflow:auto; background:#ffffff; } .canindex1_show{ width:350px; height:auto; margin-top:10px; } .canindex1_show_div{ width:318px; height:118px; float:left; padding:20px 10px; } .canindex1_show_div h3{ width:100%; font-size:24px; font-weight:bold; line-height:30px; color:#ffffff; } .canindex1_show_div p{ width:100%; font-size:14px; line-height:26px; color:#ffffff; } .canindex1_ico{ width:60px; height:60px; display:none; } .technical_article{ width:350px; height:auto; margin:10px auto 8px auto; float:left; } .technical_article_ico{ width:38px; height:40px; margin:0; padding:0px; float:left; } .technical_article_list{ width:288px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:20px; line-height:22px; color:#303233; font-weight:bold; margin-top:10px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:0; } .technical_article_list ul li{ font-size:14px; line-height:24px; color:#646464; } .video-preview{ width:340px; height:192px; } } /*閽堝鍏ㄩ潰灞忓畨鍗?/ @media (min-width: 390px) { #advertising{ width:100%; height:430px; position:relative; top:75px; } .slides{ height:355px; } .section-bg{ width:100%; height:355px; } .section-bg .slider-text{ width:300px; height:220px; margin:30px 17px 10px 31px; padding:0; } .secondary-heading{ width:300px; color:#fff; font-size:28px; line-height:20px; margin:0px 0 10px 0; padding:0; position:relative; } .sub-heading{ width:300px; color:#fff; font-size:16px; line-height:22px; margin:0; padding:0; position:relative; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 20px; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:350px; height:160px; background:#f5f5f5; margin:26px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:56px; height:90px; float:left; } #can-pro-ico01>a,#can-pro-ico02>a,#can-pro-ico03>a,#can-pro-ico04>a,#can-pro-ico05>a,#can-pro-ico06>a{ width:50px; height:90px; display:block; margin:0px; padding:0px; } .pro-ico01 svg,.pro-ico02 svg,.pro-ico03 svg,.pro-ico04 svg,.pro-ico05 svg,.pro-ico06 svg{ width:40px; height:40px; fill:#646464; margin-left:5px; } .nav-can-pro h3{ font-size:14px; text-align:center;margin-top:0px; } #canindexpro .tab-content{ margin-top:6px; } .canpro1{ width:360px; height:auto; float:left; } .canpro1_top{ width:360px; height:auto; float:left; } .canpro1_right_div{ width:348px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro2{ width:360px; height:auto; float:left; } .canpro2_right{ width:360px; height:auto; float:left; } .canpro2_right_div{ width:348px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro3{ width:360px; height:auto; float:left; } .canpro3_right{ width:360px; height:auto; float:left; } .canpro3_right_div{ width:348px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro1_photo,.canpro2_photo,.canpro3_photo{ width:346px; height:250px; float:right; margin:0px; } .canpro1_information,.canpro2_information,.canpro3_information{ width:302px; height:auto; float:right; margin:0px auto 30px; } .canpro1_information h3,.canpro2_information h3,.canpro3_information h3{ width:270px; font-size:20px; line-height:30px; color:#303233; margin-top:0px; } .canpro1_information p,.canpro2_information p,.canpro3_information p{ width:270px; font-size:14px; line-height:26px; color: #555555; margin-top:8px; word-break:break-word; } .canpro1_information span,.canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:10px; display:none; } #canindex1{ width:100%; height:880px; margin:0px; padding:35px 0 0; overflow:auto; background:url(../images/can/canindex1.jpg) center center no-repeat; } #canindex2{ width:100%; height:auto; margin:0px; padding:25px 0 30px; overflow:auto; background:#ffffff; } #canindex3{ width:100%; height:auto; margin:0px; padding:0px; overflow:auto; background:#ffffff; } .canindex1_show{ width:360px; height:auto; margin-top:10px; } .canindex1_show_div{ width:348px; height:118px; float:left; padding:20px 10px; } .canindex1_show_div h3{ width:100%; font-size:24px; font-weight:bold; line-height:30px; color:#ffffff; } .canindex1_show_div p{ width:100%; font-size:14px; line-height:26px; color:#ffffff; } .canindex1_ico{ width:60px; height:60px; display:none; } .technical_article{ width:350px; height:auto; margin:10px auto 8px auto; float:left; } .technical_article_ico{ width:38px; height:40px; margin:0; padding:0px; float:left; } .technical_article_list{ width:288px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:20px; line-height:22px; color:#303233; font-weight:bold; margin-top:10px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:0; } .technical_article_list ul li{ font-size:14px; line-height:24px; color:#646464; } .video-preview{ width:350px; height:198px; } } @media (min-width: 400px) { #advertising{ width:100%; height:440px; position:relative; top:75px; } .slides{ height:365px; } .section-bg{ width:100%; height:365px; } .section-bg .slider-text{ width:310px; height:220px; margin:28px 18px 10px 30px; padding:0; } .secondary-heading{ width:310px; color:#fff; font-size:28px; line-height:26px; margin:0px 0 10px 0; padding:0; position:relative; } .sub-heading{ width:310px; color:#fff; font-size:16px; line-height:24px; margin:0; padding:0; position:relative; } .content{ padding:0px 25px; } .yang_card_h3{ font-size:20px; color:#333; text-align:center; line-height:30px; padding-bottom:0px; padding-top:0px; } .ct_dt{ color:#ffffff; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 20px; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:366px; height:160px; background:#f5f5f5; margin:26px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:60px; height:90px; float:left; } #can-pro-ico01>a,#can-pro-ico02>a,#can-pro-ico03>a,#can-pro-ico04>a,#can-pro-ico05>a,#can-pro-ico06>a{ width:50px; height:90px; display:block; margin:0px; padding:0px; } .pro-ico01 svg,.pro-ico02 svg,.pro-ico03 svg,.pro-ico04 svg,.pro-ico05 svg,.pro-ico06 svg{ width:40px; height:40px; fill:#646464; margin-left:5px; } .nav-can-pro h3{ font-size:14px; text-align:center;margin-top:0px; } #canindexpro .tab-content{ margin-top:6px; } .canpro1{ width:360px; height:auto; float:left; } .canpro1_top{ width:360px; height:auto; float:left; } .canpro1_right_div{ width:348px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro2{ width:360px; height:auto; float:left; } .canpro2_right{ width:360px; height:auto; float:left; } .canpro2_right_div{ width:348px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro3{ width:360px; height:auto; float:left; } .canpro3_right{ width:360px; height:auto; float:left; } .canpro3_right_div{ width:348px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro1_photo,.canpro2_photo,.canpro3_photo{ width:346px; height:250px; float:right; margin:0px; } .canpro1_information,.canpro2_information,.canpro3_information{ width:310px; height:auto; float:right; margin:0px auto 30px; } .canpro1_information h3,.canpro2_information h3,.canpro3_information h3{ width:270px; font-size:20px; line-height:30px; color:#303233; margin-top:0px; } .canpro1_information p,.canpro2_information p,.canpro3_information p{ width:270px; font-size:14px; line-height:26px; color: #555555; margin-top:8px; word-break:break-word; } .canpro1_information span,.canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:10px; display:none; } .technical_article{ width:360px; height:auto; margin:10px auto 8px auto; float:left; } .technical_article_ico{ width:38px; height:40px; margin:0; padding:0px; float:left; } .technical_article_list{ width:312px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:20px; line-height:22px; color:#303233; font-weight:bold; margin-top:10px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:0; } .technical_article_list ul li{ font-size:14px; line-height:24px; color:#646464; } .video-preview{ width:360px; height:203px; } } /*閽堝iphone6s plus*/ @media (min-width: 410px) { #advertising{ width:100%; height:453px; position:relative; top:75px; } .slides{ height:378px; } .section-bg{ width:100%; height:378px; } .section-bg .slider-text{ width:350px; height:250px; margin:40px 19px 10px 17px; padding:0; } .secondary-heading{ width:350px; color:#fff; font-size:30px; line-height:16px; margin:0px 0 10px 0; padding:0; position:relative; } .sub-heading{ width:350px; color:#fff; font-size:16px; line-height:24px; margin:0; padding:0; position:relative; } .yang_card_h3{ font-size:21px; color:#333; text-align:center; line-height:31px; padding-bottom:4px; padding-top:0px; } .ct_dt{ color:#ffffff; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 20px; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:372px; height:160px; background:#f5f5f5; margin:26px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:61px; height:90px; float:left; } #can-pro-ico01>a,#can-pro-ico02>a,#can-pro-ico03>a,#can-pro-ico04>a,#can-pro-ico05>a,#can-pro-ico06>a{ width:52px; height:90px; display:block; margin:0px; padding:0px; } .pro-ico01 svg,.pro-ico02 svg,.pro-ico03 svg,.pro-ico04 svg,.pro-ico05 svg,.pro-ico06 svg{ width:40px; height:40px; fill:#646464; margin-left:5px; } .nav-can-pro h3{ font-size:14px; text-align:center;margin-top:0px; } #canindexpro .tab-content{ margin-top:6px; } .canindex1_show{ width:386px; height:auto; margin-top:10px; } .canindex1_show_div{ width:370px; height:118px; float:left; padding:20px 10px; } } @media (min-width: 414px) { .canpro1{ width:370px; height:auto; float:left; } .canpro1_top{ width:370px; height:auto; float:left; } .canpro1_right_div{ width:360px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro2{ width:370px; height:auto; float:left; } .canpro2_right{ width:370px; height:auto; float:left; } .canpro2_right_div{ width:360px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro3{ width:370px; height:auto; float:left; } .canpro3_right{ width:370px; height:auto; float:left; } .canpro3_right_div{ width:360px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro1_photo,.canpro2_photo,.canpro3_photo{ width:356px; height:250px; float:right; margin:0px; } .canpro1_information,.canpro2_information,.canpro3_information{ width:320px; height:auto; float:right; margin:0px auto 30px; } .canpro1_information h3,.canpro2_information h3,.canpro3_information h3{ width:296px; font-size:20px; line-height:30px; color:#303233; margin-top:0px; } .canpro1_information p,.canpro2_information p,.canpro3_information p{ width:296px; font-size:14px; line-height:26px; color: #555555; margin-top:8px; word-break:break-word; } .canpro1_information span,.canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:10px; display:none; } } /*閽堝1440*2560鐨刟ndroid*/ @media (min-width: 480px) { #advertising{ width:100%; height:513px; position:relative; top:75px; } .slides{ height:438px; } .section-bg{ width:100%; height:438px; } .section-bg .slider-text{ width:380px; height:260px; margin:40px 24px 10px 35px; padding:0; } .secondary-heading{ width:380px; color:#fff; font-size:34px; line-height:18px; margin:5px 0 22px 0; padding:0; position:relative; } .sub-heading{ width:380px; color:#fff; font-size:16px; line-height:22px; margin:0; padding:0; position:relative; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 20px; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:440px; height:170px; background:#f5f5f5; margin:26px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:72px; height:90px; float:left; } #can-pro-ico01>a,#can-pro-ico02>a,#can-pro-ico03>a,#can-pro-ico04>a,#can-pro-ico05>a,#can-pro-ico06>a{ width:52px; height:90px; display:block; margin:0px; padding:0px; } .pro-ico01 svg,.pro-ico02 svg,.pro-ico03 svg,.pro-ico04 svg,.pro-ico05 svg,.pro-ico06 svg{ width:50px; height:50px; fill:#646464; margin-left:2px; } .nav-can-pro h3{ font-size:14px; text-align:center;margin-top:0px; } #canindexpro .tab-content{ margin-top:6px; } .canpro1{ width:440px; height:auto; float:left; } .canpro1_top{ width:440px; height:auto; float:left; } .canpro1_right_div{ width:430px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro2{ width:440px; height:auto; float:left; } .canpro2_right{ width:440px; height:auto; float:left; } .canpro2_right_div{ width:430px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro3{ width:440px; height:auto; float:left; } .canpro3_right{ width:440px; height:auto; float:left; } .canpro3_right_div{ width:430px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro1_photo,.canpro2_photo,.canpro3_photo{ width:430px; height:310px; float:right; margin:10px 0px 0px 0px; } .canpro1_information,.canpro2_information,.canpro3_information{ width:390px; height:auto; float:right; margin:0px auto 30px; } .canpro1_information h3,.canpro2_information h3,.canpro3_information h3{ width:350px; font-size:20px; line-height:30px; color:#303233; margin-top:0px; } .canpro1_information p,.canpro2_information p,.canpro3_information p{ width:350px; font-size:14px; line-height:26px; color: #555555; margin-top:8px; word-break:break-word; } .canpro1_information span,.canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:10px; display:none; } .technical_article{ width:430px; height:auto; margin:10px auto 8px auto; float:left; } .technical_article_ico{ width:38px; height:40px; margin:0; padding:0px; float:left; } .technical_article_list{ width:390px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:20px; line-height:22px; color:#303233; font-weight:bold; margin-top:10px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:0; } .technical_article_list ul li{ font-size:14px; line-height:24px; color:#646464; } .canindex1_show{ width:446px; height:auto; margin-top:10px; } .canindex1_show_div{ width:430px; height:118px; float:left; padding:20px 10px; } .video-preview{ width:438px; height:247px; } } @media (min-width: 500px) { #advertising{ width:100%; height:531px; position:relative; top:75px; } .slides{ height:456px; } .section-bg{ width:100%; height:456px; } .section-bg .slider-text{ width:380px; height:280px; margin:45px 27px 10px 43px; padding:0; } .secondary-heading{ width:380px; color:#fff; font-size:34px; line-height:20px; margin:5px 0 20px 0; padding:0; position:relative; } .sub-heading{ width:380px; color:#fff; font-size:16px; line-height:22px; margin:0; padding:0; position:relative; } .yang_card_h3{ font-size:22px; line-height:34px; } .yang_card_p{ width:100%; padding:0 20px;font-size:14px; color:#666666; line-height:24px; text-align:center; } .ct_dt{ color:#ffffff; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 30px; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:460px; height:170px; background:#f5f5f5; margin:26px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:76px; height:90px; float:left; } .canpro1{ width:450px; height:auto; float:left; } .canpro1_top{ width:450px; height:auto; float:left; } .canpro1_right_div{ width:440px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro2{ width:450px; height:auto; float:left; } .canpro2_right{ width:450px; height:auto; float:left; } .canpro2_right_div{ width:440px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro3{ width:450px; height:auto; float:left; } .canpro3_right{ width:450px; height:auto; float:left; } .canpro3_right_div{ width:440px; height:auto; float:left; background:#ffffff; margin-bottom:20px; } .canpro1_photo,.canpro2_photo,.canpro3_photo{ width:440px; height:310px; float:right; margin:0px; } .canpro1_information,.canpro2_information,.canpro3_information{ width:390px; height:auto; float:right; margin:0px auto 30px; } .canpro1_information h3,.canpro2_information h3,.canpro3_information h3{ width:350px; font-size:20px; line-height:30px; color:#303233; margin-top:0px; } .canpro1_information p,.canpro2_information p,.canpro3_information p{ width:350px; font-size:14px; line-height:26px; color: #555555; margin-top:8px; word-break:break-word; } .canpro1_information span,.canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:10px; display:none; } .technical_article{ width:440px; height:auto; margin:10px auto 8px auto; float:left; } .technical_article_ico{ width:38px; height:40px; margin:0; padding:0px; float:left; } .technical_article_list{ width:392px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:20px; line-height:22px; color:#303233; font-weight:bold; margin-top:10px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:0; } .technical_article_list ul li{ font-size:14px; line-height:24px; color:#646464; } .canindex1_show{ width:470px; height:auto; margin-top:10px; } .canindex1_show_div{ width:450px; height:118px; float:left; padding:20px 10px; } .video-preview{ width:458px; height:258px; } } @media (min-width: 600px) { #advertising{ width:100%; height:622px; position:relative; top:75px; } .slides{ height:547px; } .section-bg{ width:100%; height:547px; } .section-bg .slider-text{ width:500px; height:300px; margin:40px 34px 10px 38px; padding:0; } .secondary-heading{ width:500px; color:#fff; font-size:44px; line-height:40px; margin:5px 0 20px 0; padding:0; position:relative; } .sub-heading{ width:500px; color:#fff; font-size:20px; line-height:26px; margin:0; padding:0; position:relative; } .content{ padding:25px 20px 20px 20px; margin:0px 0px; } .yang_card_h3{ font-size:26px; color:#333; text-align:center; line-height:42px; padding-bottom:5px; padding-top:0px; } .yang_card_p{ width:100%; padding:0 20px;font-size:16px; color:#666666; line-height:28px; text-align:center; } .ct_dt{ color:#ffffff; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 30px; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:560px; height:126px; background:#f5f5f5; margin:26px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:92px; height:90px; float:left; } #can-pro-ico01>a,#can-pro-ico02>a,#can-pro-ico03>a,#can-pro-ico04>a,#can-pro-ico05>a,#can-pro-ico06>a{ width:80px; height:90px; display:block; margin:0px; padding:0px; } .pro-ico01 svg,.pro-ico02 svg,.pro-ico03 svg,.pro-ico04 svg,.pro-ico05 svg,.pro-ico06 svg{ width:40px; height:40px; fill:#646464; margin-left:20px; } .nav-can-pro h3{ font-size:14px; text-align:center;margin-top:0px; } .canpro1{ width:560px; height:auto; float:left; } .canpro1_top{ width:560px; height:auto; float:left; } .canpro1_right_div{ width:258px; height:370px; float:left; background:#ffffff; margin-bottom:20px; margin-right:20px; } .canpro2{ width:560px; height:auto; float:left; } .canpro2_right{ width:560px; height:auto; float:left; } .canpro2_right_div{ width:258px; height:370px; float:left; background:#ffffff; margin-bottom:20px; margin-right:20px; } .canpro3{ width:560px; height:auto; float:left; } .canpro3_right{ width:560px; height:auto; float:left; } .canpro3_right_div{ width:260px; height:370px; float:left; background:#ffffff; margin-bottom:20px; margin-right:20px; } .canpro1_photo,.canpro2_photo,.canpro3_photo{ width:258px; height:200px; float:right; margin:10px 0px 0px 0px; } .canpro1_information,.canpro2_information,.canpro3_information{ width:240px; height:auto; float:right; margin:0px auto 30px; } .canpro1_information h3,.canpro2_information h3,.canpro3_information h3{ width:220px; font-size:20px; line-height:30px; color:#303233; margin-top:0px; } .canpro1_information p,.canpro2_information p,.canpro3_information p{ width:220px; font-size:14px; line-height:26px; color: #555555; margin-top:8px; word-break:break-word; } .canpro1_information span,.canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:10px; display:none; } .technical_article{ width:540px; height:auto; margin:10px auto 8px auto; float:left; } .technical_article_ico{ width:58px; height:70px; margin:0; padding:0px; float:left; } .technical_article_list{ width:482px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:20px; line-height:22px; color:#303233; font-weight:bold; margin-top:10px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:0; } .technical_article_list ul li{ font-size:14px; line-height:24px; color:#646464; } .canindex1_show{ width:580px; height:auto; margin-top:10px; } .canindex1_show_div{ width:560px; height:118px; float:left; padding:20px 10px; } .video-preview{ width:556px; height:313px; } } @media (min-width: 700px) { #advertising{ width:100%; height:713px; position:relative; top:75px; } .slides{ height:638px; } .section-bg{ width:100%; height:638px; } .section-bg .slider-text{ width:560px; height:350px; margin:50px 35px 10px 55px; padding:0; } .secondary-heading{ width:560px; color:#fff; font-size:50px; line-height:60px; margin:25px 0 22px 0; padding:0; position:relative; } .sub-heading{ width:560px; color:#fff; font-size:24px; line-height:36px; margin:0; padding:0; position:relative; } .secondary-heading2{ width:560px; color:#fff; font-size:50px; line-height:50px; margin:5px 0 22px 0; padding:0; position:relative; } .sub-heading2{ width:560px; color:#fff; font-size:24px; line-height:30px; margin:0; padding:0; position:relative; } .content{ padding:25px 20px 30px 20px; margin:0px 0px; } .yang_card_h3{ font-size:30px; color:#333; text-align:center; line-height:48px; padding-bottom:8px; padding-top:0px; } .yang_card_p{ width:100%; padding:0 20px;font-size:18px; color:#666666; line-height:34px; text-align:center; } .ct_dt{ color:#ffffff; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 30px; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:660px; height:134px; background:#f5f5f5; margin:26px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:110px; height:90px; float:left; } #can-pro-ico01>a,#can-pro-ico02>a,#can-pro-ico03>a,#can-pro-ico04>a,#can-pro-ico05>a,#can-pro-ico06>a{ width:80px; height:90px; display:block; margin:0px; padding:0px; } .pro-ico01 svg,.pro-ico02 svg,.pro-ico03 svg,.pro-ico04 svg,.pro-ico05 svg,.pro-ico06 svg{ width:40px; height:40px; fill:#646464; margin-left:20px; } .nav-can-pro h3{ font-size:14px; text-align:center;margin-top:6px; } .canpro1{ width:660px; height:auto; float:left; } .canpro1_top{ width:660px; height:auto; float:left; } .canpro1_right_div{ width:310px; height:370px; float:left; background:#ffffff; margin-bottom:20px; margin-right:20px; } .canpro2{ width:660px; height:auto; float:left; } .canpro2_right{ width:660px; height:auto; float:left; } .canpro2_right_div{ width:310px; height:370px; float:left; background:#ffffff; margin-bottom:20px; margin-right:20px; } .canpro3{ width:660px; height:auto; float:left; } .canpro3_right{ width:660px; height:auto; float:left; } .canpro3_right_div{ width:310px; height:370px; float:left; background:#ffffff; margin-bottom:20px; margin-right:20px; } .canpro1_photo,.canpro2_photo,.canpro3_photo{ width:306px; height:224px; float:right; margin:10px 0px 0px 0px; } .canpro1_information,.canpro2_information,.canpro3_information{ width:278px; height:auto; float:right; margin:0px auto 30px; } .canpro1_information h3,.canpro2_information h3,.canpro3_information h3{ width:260px; font-size:20px; line-height:30px; color:#303233; margin-top:0px; } .canpro1_information p,.canpro2_information p,.canpro3_information p{ width:260px; font-size:14px; line-height:26px; color: #555555; margin-top:8px; word-break:break-word; } .canpro1_information span,.canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:10px; display:none; } .technical_article{ width:640px; height:auto; margin:10px auto 8px auto; float:left; } .technical_article_ico{ width:58px; height:70px; margin:0; padding:0px; float:left; } .technical_article_list{ width:582px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:20px; line-height:22px; color:#303233; font-weight:bold; margin-top:10px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:0; } .technical_article_list ul li{ font-size:14px; line-height:24px; color:#646464; } .canindex1_show{ width:660px; height:auto; margin-top:10px; } .canindex1_show_div{ width:660px; height:118px; float:left; padding:20px 10px; } .video-preview{ width:656px; height:369px; } } @media (min-width: 767px) { #canindex1{ width:100%; margin:0px; padding:35px 0 0; overflow:auto; background:#000909; } #canindex2{ width:100%; margin:0px; padding:35px 0 0; overflow:auto; background:#ffffff; } .section-bg .slider-text{ width:560px; height:350px; margin:50px 35px 10px 82px; padding:0; } .secondary-heading{ width:560px; color:#fff; font-size:50px; line-height:40px; margin:5px 0 22px 0; padding:0; position:relative; } .sub-heading{ width:560px; color:#fff; font-size:24px; line-height:30px; margin:0; padding:0; position:relative; } .yang_card_pro_list{ width:100%; max-width:1200px; margin:0px auto; padding:0px; } .yang_card_h3{ font-size:40px; color:#2e2e2e; text-align:center; line-height:52px; padding-bottom:3px; padding-top:36px; margin-bottom:10px; font-weight:bold; } .yang_card_p{ width:100%; margin:0px; padding:0 70px; text-align:center; } .yang_card_img{ width:100%; height:auto; float:left; margin-top:25px; padding-bottom:60px; } .ct_dt{ color:#ffffff; } } @media (min-width: 770px) { #advertising{ width:100%; height:777px; position:relative; top:75px; } .slides{ height:702px; } .section-bg{ width:100%; height:702px; } .section-bg .slider-text{ width:560px; height:360px; margin:60px 35px 10px 85px; padding:0; } .secondary-heading{ width:560px; color:#fff; font-size:50px; line-height:30px; margin:5px 0 22px 0; padding:0; position:relative; } .sub-heading{ width:560px; color:#fff; font-size:24px; line-height:36px; margin:0; padding:0; position:relative; } .content{ padding:25px 0px 50px 0px; margin:0px 0px; } } @media (min-width: 785px) { #advertising{ width:100%; height:791px; position:relative; top:75px; } .slides{ height:716px; } .section-bg{ width:100%; height:716px; } .section-bg .slider-text{ width:565px; height:360px; margin:60px 35px 10px 95px; padding:0; } .sub-heading{ width:560px; color:#fff; font-size:24px; line-height:36px; margin:0; padding:0; position:relative; } .secondary-heading{ width:560px; color:#fff; font-size:50px; line-height:40px; margin:5px 0 22px 0; padding:0; position:relative; } .content{ padding:25px 0px 50px 0px; margin:0px 0px; } } @media (min-width: 880px) { #advertising{ width:100%; height:877px; position:relative; top:75px; } .slides{ height:802px; } .section-bg{ width:100%; height:802px; } .section-bg .slider-text{ width:700px; height:400px; margin:50px 35px 10px 73px; padding:0; } .sub-heading{ width:700px; color:#fff; font-size:30px; line-height:42px; margin:0; padding:0; position:relative; } .secondary-heading{ width:700px; color:#fff; font-size:64px; line-height:58px; margin:5px 0 27px 0; padding:0; position:relative; } .yang_card_p{ width:860px; margin:0 auto; } .ct_dt{ color:#ffffff; } } @media (min-width: 980px) { #advertising{ width:100%; height:969px; position:relative; top:75px; } .slides{ height:894px; } .section-bg{ width:100%; height:894px; } .section-bg .slider-text{ width:700px; height:400px; margin:70px 35px 10px 120px; padding:0; } .sub-heading{ width:700px; color:#fff; font-size:30px; line-height:42px; margin:0; padding:0; position:relative; } .secondary-heading{ width:700px; color:#fff; font-size:64px; line-height:40px; margin:5px 0 27px 0; padding:0; position:relative; } .yang_card_h3{ width:760px; padding-top:25px; margin-left:auto; margin-right:auto; } .yang_card_p{ width:900px; margin:0 auto;padding:0 70px;font-size:14px; color:#666666; line-height:28px; text-align:center; } .ct_dt{ color:#ffffff; } } @media (min-width: 1024px) { #advertising{ height:644px; background:#000; top:0px; } .slides{ height:644px; } .section-bg{ height:100%; background:url(../images/can/adx_cbg.jpg) center center no-repeat; background-size:cover; } .section-bg .slider-text{ width:100%; height:100%; margin:164px 0 0; padding:0;} .secondary-heading{ width:100%; color:#fff; font-size:48px; line-height:64px; margin:0; position:relative; text-align:left; margin-bottom: 10px } .sub-heading{ width:63%; height:50px;color:#fff; font-size:20px; line-height: 30px; margin:0; position:relative; text-align:left; } .canpro2_left .cancloud_left{ background:url(../images/can/cancloud-left.jpg) center center no-repeat; } .canpro3_left .canopen_left{ background:url(../images/can/canopen_left.jpg) center center no-repeat; } .canpro3_left .cannet_left{ background:url(../images/can/cannet-left.jpg) center center no-repeat; } .canpro3_left .canbus_left{ background:url(../images/can/canbus_left.jpg) center center no-repeat; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 0; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:1024px; height:160px; background:#f5f5f5; margin:66px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:166px; height:80px; float:left; } #can-pro-ico01>a,#can-pro-ico02>a,#can-pro-ico03>a,#can-pro-ico04>a,#can-pro-ico05>a,#can-pro-ico06>a{ width:150px; height:140px; display:block; margin:0px; padding:0px; } .pro-ico01 svg,.pro-ico02 svg,.pro-ico03 svg,.pro-ico04 svg,.pro-ico05 svg,.pro-ico06 svg{ width:60px; height:60px; fill:#646464; margin-left:43px; } .nav-can-pro .active>a{ position:relative; } .nav-can-pro .active>a>div>svg{ fill:#8fc31f; } .nav-can-pro h3{ font-size:14px; line-height:24px; text-align:center; margin-top:10px; } .nav-can-pro .active a:before { content:"鈻?; position:absolute; top:126px; left:0px; width:150px; height:20px; color:#8fc41f; display: block; text-align:center; } .nav-can-pro .active h3{ color:#8fc41f; } .canpro1{ width:1024px; height:1270px; float:left; } .canpro1_top{ width:1024px; height:830px; float:left; } .canpro1_bottom{ width:1024px; height:340px; float:left; display:block; } .canpro1_right{ width:1024px; height:850px; float:left; } .canpro1_right_div{ width:327px; height:390px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro1_right_div:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro1_bottom_div_pc{ width:1024px; height:340px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro1_bottom_div_pc:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro1_photo_pc{ width:668px; height:340px; float:right; margin:0px 0px 0px 0px; } .canpro1_information_pc{ width:340px; height:340px; float:right; margin:30px 0px 0px 0px; text-align:left; } .canpro1_information_pc h3{ width:310px; font-size:22px; font-weight:bold; line-height:40px; color:#303233; margin-top:30px; margin-left:30px; } .canpro1_information_pc p{ width:310px; font-size:14px; line-height:26px; color: #555555; margin-top:18px; margin-left:30px; word-break:break-word; } .canpro1_information_pc span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:140px; display:block; } .canpro1_information_pc span:hover{ background:#83b31d; } .canpro1_photo{ width:323px; height:226px; float:right; margin:36px 2px 0px; } .canpro1_information{ width:323px; height:100px; float:right; margin:0px; } .canpro1_information h3{ width:100%; font-size:22px; font-weight:bold; line-height:42px; text-align:center; color:#303233; } .canpro1_information p{ width:100%; font-size:14px; line-height:26px; color: #555555; text-align:center; } .canpro2{ width:1024px; height:900px; float:left; } .canpro2_left{ width:407px; height:840px; float:left; display:block; } .canpro2_left>div{ width:387px; height:800px; margin:0px 20px 0px 0px; } .canpro2_right{ width:616px; height:840px; float:left; } .canpro2_right_div{ width:610px; height:390px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro2_right_div:nth-of-type(2){ margin-top:20px; } .canpro2_right_div:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro2_photo{ width:280px; height:330px; float:right; margin:58px 10px 0px 0px; } .canpro2_information{ width:280px; height:340px; float:right; margin:30px 0px 0px 0px; } .canpro2_information h3{ width:272px; font-size:22px; font-weight:bold; line-height:40px; color:#303233; margin-top:20px; } .canpro2_information p{ width:272px; font-size:14px; line-height:26px; color: #555555; margin-top:18px; word-break:break-word; } .canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:102px; display:block; } .canpro2_information span:hover{ background:#83b31d; } .canpro3{ width:1024px; height:900px; float:left; } .canpro3_left{ width:407px; height:840px; float:left; display:block; } .canpro3_left>div{ width:387px; height:800px; margin:0px 20px 0px 0px; } .canpro3_right{ width:616px; height:840px; float:left; } .canpro3_right_div{ width:294px; height:390px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro3_right_div:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro3_photo{ width:290px; height:228px; float:right; margin:38px 2px 0px; } .canpro3_information{ width:294px; height:100px; float:right; margin:0px; } .canpro3_information h3{ width:100%; font-size:20px; font-weight:bold; line-height:40px; text-align:center; color:#303233; } .canpro3_information p{ width:100%; font-size:14px; line-height:26px; color: #555555; text-align:center; } .rd1{ margin-right:21px; } .rd2{ margin-top:20px; margin-right:20px; } .rd3{ margin-top:20px; } #canindex1{ width:100%; height:880px; margin:0px; padding:35px 0 0; overflow:auto; background:url(../images/can/canindex1.jpg) center center no-repeat; } #canindex2{ width:100%; height:600px; margin:0px; padding:35px 0 0; overflow:auto; background:#ffffff; } #canindex3{ width:100%; height:640px; margin:35px 0px; padding:0; overflow:auto; } .canindex1_show{ width:1024px; height:570px; margin-top:60px; } .canindex1_show_div{ width:320px; height:258px; float:left; border:1px solid #595857; padding:40px 34px; } .canindex1_show_div h3{ width:100%; font-size:24px; font-weight:bold; line-height:40px; color:#ffffff; } .canindex1_show_div p{ width:100%; font-size:14px; line-height:26px; color:#ffffff; } .canindex1_ico{ width:60px; height:60px; display:block; } .canindex1_show_div:nth-child(1){ margin-left:18px; margin-right:18px; } .canindex1_show_div:nth-child(2){ margin-right:18px; } .canindex1_show_div:nth-child(4){ margin-top:22px; margin-left:18px; margin-right:18px; } .canindex1_show_div:nth-child(5){ margin-top:22px; margin-right:18px; } .canindex1_show_div:nth-child(6){ margin-top:22px; } .canindex1_show_div:hover{ background:rgba(143, 195, 31, 0.8); } .technical_article{ width:340px; height:auto; margin:26px auto 38px auto; float:left; padding-left:6px; } .technical_article_ico{ width:300px; height:180px; margin:0; padding:20px 30px 0 0px; float:left; } .technical_article_list{ width:300px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:24px; line-height:32px; color:#303233; font-weight:bold; margin-top:20px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:20px 0 0; } .technical_article_list ul li{ font-size:14px; line-height:30px; color:#646464; } .technical_article_list ul li a{ color:#646464; } .technical_article_list ul li a:hover{ color:#8fc31f; } #canindex3 .content{ width:1024px; height:auto; margin:0px auto; padding:0px; } .video-preview{ width:1024px; height:576px; } } @media (min-width: 1080px) { #advertising{ height:680px; background:#000; top:0px; } .slides{ height:680px; } .section-bg .slider-text{ margin:170px 0 0; padding:0;} .secondary-heading{ width:100%; color:#fff; font-size:48px; line-height:64px; margin:0; position:relative; margin-bottom: 10px} .sub-heading{ width:63%; height:50px;color:#fff; font-size:22px; margin:0; position:relative;line-height: 32px } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 0; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:1080px; height:160px; background:#f5f5f5; margin:66px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:180px; height:80px; float:left; } #can-pro-ico01>a,#can-pro-ico02>a,#can-pro-ico03>a,#can-pro-ico04>a,#can-pro-ico05>a,#can-pro-ico06>a{ width:179px; height:140px; display:block; margin:0px; padding:0px; } .pro-ico01 svg,.pro-ico02 svg,.pro-ico03 svg,.pro-ico04 svg,.pro-ico05 svg,.pro-ico06 svg{ width:60px; height:60px; fill:#646464; margin-left:60px; } .nav-can-pro .active>a{ position:relative; } .nav-can-pro .active>a>div>svg{ fill:#8fc31f; } .nav-can-pro h3{ font-size:14px; line-height:24px; text-align:center; margin-top:10px; } .nav-can-pro .active a:before { content:"鈻?; position:absolute; top:126px; left:0px; width:178px; height:20px; color:#8fc41f; display: block; text-align:center; } .nav-can-pro .active h3{ color:#8fc41f; } .canpro1{ width:1080px; height:1280px; float:left; } .canpro1_top{ width:1080px; height:830px; float:left; } .canpro1_bottom{ width:1080px; height:390px; float:left; display:block; } .canpro1_right{ width:1080px; height:850px; float:left; } .canpro1_right_div{ width:346px; height:390px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro1_right_div:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro1_bottom_div_pc{ width:1080px; height:350px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro1_bottom_div_pc:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro1_photo_pc{ width:714px; height:350px; float:right; margin:0px 0px 0px 0px; } .canpro1_information_pc{ width:340px; height:340px; float:right; margin:30px 0px 0px 0px; text-align:left; } .canpro1_information_pc h3{ width:310px; font-size:22px; font-weight:bold; line-height:40px; color:#303233; margin-top:30px; margin-left:30px; } .canpro1_information_pc p{ width:310px; font-size:14px; line-height:26px; color: #555555; margin-top:18px; margin-left:30px; word-break:break-word; } .canpro1_information_pc span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:140px; display:block; } .canpro1_information_pc span:hover{ background:#83b31d; } .canpro1_photo{ width:330px; height:234px; float:right; margin:32px 8px 0px; } .canpro1_information{ width:346px; height:100px; float:right; margin:0px; } .canpro1_information h3{ width:100%; font-size:22px; font-weight:bold; line-height:42px; text-align:center; color:#303233; } .canpro1_information p{ width:100%; font-size:14px; line-height:26px; color: #555555; text-align:center; } .canpro2{ width:1080px; height:900px; float:left; } .canpro2_left{ width:407px; height:840px; float:left; display:block; } .canpro2_left>div{ width:387px; height:800px; margin:0px 20px 0px 0px; } .canpro2_right{ width:670px; height:840px; float:left; } .canpro2_right_div{ width:662px; height:390px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro2_right_div:nth-of-type(2){ margin-top:20px; } .canpro2_right_div:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro2_photo{ width:310px; height:330px; float:right; margin:58px 0px 0px 0px; } .canpro2_information{ width:320px; height:340px; float:right; margin:30px 0px 0px 0px; } .canpro2_information h3{ width:320px; font-size:22px; font-weight:bold; line-height:40px; color:#303233; margin-top:20px; } .canpro2_information p{ width:300px; font-size:14px; line-height:26px; color: #555555; margin-top:18px; word-break:break-word; } .canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:140px; display:block; } .canpro2_information span:hover{ background:#83b31d; } .canpro3{ width:1080px; height:900px; float:left; } .canpro3_left{ width:407px; height:840px; float:left; display:block; } .canpro3_left>div{ width:387px; height:800px; margin:0px 20px 0px 0px; } .canpro3_right{ width:662px; height:840px; float:left; } .canpro3_right_div{ width:320px; height:390px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro3_right_div:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro3_photo{ width:320px; height:230px; float:right; margin:36px 0px 0px; } .canpro3_information{ width:320px; height:100px; float:right; margin:0px; } .canpro3_information h3{ width:100%; font-size:22px; font-weight:bold; line-height:40px; text-align:center; color:#303233; } .canpro3_information p{ width:100%; font-size:14px; line-height:26px; color: #555555; text-align:center; } .rd1{ margin-right:21px; } .rd2{ margin-top:20px; margin-right:21px; } .rd3{ margin-top:20px; } #canindex1{ width:100%; height:880px; margin:0px; padding:35px 0 0; overflow:auto; background:url(../images/can/canindex1.jpg) center center no-repeat; } #canindex2{ width:100%; height:600px; margin:0px; padding:35px 0 0; overflow:auto; background:#ffffff; } #canindex3{ width:100%; height:640px; margin:35px 0px; padding:0; overflow:auto; } .canindex1_show{ width:1080px; height:570px; margin-top:60px; } .canindex1_show_div{ width:328px; height:258px; float:left; border:1px solid #595857; padding:40px 34px; } .canindex1_show_div h3{ width:100%; font-size:24px; font-weight:bold; line-height:40px; color:#ffffff; } .canindex1_show_div p{ width:100%; font-size:14px; line-height:26px; color:#ffffff; } .canindex1_ico{ width:60px; height:60px; display:block; } .canindex1_show_div:nth-child(1){ margin-left:18px; margin-right:18px; } .canindex1_show_div:nth-child(2){ margin-right:18px; } .canindex1_show_div:nth-child(4){ margin-top:22px; margin-left:18px; margin-right:18px; } .canindex1_show_div:nth-child(5){ margin-top:22px; margin-right:18px; } .canindex1_show_div:nth-child(6){ margin-top:22px; } .canindex1_show_div:hover{ background:rgba(143, 195, 31, 0.8); } .technical_article{ width:360px; height:auto; margin:26px auto 22px auto; float:left; padding-left:10px; } .technical_article_ico{ width:330px; height:180px; margin:0; padding:20px 22px 0 0px; float:left; } .technical_article_list{ width:330px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:24px; line-height:32px; color:#303233; font-weight:bold; margin-top:20px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:20px 0 0; } .technical_article_list ul li{ width:100%; height:auto; font-size:14px; line-height:30px; color:#646464; } .technical_article_list ul li a{ color:#646464; } .technical_article_list ul li a:hover{ color:#8fc31f; } #canindex3 .content{ width:1080px; height:auto; margin:0px auto; padding:0px; } .video-preview{ width:1080px; height:608px; } } @media (min-width: 1200px) { #advertising{ height:756px; background:#000; } .slides{ height:756px; } .section-bg{ height:100%; background:url(../images/can/adx_bg.jpg) center center no-repeat; background-size:cover; } .section-bg .slider-text{ margin:180px 0 0; padding:0; } .secondary-heading{ width:100%; color:#fff; font-size:48px; line-height:76px; margin:0; padding:0; position:relative; } .sub-heading{ color:#fff; font-size:22px; margin:0; position:relative; } #canindexpro{ width:100%; height:auto; margin:0px; padding:35px 0 0; overflow:auto; background:#f5f5f5; } .nav-can-pro{ width:1200px; height:140px; background:#f5f5f5; margin:66px 0px 0px 0px; } #can-pro-ico01,#can-pro-ico02,#can-pro-ico03,#can-pro-ico04,#can-pro-ico05,#can-pro-ico06{ width:200px; height:80px; float:left; } #can-pro-ico01>a,#can-pro-ico02>a,#can-pro-ico03>a,#can-pro-ico04>a,#can-pro-ico05>a,#can-pro-ico06>a{ width:199px; height:140px; display:block; margin:0px; padding:0px; } .pro-ico01 svg,.pro-ico02 svg,.pro-ico03 svg,.pro-ico04 svg,.pro-ico05 svg,.pro-ico06 svg{ width:60px; height:60px; fill:#646464; margin-left:70px; } .nav-can-pro .active>a{ position:relative; } .nav-can-pro .active>a>div>svg{ fill:#8fc31f; } .nav-can-pro h3{ font-size:14px; text-align:center;margin-top:10px; } .nav-can-pro .active a:before { content:"鈻?; position:absolute; top:100px; left:0px; width:198px; height:20px; color:#8fc41f; display: block; text-align:center; } .nav-can-pro .active h3{ color:#8fc41f; } .canpro1{ width:1200px; height:1320px; float:left; } .canpro1_top{ width:1200px; height:830px; float:left; } .canpro1_bottom{ width:1200px; height:390px; float:left; } .canpro1_right{ width:1200px; height:850px; float:left; } .canpro1_right_div{ width:386px; height:390px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro1_right_div:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro1_bottom_div_pc{ width:1192px; height:390px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro1_bottom_div_pc:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro1_photo_pc{ width:790px; height:390px; float:right; margin:0px 0px 0px 0px; } .canpro1_information_pc{ width:400px; height:340px; float:right; margin:30px 0px 0px 0px; text-align:left; } .canpro1_information_pc h3{ width:388px; font-size:24px; font-weight:bold; line-height:40px; color:#303233; margin-top:30px; margin-left:60px; } .canpro1_information_pc p{ width:388px; font-size:14px; line-height:26px; color: #555555; margin-top:18px; margin-left:60px; word-break:break-word; } .canpro1_information_pc span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:140px; display:block; } .canpro1_information_pc span:hover{ background:#83b31d; } .canpro1_photo{ width:346px; height:236px; float:right; margin:30px 19px 0px; } .canpro1_information{ width:380px; height:100px; float:right; margin:0px; } .canpro1_information h3{ width:100%; font-size:24px; font-weight:bold; line-height:42px; text-align:center; color:#303233; } .canpro1_information p{ width:100%; font-size:14px; line-height:26px; color: #555555; text-align:center; } .canpro2{ width:1200px; height:900px; float:left; } .canpro2_left{ width:407px; height:840px; float:left; display:block; } .canpro2_left>div{ width:387px; height:800px; margin:0px 20px 0px 0px; } .canpro2_right{ width:793px; height:840px; float:left; } .canpro2_right_div{ width:793px; height:390px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro2_right_div:nth-of-type(2){ margin-top:20px; } .canpro2_right_div:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro2_photo{ width:378px; height:330px; float:right; margin:58px 10px 0px 0px; } .canpro2_information{ width:368px; height:340px; float:right; margin:30px 0px 0px 0px; } .canpro2_information h3{ width:356px; font-size:24px; font-weight:bold; line-height:40px; color:#303233; margin-top:20px; } .canpro2_information p{ width:356px; font-size:14px; line-height:26px; color: #555555; margin-top:18px; word-break:break-word; } .canpro2_information span{ width:96px; height:32px; background:#8fc31f; color:#ffffff !important; font-size:14px; line-height:32px; text-align:center; display:block; float:left; border-radius:4px; margin-top:140px; display:block; } .canpro2_information span:hover{ background:#83b31d; } .canpro3{ width:1200px; height:900px; float:left; } .canpro3_left{ width:407px; height:840px; float:left; display:block; } .canpro3_left>div{ width:387px; height:800px; margin:0px 20px 0px 0px; } .canpro3_right{ width:793px; height:840px; float:left; } .canpro3_right_div{ width:386px; height:390px; float:left; background:#ffffff; margin-bottom:0px; margin-right:0px; } .canpro3_right_div:hover{ box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.1); } .canpro3_photo{ width:346px; height:236px; float:right; margin:30px 19px 0px; } .canpro3_information{ width:380px; height:100px; float:right; margin:0px; } .canpro3_information h3{ width:100%; font-size:24px; font-weight:bold; line-height:42px; text-align:center; color:#303233; } .canpro3_information p{ width:100%; font-size:14px; line-height:26px; color: #555555; text-align:center; } .rd1{ margin-right:21px; } .rd2{ margin-top:20px; margin-right:21px; } .rd3{ margin-top:20px; } #canindex1{ width:100%; height:880px; margin:0px; padding:35px 0 0; overflow:auto; background:url(../images/can/canindex1.jpg) center center no-repeat; } #canindex2{ width:100%; height:600px; margin:0px; padding:35px 0 0; overflow:auto; background:#ffffff; } #canindex3{ width:100%; height:720px; margin:35px 0px; padding:0; overflow:auto; } .canindex1_show{ width:1200px; height:570px; margin-top:60px; } .canindex1_show_div{ width:388px; height:258px; float:left; border:1px solid #595857; padding:40px 34px; } .canindex1_show_div h3{ width:100%; font-size:24px; font-weight:bold; line-height:40px; color:#ffffff; } .canindex1_show_div p{ width:100%; font-size:14px; line-height:26px; color:#ffffff; } .canindex1_ico{ width:60px; height:60px; } .canindex1_show_div:nth-child(1),.canindex1_show_div:nth-child(2){ margin-left:0px; margin-right:18px; } .canindex1_show_div:nth-child(4),.canindex1_show_div:nth-child(5){ margin-top:22px; margin-left:0px; margin-right:18px; } .canindex1_show_div:nth-child(6){ margin-top:22px; } .canindex1_show_div:hover{ background:rgba(143, 195, 31, 0.8); } .technical_article{ width:400px; height:auto; margin:26px auto 38px auto; float:left; padding-left:0px; } .technical_article_ico{ width:338px; height:180px; margin:0; padding:20px 30px 0 0px; float:left; } .technical_article_list{ width:338px; height:auto; margin:0 auto; float:left; padding:0; } .technical_article_list h3{ font-size:24px; line-height:32px; color:#303233; font-weight:bold; margin-top:20px; padding-left:6px; } .technical_article_list ul{ width:100%; height:auto; max-height:160px; margin:20px 0 0; } .technical_article_list ul li{ font-size:14px; line-height:30px; color:#646464; padding-left:6px;} .technical_article_list ul li a{ color:#646464; } .technical_article_list ul li a:hover{ color:#8fc31f; } #canindex3 .content{ width:1200px; height:auto; margin:0px auto; padding:0px; } .video-preview{ width:1200px; height:675px; } } @media (min-width: 1921px) { #advertising{ height:756px; background:#000; top:0px; } .slides{ height:756px; } .section-bg{ height:100%; background:url(../images/can/adx_bbg.jpg) center center no-repeat; background-size:cover; } .section-bg .slider-text{ width:100%; height:100%; margin:164px 0 0; padding:0;} .secondary-heading{ width:100%; color:#fff; font-size:48px; line-height:64px; margin:0; position:relative; text-align:left; margin-bottom: 10px } .sub-heading{ width:63%; height:50px;color:#fff; font-size:20px; line-height: 30px; margin:0; position:relative; text-align:left; } }