/*新增*/ .odm_banner_p {position: relative;} .odm_b_title {position: absolute; } @media screen and (min-width:960px){ .odm_b_title {top:36%; left:18.5%;} .odm_b_title h3{ font-size:3.75em; } .odn_t_small {width:45%;line-height: 1.8em;} } @media (min-width:480px) and (max-width:959px){ .odm_b_title {top:26%; left:10%;} .odm_b_title h3{ font-size:3em; } .odn_t_small {width:80%;line-height: 1.5em;} } @media (max-width:479px){ .odm_b_title {top:6%; left:10%;} .odm_b_title h3{ font-size:2em; } .odn_t_small {width:90%;line-height: 1.2em;} } .odm_b_title h3 {color: #fff;padding-bottom:4%; font-weight: 100; } .odn_t_small { color: #fff; font-size:1em; } @media screen and (min-width:1440px){ .odm_usb_tex {width:1440px;} } @media screen and (max-width:1439px){ .odm_usb_tex {width:96%;} } .odm_usb_tex { margin: auto; padding: 4.2% 0 2.8%; font-family:"LATO-MEDIUM"; } @media screen and (min-width:700px){ .odm_usb_t { font-size:2em; } .odm_usb_sm {font-size: 1.125em;width:60%;line-height: 1.8em;} .odm_research { font-size:2em; } .odm_re_text {font-size: 1.125em;} } @media (min-width:481px) and (max-width:699px){ .odm_usb_t { font-size:1.5em; } .odm_usb_sm {font-size: 1.125em;width:80%;line-height: 1.8em;} .odm_research { font-size:1.4em; } .odm_re_text {font-size: 1em;} } @media (max-width:480px){ .odm_usb_t { font-size:1.2em; } .odm_usb_sm {font-size: 1.125em;width:96%;line-height: 1.8em;} .odm_research { font-size:1.2em; } } .odm_research {font-weight: 600; color: #101010;font-family:"LATO-MEDIUM";} .odm_research01 {font-weight: 600; color: #101010;padding: 3.5% 0 2.5%; text-align: center; font-size:1.625em;font-family:"LATO-MEDIUM";} .odm_usb_t {font-weight: 600; text-align: center; color: #101010; padding-bottom: 2.9%;font-family:"LATO-MEDIUM"; } .odm_usb_sm { color: #737373; margin: auto; text-align: center; } .odm_usb_sm01 {font-size: 1.125em; color: #737373; width:80%; margin: auto; text-align: center; line-height: 1.8em;} /*解决方案*/ .odm_f1 {background: #f1f1f1; padding-bottom: 3.2%;} .odm_one { background: url(../../images/odm/odm1_bg_05.jpg) no-repeat; margin: auto; padding:1% 4.2%; height:100%; } .odm_ont_bg {background:rgb(61,166,227,0.9); margin: auto; padding: 3.9% 8%;} .odm_ont_bor { padding: 6% 2% 4% 5%; margin: auto; border: 1px solid #fff;} @media screen and (min-width:850px){ .odm_two_num { float: left; } .odm_line_l {float: left; padding: 1% 8% 1% 6%;} .odm_two_order {float: left; color: #fff;} .font_one {font-size:1.5em; padding: 0 2%; } .font_two {font-size: 2em; padding: 5% 0; font-weight: 600;} } @media screen and (max-width:850px){ .odm_two_num { padding-bottom: 5%;text-align: center;} .odm_two_num img {width:40%;} .odm_line_l {display: none;} .odm_two_order { color: #fff; text-align: center; } .font_one {font-size:1.2em; padding: 0 2%; } .font_two {font-size: 1.5em; padding: 5% 0; font-weight: 600;} } @media screen and (min-width:1440px){ .odm_ont_bg {width:84%;} .odm_one {width:66.6%;} .odm_ont_bor {width:93%;} .odm_re_all { width:1440px; margin: auto; } } @media screen and (max-width:1439px){ .odm_re_all { width:96%; margin: auto; } } .odm_research {text-align: center; padding: 5.5% 0 4.5%; } @media screen and (min-width:481px){ .odm_re_img li {width:32.53%; float: left;} } @media (max-width:480px){ .odm_re_img li {width:96%; margin: auto;} } .odm_re_img li { margin-right: 1%; background: #fff;position: relative;} .odm_re_img li img {width:100%;} .odm_re_img li:last-child {margin-right: 0;} .odm_re_text { color: #737373; text-align:center; padding:5% 0;} /*oder*/ @media screen and (min-width:481px){ .odm_re_img01 li {width:32.53%; float: left;} } @media (max-width:480px){ .odm_re_img01 li {width:96%; margin:2% auto;} } .odm_re_img01 li { margin-right: 1%; background: #fff;position: relative;} .odm_re_img01 li img {width:100%;} .odm_re_img01 li:last-child {margin-right: 0;} .odm_order_t {position: absolute; width:100%; text-align: center;left: 0; color: #fff; font-size: 1em;} @media screen and (min-width:960px){ .odm_order_t { top:40%;} } @media screen and (min-width:481px) and (max-width:959px){ .odm_order_t { top:20%; line-height: 1.2em;} } @media screen and (max-width:480px){ .odm_order_t { top:40%;} } /*ODM项目*/ .odm_service { font-size:2em; padding:5.8% 0 4.5%; text-align: center; color: #101010; font-weight: 600;font-family:"LATO-MEDIUM"; } .odm_se_img {padding-bottom: 5.2%;} .odm_se_img img {width:100%;} .odm_patent { } /*新增*/ .ODM-Gray{background-color:#f1f1f1; overflow: hidden;} .ODM-White{background-color:#FFFFFF; overflow: hidden;} .ODM-Blue{background-color:#002855; overflow: hidden;} .ODM-Brand{padding-top:4.5%; padding-bottom: 4.5%;} .ODM-Brand .ODM-Brand-L{width:43%; float: left; margin-right:3%; text-align: center} .ODM-Title{text-align: center; font-size: 2em; margin-bottom: 4.5%; padding-top: 5.3%; color:#101010; font-weight: 600;font-family:"LATO-MEDIUM";} .ODM-Des{color:#444444; line-height: 2em; margin-bottom: 3%; font-size: 1.125em;} .ODM-Brand .ODM-Brand-L .Image{width:10%; margin-right:0px; margin:18% auto 0; text-align: center; } .ODM-Brand .ODM-Brand-R{width:54%; float:left;} @media screen and (max-width:768px){ .ODM-Brand .ODM-Brand-L, .ODM-Brand .ODM-Brand-R{width:100%;} } @media screen and (max-width:960px){ .ODM-Brand .ODM-Brand-L .Image{display: none;} } .ODM-punctuation{margin-left:8px; font-size: 1.25em;} .ODM-Menu{width:100%; overflow: hidden; display: table; position: relative;} .ODM-Menu ul{position: absolute; width:100%; height: 100%; top:0; left:0;} .ODM-Menu li{width:14.28%; color:#FFF; font-size: 1.125em; position: relative; float: left; height: 100%;} .ODM-Menu li a{text-decoration: none; color:#FFF; position: absolute; top:50%; margin-top:-20px; line-height: 40px; display: inline-block; text-align: center; width:80%; left: 10%; } @media screen and (min-width:541px){ .ODM-Menu .M-02{display:none} .ODM-Menu .P-01{display:block; width:100%; text-align: center; position: absolute;top:47%;} } @media screen and (min-width:381px) and (max-width:540px){ .ODM-Menu li a{line-height: 20px;} .ODM-Menu .M-02{display:block;width:100%; text-align: center; position: absolute;top:23%;} .ODM-Menu .P-01{display:none} } @media screen and (max-width:380px){ .ODM-Menu li a{line-height: 16px;} .ODM-Menu .M-02{display:block;width:100%; text-align: center; position: absolute;top:15%;line-height: 20px;} .ODM-Menu .P-01{display:none} } .ODM-Menu li:nth-child(1){background-color:#00a1ff;} .ODM-Menu li:nth-child(2){background-color:#2dccd3;} .ODM-Menu li:nth-child(3){background-color:#00bb31;} .ODM-Menu li:nth-child(4){background-color:#ff6900;} .ODM-Menu li:nth-child(5){background-color:#963cbd;} .ODM-Menu li:nth-child(6){background-color:#c4d600} .ODM-Menu li:nth-child(7){width:14.26%; background-color:#000000; color:#FFF;} .ODM-Solution{padding-top:3%; padding-bottom: 3%;} .ODM-Solution .ODM-Title{margin-bottom: 2%;} .ODM-Solution .ODM-Subtitle{font-size: 1.125em; color:#444; text-align: center; margin-bottom: 2.5%;} .ODM-Solution .ODM-Des{position: absolute; top:16%; text-align: center; width:100%; } @media screen and (min-width:769px){ .Table{display: table; width:100%;} .Table .Table-Row{display: table-row;} .Table .Table-Row .Table-Cell{display: table-cell; margin:0; padding:0;} } .ODM-Solution-L .Image{position: absolute; bottom:13%; width:100%;} .ODM-Solution-L{width:46.8%; border:1px solid #d4d4d4; padding:0; position: relative;} .ODM-Solution-C{width:1.8%;} .ODM-Solution-R{width:51.3%;} .ODM-Solution-L .title{color:#444444; font-size: 1.5em; position: absolute; z-index: 2; top:10%; text-align: center; width:100%;} .ODM-Solution-L .title span{padding-left:20px; padding-right:20px; background-color:#f1f1f1; display: inline-block;} .ODM-Solution-L .line{width:80%; margin:auto; height: 1px; background-color:#c9c9ca; margin-bottom: 3%; position: absolute; top:13%; left:10%; } .ODM-Solution-R .all-center{border:1px solid #d4d4d4; overflow: hidden; clear: both;} .ODM-Solution-R .all-center .title{color:#444; font-size: 1.5em; text-align: center; padding:4.5% 0 3.5%;} .ODM-Solution-R .all-center ul{width:92%; margin:auto;} .ODM-Select{ padding-bottom: 1.8%;} .ODM-Select .ODM-Title{margin-bottom: 2%;} .ODM-Select .des{width:60%; margin:auto; color:#444; line-height: 2em;} .ODM-Solution-R .all-center li p{text-align: center; font-size: 0.875em; color:#444444; padding:5% 0 10%; margin:0px;} .ODM-Solution-R .all-center li:last-child{margin-right:0px;} @media screen and (min-width:481px){ .ODM-Solution-R .all-center li{width:32.3%; margin-right:1.5%; float: left;} .ODM-Solution-R .all-center li p{font-size: 0.875em; padding:5.5% 0 14%; } } @media screen and (max-width:480px){ .ODM-Solution-R .all-center li{width:100%; clear: both; text-align: center} .ODM-Solution-R .all-center li img{display: block; width:90%; margin:auto;} .ODM-Solution-R .all-center li p{font-size: 1.125em; padding:5% 0 10%;} } @media screen and (max-width:768px){ .Table{width:90%; margin:auto;} .ODM-Solution-L{width:100%; float: left;} .ODM-Solution-C{display: none;} .ODM-Solution-R{width:100%; float: left; margin-top:2%;} .ODM-Solution-L .title{position: relative; margin-top:12%;} .ODM-Solution .ODM-Des{position: relative; margin-top:5%;} .ODM-Solution-L .Image{position: relative; margin-bottom:10%; width:100%; margin-top:10%;} } .ODM-Select .des{width:60%; margin:auto; color:#444;} @media screen and (max-width:768px){ .ODM-Select .des{width:80%; font-size: 1.125em; line-height:1.5em; padding: 2% 0;} } .ODM-Select .table01 {margin-top:1%; width:50%; float: left;} .ODM-Select .table01 li{width:47.4%; float: left; margin-right:2.5%; margin-bottom: 3%; overflow: hidden} .ODM-Select .table02 {margin-top:1%; float: left; width:50%;} .ODM-Select .table02 li{width:1%; width:49%; float: left; margin-right:2%; margin-bottom: 3%;overflow: hidden } .ODM-Select .table02 li:nth-child(2){width:49%; margin-right:0;} .ODM-Select .table02 li:last-child{width:100%; margin-right:0;} @media screen and (max-width:768px){ .ODM-Select .table01 li{width:48%; margin-right:4%;} .ODM-Select .table01 li:nth-child(2n){margin-right:0;} .ODM-Select .table01, .ODM-Select .table02{margin-top:1%; width:100%;} } .ODM-Select .table01 li img {max-width: 100%; } .ODM-Select .Patent{} .ODM-Select .Patent img {width:100%;} /**/ .lj_odm_bg { background:#fff;} .lj_odm_w {width:75%; margin: auto;} .lj_title { color: #002855; text-align: center; font-size:1.875em; font-weight: 600; position: relative;} .lj_title .dot{display:inline-block;width:3%;height: 33px;position: absolute;top:35%;margin-left: 5px;} .lj_title .dot img {max-width: 100%;} .lj_odm_process {} .lj_odm_process li { float: left; position: relative;} .lj_odm_process li:nth-child(1):before {content: ""; position: absolute; background: url(../images/odm_icon_03.png) no-repeat; width:11px; height: 14px; top:37px; left: -20px;} .lj_odm_process li:nth-child(10):after {content: ""; position: absolute; background: url(../images/odm_icon_03.png) no-repeat; width:11px; height: 14px; top:37px; right: -20px;} .lj_odm_process li .text01 {text-align: center; padding-bottom: 20px;color: #002855; font-size:1em;} .process_img{position: relative; border-top: 1px solid #dadada;} @media screen and (min-width:1025px){ .lj_title{padding: 3em 0;} .lj_odm_process li {width:20%; } .process_img {padding: 20px 0 50px;} } @media (min-width:481px) and (max-width:1024px){ .lj_title{padding: 2em 0;} .lj_odm_process li {width:33.3%; } .lj_odm_process li .text01 {padding-bottom: 15px;} .process_img {padding: 25px 0 30px;} } @media (min-width:320px) and (max-width:480px){ .lj_title{padding: 1.5em 0;} .lj_odm_process li {width:50%; } .lj_odm_process li .text01 {padding-bottom: 10px;} .process_img {padding: 10px 0 20px;} } .lj_odm_process li .process_img:after { content: ""; position: absolute; left: 50%; width:5px; height: 5px; border-radius: 5px; background: #002855; margin-left:-2.5px; z-index: 2; top:0px; margin-top:-2.5px;} .process_img {text-align: center; width:100%; } .process_img img {max-width: 53%;} .odm_n_z {padding-top: 3.8%; } @media screen and (min-width:1440px){ .odm_pic_i {width:1440px;} } @media screen and (max-width:1439px){ .odm_pic_i {width:96%;} } .odm_pic_i {margin: auto;} .odm_pic_i img {width:100%;} /*菜单动画*/ .hz li {margin-right: 25px;} .hz li:last-child {margin-right: 0;} .MH-Before{position: absolute; z-index: -1; width:100%;} .MH-after{ z-index: 2; top:0px; -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-duration: 1s; animation-duration: 1s; animation-fill-mode:forwards ; -webkit-animation-fill-mode:forwards ; } .indexbox2 .ODM-Title{margin-bottom: 3%} @-webkit-keyframes fadeIn { 0% { opacity:0 } 100% { opacity:1 } } @keyframes fadeIn { 0% { opacity:0 } 100% { opacity:1 } }