@charset "utf-8";
/*banner*/
.banner { position: relative; z-index: 3; width: 100%; overflow: hidden;line-height: 0;}
.banner .switch { position: absolute; right: 4%; bottom: 2.5rem; z-index: 9; }
.switch { width: 6.25rem; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.switch div { width: 2.75rem; height: 2.75rem; background: #ffffff; box-shadow: 0rem 0.45rem 2.95rem 0rem rgba(51,51,51,0.1); border-radius: 50%; transition: all 0.5s ease; cursor: pointer; }
.switch div:hover { background: #008AE0; }
.switch div:hover img { filter: invert(1); }
/*title*/
h2.main_title { text-align: center; position: relative; padding-bottom: 1.1rem; }
h2.main_title:after { position: absolute; content: ""; width: 1.2rem; height: 0.2rem; background: #008AE0; bottom: 0; left: 50%; margin-left: -0.6rem; }
h2.main_title a { display: block; line-height: 0; }
h2.main_title strong { display: block; font-size: 2.4rem; color: #000; line-height: 100%; letter-spacing: 1px; margin-bottom: 1rem; }
h2.main_title b { color: #008AE0; }
h2.main_title span { display: block; font-weight: normal; font-size: 1.4rem; color: #666; line-height: 100%; letter-spacing: 0.35rem; }
.product { padding: 5rem 0 5.25rem; overflow: hidden; margin-left: 4%; }
.product h2 a { display: block; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.product h2 em { font-style: normal; }
.product h2 em strong { display: block; font-size: 2.4rem; color: #000; line-height: 2.5rem; font-weight: normal; }
.product h2 em span { display: block; font-size: 1.2rem; color: #999; line-height: 100%; margin-top: 0.75rem; font-weight: normal; }
.pro_con { margin: 2.5rem 0; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.pro_con dl { width: 88%; }
.pro_con dt { overflow: hidden; line-height: 0; }
.pro_con dt img { width: 100%; }
.pro_con dd { height: 12.65rem; background: #f8f8f8 url(/mobile/images/product_bg.png) no-repeat right bottom; background-size: 4.2rem auto; position: relative; overflow: hidden; }
.pro_con dd a { display: block; }
.pro_con dd h4 { font-size: 1.5rem; color: #03162c; line-height: 1.6rem; font-weight: normal; padding: 1.8rem 2.1rem; height: 9.15rem; box-sizing: border-box; overflow: hidden; }
.pro_con dd i { display: block; height: 3.5rem; display: flex; display: -webkit-flex; box-sizing: border-box; padding-left: 1.65rem; }
.pro_con dd i span { display: block; font-size: 1.1rem; color: #999; line-height: 2.3rem; margin-right: 0.9rem; transition: all 0.5s ease; }
.pro_con dd i img { width: 0.75rem; display: block; margin-top: 0.95rem; height: 0.65rem; }
.pro_con dd i:hover span { color: #D4000F; letter-spacing: 0.5px; }
.product1 { background-color: #f8f8f8; margin-left: 0; }
.product1 .con { margin-left: 4%; overflow: hidden; }
.product1 dd { background-color: #fff; }
.more { display: block; width: 13.4rem; height: 3.4rem; background: #008AE0; border-radius: 1.7rem; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; }
.more span { display: block; text-transform: uppercase; font-size: 1.2rem; color: #fff; line-height: 3.4rem; font-weight: bold; }
.more img { display: block; width: 0.95rem; margin-left: 1.2rem; transition: all 0.5s ease; }
.more:hover img { margin-left: 1rem; }
.ys dl { margin-bottom: 0.1rem; position: relative; }
.ys dt { line-height: 0; }
.ys dt img { width: 100%; }
.ys dd { width: 15.5rem; position: absolute; right: 4%; top: 5.7rem; }
.ys dd h3 { font-size: 2.4rem; color: #222; line-height: 2.5rem; font-weight: normal; }
.ys dd a { display: block; margin-top: 2.2rem; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; transition: all 0.5s ease; box-sizing: border-box; width: 11.45rem; height: 2.9rem; background: #008AE0; border-radius: 1.45rem; font-size: 1.1rem; color: #fff; line-height: 100%; text-transform: uppercase; }
.ys dd a img { width: 0.7rem; margin-left: 1rem; transition: all 0.5s ease; }
.ys dd a:hover img { margin-left: 0.8rem; }
.ys dl:first-child dd { width: 100%; top: 4.1rem; left: 0; right: 0; transform: none; padding-left: 4%; box-sizing: border-box; }
.ys dl:first-child dd h3 { color: #fff; width: 28.5rem; }
.ys dl:first-child dd p { font-size: 1.1rem; color: #fff; line-height: 1.8rem; width: 24rem; margin: 1.4rem 0 1.7rem; }
.ys dl:first-child dd a { text-transform: none; background: none; color: #fff; border: 0.1rem solid #fff; margin-top: 0; }
.ys dl:first-child dd a:hover { letter-spacing: 0.5px; }
.ys dl:nth-child(2) dd { height: 100%; }
.ys dl:nth-child(2) dd a:hover { background: #0071b7; }
.ys dl:last-child dd { height: 100%; }
.ys dl:last-child dd a { background: none; border: 0.1rem solid #a0a0a0; color: #333; }
.solution { padding: 4.8rem 4% 5.1rem; }
.solution h2 strong { display: block; font-weight: normal; font-size: 2.4rem; color: #000; line-height: 100%; }
.solution h2 span { display: block; font-size: 1.2rem; color: #ABB0B4; line-height: 1.8rem; margin-top: 0.35rem; font-weight: normal; }
.solution .solution_con { margin-top: 1.6rem; overflow: hidden; }
.solution dt { line-height: 0; overflow: hidden; }
.solution dt img { width: 100%; }
.solution dd p { font-size: 1.1rem; color: #81878c; line-height: 1.8rem; margin-top: 1.35rem; }
.about { background: #f5f7fa url(/mobile/images/about_bg.jpg) no-repeat center top; background-size: 100% 100%; padding: 5.15rem 4% 5.9rem; }
.about h2 { font-size: 2.2rem; color: #222; line-height: 2.5rem; font-weight: normal; }
.about .info { font-size: 1.1rem; color: #666; line-height: 1.8rem; margin: 2rem 0 2.5rem; }
.about li { background: #ffffff; box-shadow: 0px 0.25rem 2rem 0rem rgba(0,0,0,0.06); border-bottom: 0.15rem solid #D4000F; box-sizing: border-box; transition: all 0.5s ease; padding: 4.7rem 3.5rem 0; height: 24rem; line-height: 0; }
.about li img { display: block; width: 2.7rem; }
.about li h3 { font-size: 1.8rem; color: #333; line-height: 100%; font-weight: normal; margin: 3.9rem 0 1.7rem; }
.about li p { font-size: 1.1rem; color: #666; line-height: 1.8rem; }
.about .about_con { position: relative; }
.about .swiper-pagination { bottom: auto !important; right: 1.3rem !important; top: 1.4rem !important; width: 4.5rem !important; left: auto !important; }
.about .swiper-pagination-bullet { opacity: 1; width: 0.8rem; height: 0.8rem; background: #cccccc; border-radius: 50%; margin: 0 0.35rem !important; transition: all 0.5s ease; }
.about .swiper-pagination-bullet-active { opacity: 1; background: #D4000F; }
.album { margin-top: 0.3rem; }
.album ul { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.album ul li { height: 18.3rem; position: relative; line-height: 0; overflow: hidden; }
.album ul li img { object-fit: cover; height: 18.3rem; width: auto; }
.album ul li:first-child { width: 10%; }
.album ul li:nth-child(2) { width: 78.934%; }
.album ul li:last-child { width: 9.6%; }
.sm_banner { margin: 5.75rem 4% 5.85rem; }
.sm_banner .con { background: url(/mobile/images/sm_bg.jpg) no-repeat center top; height: 34.25rem; background-size: 100% 100%; text-align: center; box-sizing: border-box; padding: 21.6rem 0 0; }
.sm_banner h2 { font-size: 1.5rem; color: #fff; line-height: 1.5rem; font-weight: bold; }
.sm_banner p { font-size: 1.1rem; color: #fff; line-height: 1.5rem; margin-top: 0.9rem; margin-bottom: 0.8rem; }
.sm_banner a { display: block; width: 24.45rem; height: 3.8rem; background: rgba(255,255,255,0.3); border-radius: 1.9rem; margin: 0 auto; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; transition: all 0.5s ease; font-size: 1.1rem; color: #fff; line-height: 3.8rem; font-weight: bold; }
.sm_banner a img { display: block; width: 1.25rem; margin-right: 1.2rem; transition: all 0.5s ease; }
.sm_banner a:hover { background: rgba(255,255,255,0.4); }
.sm_banner a:hover img { margin-right: 1rem; }
/*news*/
.news { background: #f8f8f8; padding: 5rem 4% 7rem; }
.news .news_title { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; margin-bottom: 2.5rem; }
.news h2 strong { display: block; font-size: 2.4rem; color: #000; line-height: 100%; font-weight: normal; }
.news .news_con { overflow: hidden; }
.news dt { line-height: 0; overflow: hidden; }
.news dd { background: #fff; }
.news dd a { display: block; padding: 3.6rem 3.2rem 2.4rem; }
.news dd h4 { font-size: 1.5rem; line-height: 2rem; color: #000; max-height: 4rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-weight: normal; }
.news dd p { font-size: 1.1rem; line-height: 1.8rem; color: #666; max-height: 3.6rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; height: 3.6rem; margin: 1.25rem 0 5.6rem; }
.news dd i { display: block; display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; transition: all 0.5s ease; font-size: 1rem; color: #999; line-height: 2rem; }
.news dd i img { width: 0.85rem; display: block; margin-left: 1.45rem; }
.news dd i:hover { color: #D4000F; letter-spacing: 0.5px; }
.subscribe { height: 22.5rem; background: url(/mobile/images/subscribe_bg.jpg) no-repeat center top; text-align: center; padding: 5.75rem 4% 0; box-sizing: border-box; }
.subscribe h2 { margin: 0 auto 1.8rem; font-size: 1.4rem; color: #fff; line-height: 1.8rem; font-weight: bold; }
.subscribe .form { display: block; width: 28.65rem; height: 3.1rem; background: rgba(255,255,255,0.3); border-radius: 0.5rem; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; box-sizing: border-box; padding: 0.25rem 0.25rem 0.25rem 0.95rem; margin: 0 auto; }
.subscribe input { display: block; flex-grow: 1; background: none; border: none; outline: none; font-size: 1.1rem; color: #fff; line-height: 2.6rem; }
.subscribe input::placeholder { color: #fff; }
.subscribe button { display: block; width: 7.15rem; height: 2.6rem; background: #008ae0; border-radius: 0.5rem; font-size: 1.1rem; color: #fff; line-height: 2.6rem; transition: all 0.5s ease; border: none; outline: none; cursor: pointer; }
.subscribe button:hover { background: #0071b7; }
/*header*/
.hd .h_con { position: absolute; z-index: 9; width: 100%; }
.hd .logo { filter: brightness(100); }
.hd .slogan strong,.hd .slogan span { color: #fff; }
.hd .language p { filter: invert(0); }
.hd .search .s_btn img { filter: invert(0); }
.hd .navbtn { filter: invert(0); }