@charset "utf-8";
div,dt{line-height: 0;}
/*banner*/
.banner { position: relative; z-index: 3; width: 100%; overflow: hidden; }
.banner .swiper-pagination { bottom: 1.5rem !important; }
.banner .swiper-pagination-bullet { opacity: 0.6; width: 1rem; height: 0.3rem; background: #fff; border-radius: 0.15rem; margin: 0 0.5rem !important; transition: all 0.5s ease; }
.banner .swiper-pagination-bullet-active { opacity: 1; background: #00398D; width: 1.5rem; }
.intro { padding: 3.5rem 6.66% 5rem; height: 48.85rem; background: url(/mobile/images/intro_bg.jpg) no-repeat center top; background-size: 100% 100%; box-sizing: border-box; }
.intro h2 strong { display: block; font-family: OPPOSans; font-size: 2.4rem; font-weight: 900; line-height: 2.8rem; letter-spacing: 0.1rem; color: #212122; }
.intro .tel { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; margin: 2.5rem 0 1.1rem; }
.intro .tel strong { display: block; font-family: alimama; font-size: 2rem; font-weight: bold; line-height: normal; letter-spacing: 0rem; color: #00398d; }
.intro .tel span { display: block; padding-left: 1.8rem; font-family: OPPOSans; font-size: 1.2rem; font-weight: normal; line-height: 1.6rem; letter-spacing: 0rem; color: #909399; background: url(/mobile/images/intro_tel.png) no-repeat left center; background-size: 1.2rem auto; }
.intro ul { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; }
.intro li { margin-top: 3.5rem; width: 15.1rem; transition: all 0.5s ease; }
.intro li p { font-size: 1.2rem; font-weight: bold; line-height: 1.2rem; letter-spacing: 0rem; color: #212122; padding-bottom: 16px; border-bottom: 1px solid #e2e3e5; }
.intro li i { display: block; margin: 1.5rem 0 0rem; display: flex; display: -webkit-flex; align-items: center; height: 3.8rem; }
.intro li strong { font-family: alimama; font-size: 3.2rem; font-weight: bold; line-height: normal; letter-spacing: 0rem; color: #212122; margin-right: 0.5rem; }
.intro li b { font-family: alimama; font-size: 1.2rem; font-weight: bold; line-height: normal; letter-spacing: 0rem; margin-top: 1rem; color: #212122; }
.intro li span { display: block; font-size: 0.9rem; font-weight: normal; line-height: 0.9rem; letter-spacing: 0rem; color: #212122; }
.intro a.more { margin-top: 2.5rem; }
a.more { display: block; margin: 0 auto; width: 9rem; height: 2.7rem; border-radius: 5.25rem; background: #00398d url(/mobile/images/video_icon.png) no-repeat 6.7rem center; background-size: 1.9rem auto; padding-left: 1.7rem; box-sizing: border-box; transition: all 0.5s ease; font-size: 1rem; font-weight: normal; line-height: 2.7rem; letter-spacing: 0rem; color: #ffffff; }
a.more:hover { width: 9.5rem; background-color: #0045ac; background-position-x: 7.2rem; }
.product { padding: 5rem 4%; }
.product h2 { width: 100%; text-align: center; margin-bottom: 3rem; }
.product h2 strong { display: block; font-size: 2.4rem; font-weight: 900; line-height: 2.8rem; letter-spacing: 0rem; color: #212122; }
.product h2 span { display: block; margin-top: 0.8rem; font-size: 1.8rem; font-weight: normal; line-height: 1.8rem; letter-spacing: 0rem; color: #212122; }
.product ul { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; }
.product li { width: 48.4%; height: 20.5rem; border-radius: 0.5rem; overflow: hidden; background: #eff2f3; transition: all 0.5s ease; margin-bottom: 1.1rem; }
.product li > a { display: block; height: 17.5rem; overflow: hidden; }
.product li > a img { width: 100%; height: 100%; object-fit: cover; }
.product li h4 a { display: block; height: 3rem; text-align: center; box-sizing: border-box; padding: 0 0.8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 1.2rem; font-weight: normal; line-height: 3rem; letter-spacing: 0rem; color: #212122; transition: all 0.5s ease; }
.product a.more { margin-top: 2.5rem; }
.pro_banner { height: 18rem; border-radius: 0.5rem; overflow: hidden; position: relative; margin-bottom: 1.1rem; }
.pro_banner img { width: 100%; height: 100%; object-fit: cover; }
.pro_banner p { position: absolute; left: 2rem; top: 2rem; }
.pro_banner p em { display: inline-block; font-style: normal; padding-bottom: 1rem; border-bottom: 0.05rem solid #00398D; margin-bottom: 1.2rem; }
.pro_banner p strong { display: inline-block; font-size: 1.6rem; font-weight: 900; line-height: 1.6rem; letter-spacing: 0rem; color: #00398d; }
.pro_banner p span { display: inline-block; font-size: 1.6rem; font-weight: 900; line-height: 1.6rem; letter-spacing: 0rem; color: #212122; padding-left: 0.6rem; }
.pro_banner p i { display: block; width: 12.6rem; height: 1.6rem; border-radius: 6.15rem; background: rgba(0,57,141,0.8); text-align: center; font-size: 0.9rem; font-weight: normal; line-height: 1.6rem; letter-spacing: 0rem; color: #ffffff; }
.question { height: 73.8rem; background: url(/mobile/images/question_bg.jpg) no-repeat center top; background-size: 100% 100%; box-sizing: border-box; padding: 5rem 4%; }
.question h2 { font-size: 2.4rem; font-weight: 900; line-height: 2.8rem; letter-spacing: 0rem; color: #212122; text-align: center; margin-bottom: 3rem; }
.question ul { height: 49.5rem; border-radius: 0.5rem; background: rgba(255,255,255,0.9); backdrop-filter: blur(0.5rem); display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; margin: 2.9rem 0 3.1rem; box-sizing: border-box; }
.question li { width: 50%; height: 14rem; padding: 4.15rem 1.5rem 0; box-sizing: border-box; position: relative; transition: all 0.5s ease; margin-bottom: 0.5rem; }
.question li i { position: absolute; font-size: 5rem; font-weight: bold; line-height: normal; letter-spacing: 0rem; transition: all 0.5s ease; background: linear-gradient(180deg,#e2e3e5 0%,rgba(226,227,229,0) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; font-family: alimama; left: 1.5rem; top: 2.35rem; height: 4.5rem; overflow: hidden; }
.question li h3 { font-size: 1.4rem; font-weight: 900; line-height: 1.5rem; letter-spacing: 0rem; color: #212122; position: relative; z-index: 2; }
.question li p { font-size: 0.9rem; font-weight: normal; line-height: 1.3rem; letter-spacing: 0rem; color: #909399; margin-top: 2rem; }
.question li:after { position: absolute; content: ""; width: 18.25rem; height: 15rem; background: #00398D; z-index: -1; left: -0.5rem; top: -0.5rem; border-radius: 0.6rem; opacity: 0; transition: all 0.5s ease; }
.question li:hover { padding: 1rem 1.5rem 0; }
.question li:hover i { height: 3.6rem; font-size: 3rem; left: 1.5rem; bottom: 0rem; top: auto; }
.question li:hover h3 { font-size: 1.5rem; color: #fff; }
.question li:hover p { font-size: 1rem; line-height: 1.5rem; color: #fff; }
.question li:hover:after { opacity: 1; }
.question a.more1 { display: block; width: 15rem; height: 3.2rem; text-align: center; border-radius: 1.6rem; background: #00398D; box-shadow: 0.6rem 0.6rem 0.9rem 0rem rgba(0,57,141,0.2015); font-size: 1.2rem; font-weight: bold; line-height: 3.2rem; letter-spacing: 0rem; color: #ffffff; margin: 1.5rem auto 0; transition: all 0.5s ease; box-sizing: border-box; }
.question a.more1:hover { width: 15.5rem; background: #0045ac; }
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
.ys { height: 74.9rem; padding: 5rem 4%; box-sizing: border-box; background: url(/mobile/images/ys_bg.jpg) no-repeat center top; background-size: 100% 100%; overflow: hidden; }
.ys h2 { font-size: 2.4rem; font-weight: 900; line-height: 3.8rem; font-weight: bold; color: #FFFFFF; margin-bottom: 3rem; }
.ys h2 b { font-size: 4.4rem; font-weight: bold; line-height: normal; letter-spacing: 0rem; color: #EB9F00; font-family: alimama; display: inline-block; vertical-align: sub; }
.ys a.more1 { display: block; width: 15rem; height: 3.2rem; border-radius: 5.6rem; opacity: 1; background: #EB9F00; box-shadow: 0.6rem 0.6rem 0.9rem 0rem rgba(0,57,141,0.2015); margin: 2rem auto 0; font-size: 1.2rem; font-weight: bold; line-height: 3.2rem; letter-spacing: 0rem; color: #FFFFFF; text-align: center; transition: all 0.5s ease; }
.ys a.more1:hover { width: 15.5rem; background: #ffb00b; }
.ys_con dl { border-radius: 0.6rem; overflow: hidden; margin-bottom: 0.5rem; }
.ys_con dt { line-height: 0; overflow: hidden; height: 0; transition: all 0.5s ease; }
.ys_con dd { background: rgba(255,255,255,0.2); display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; box-sizing: border-box; padding: 0 1.5rem; height: 5rem; }
.ys_con dd i { width: 2rem; height: 2rem; box-sizing: border-box; margin-right: 1rem; }
.ys_con dd i img { width: 100%; }
.ys_con dd h4 { font-size: 1.2rem; font-weight: bold; line-height: 1.2rem; letter-spacing: 0rem; color: #FFFFFF; }
.ys_con dd p { display: none; }
.ys_con dl.on dt { height: 17.6rem; }
.ys_con dl.on dd { background: #FFFFFF; height: 9rem; }
.ys_con dl.on dd i { display: block; width: 6rem; height: 6rem; padding: 1.75rem; box-sizing: border-box; position: relative; margin-right: 2rem; }
.ys_con dl.on dd i img { width: 2.5rem; position: relative; z-index: 2; }
.ys_con dl.on dd i:after { position: absolute; content: ""; left: 0; top: 0; width: 100%; height: 100%; background: url(/mobile/images/ys_icon_bg.png) no-repeat center; background-size: 100% auto; animation: spin 5s linear infinite; transition: animation-duration 0.3s; }
.ys_con dl.on dd h4 { font-size: 1.5rem; font-weight: 900; line-height: 1.5rem; letter-spacing: 0rem; color: #00398D; margin-bottom: 0.6rem; }
.ys_con dl.on dd p { display: block; font-size: 1rem; font-weight: normal; line-height: 1.6rem; letter-spacing: 0rem; color: #212122; }
.process { height: 44.1rem; background: url(/mobile/images/process_bg.jpg) no-repeat center top; padding: 5rem 4% 0; box-sizing: border-box; background-size: 100% 100%; }
.process h2 { text-align: center; font-size: 2.4rem; font-weight: 900; line-height: 2.8rem; letter-spacing: 0rem; color: #212122; margin-bottom: 3rem; }
.process ul { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; }
.process li { text-align: center; padding-top: 2rem; box-sizing: border-box; height: 13.6rem; width: 32.17%; position: relative; background: #fff; border-radius: 0.6rem; margin-bottom: 0.6rem; }
.process li i { display: block; width: 4rem; height: 4rem; border: 0.05rem solid #E2E3E5; box-sizing: border-box; padding: 1rem; margin: 0 auto; border-radius: 50%; position: relative; z-index: 2; }
.process li i img { width: 2rem; }
.process li h3 { font-size: 1.2rem; font-weight: normal; line-height: 1.4rem; letter-spacing: 0rem; color: #212122; margin-top: 0.9rem; position: relative; z-index: 2; }
.process li span { display: block; position: relative; z-index: 2; font-family: alimama; font-size: 5rem; font-weight: bold; line-height: normal; letter-spacing: 0rem; background: linear-gradient(180deg,#E2E3E5 -16%,rgba(226,227,229,0) 69%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; position: absolute; left: 50%; bottom: -2.5rem; transform: translateX(-50%); }
.process li:nth-child(-n+2):after { position: absolute; content: ""; width: 2.8rem; height: 1.8rem; background: url(/mobile/images/process_bg1.png) no-repeat center; background-size: contain; right: -1.7rem; top: 50%; z-index: 2; transform: translateY(-50%); }
.process li:nth-child(3):after { position: absolute; content: ""; width: 1.8rem; height: 2.8rem; background: url(/mobile/images/process_bg2.png) no-repeat center; background-size: contain; top: 12.45rem; left: 50%; z-index: 2; transform: translateX(-50%); }
.process li:nth-last-child(-n+2) { width: 49.13%; }
.process li:nth-child(4) { order: 1; }
.process li:nth-child(4):after { position: absolute; content: ""; width: 2.8rem; height: 1.8rem; background: url(/mobile/images/process_bg1.png) no-repeat center; background-size: contain; left: -1.7rem; top: 50%; z-index: 2; transform: translateY(-50%) rotate(180deg); }
.case { padding: 5rem 4%; background: url(/mobile/images/case_bg.jpg) no-repeat center top; background-size: 100% auto; }
.case h2 strong { display: block; font-size: 2.4rem; font-weight: 900; line-height: 2.8rem; letter-spacing: 0rem; color: #FFFFFF; }
.case .case_nav { margin: 2rem 0 3rem; overflow-x: auto; overflow-y: hidden; white-space: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: thin; -ms-overflow-style: none; scrollbar-width: none; }
.case .case_nav::-webkit-scrollbar { display: none; }
.case .case_nav h3 { display: inline-block; white-space: normal; margin-right: 2rem; }
.case .case_nav h3 a { display: block; padding-left: 0.9rem; font-size: 1.2rem; font-weight: normal; line-height: 1.2rem; letter-spacing: 0rem; color: #FFFFFF; transition: all 0.5s ease; position: relative; }
.case .case_nav h3 a:before { position: absolute; content: ""; width: 0.3rem; height: 0.3rem; background: #FFFFFF; border-radius: 50%; left: 0; top: 0.45rem; }
.case .more { margin-top: 1.4rem; }
.case_con { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap; }
.case_con li { width: 48.4%; height: 10.25rem; overflow: hidden; border-radius: 0.6rem; line-height: 0; margin-bottom: 1.1rem; }
.case_con li > a { display: block; height: 10.25rem; position: relative; overflow: hidden; }
.case_con li > a:after { position: absolute; content: ""; width: 100%; height: 100%; border-radius: 0.6rem; left: 0; top: 0; background: linear-gradient(180deg,rgba(0,0,0,0) 61%,rgba(0,0,0,0.8) 99%); }
.case_con li img { width: 100%; height: 100%; object-fit: cover; }
.case_con li h4 { width: 100%; position: absolute; z-index: 2; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; left: 0; bottom: 0.5rem; font-size: 1.2rem; font-weight: normal; line-height: 2.2rem; letter-spacing: 0rem; padding: 0 1rem; color: #FFFFFF; }
.honor { padding: 5rem 0 4.6rem; background: #F7F8FA; }
.honor h2 a { text-align: center; display: block; font-size: 2.4rem; font-weight: 900; line-height: 2.8rem; letter-spacing: 0rem; color: #212122; margin-bottom: 3rem; }
.honor .honor_num { display: flex; display: -webkit-flex; justify-content: space-evenly; }
.honor .honor_num li { width: 7.5rem; height: 5.4rem; background: url(/mobile/images/honor_icon.png) no-repeat center bottom; background-size: 3.2rem 1rem; text-align: center; box-sizing: border-box; }
.honor .honor_num li i { display: block; font-size: 0.8rem; font-weight: bold; line-height: 0.8rem; letter-spacing: 0rem; color: #00398D; }
.honor .honor_num li strong { font-family: alimama; font-size: 2.5rem; font-weight: bold; line-height: normal; letter-spacing: 0rem; margin-right: 0.4rem; color: #00398D; vertical-align: -0.1rem; }
.honor .honor_num li span { display: block; font-size: 0.8rem; font-weight: normal; line-height: 0.8rem; letter-spacing: 0rem; color: #212122; padding-bottom: 0.35rem; border-bottom: 1px solid #E2E3E5; }
.honor_con { position: relative; width: 100%; padding: 4rem 0 1.6rem 0; overflow: hidden; margin: 0 auto; }
.honor_con .swiper-wrapper { align-items: center; }
.honor_con .swiper-slide { width: 13.1rem; height: 18.4rem; transition: all 0.3s ease; list-style: none; background: #fff url(/mobile/images/honor_border.png) no-repeat center; background-size: 100% 18.4rem; box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.1); box-sizing: border-box; padding: 0.8rem; line-height: 0; }
.honor_con .swiper-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.about { background: #F7F8FA; padding-bottom: 5rem; overflow: hidden; }
.about .feature { background: #00398D; padding: 3rem 3.15rem 6.1rem; box-sizing: border-box; }
.about .feature h2 strong { display: block; font-size: 2.4rem; font-weight: 900; line-height: 2.8rem; letter-spacing: 0rem; color: #FFFFFF; }
.about .feature p.info { font-size: 0.9rem; font-weight: normal; line-height: 1.4rem; letter-spacing: 0rem; color: #FFFFFF; margin: 1.5rem 0 1rem; }
.about .feature li { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; border-bottom: 0.05rem solid rgba(255,255,255,0.2); padding-bottom: 0.95rem; padding-top: 2rem; }
.about .feature li i { display: block; font-size: 0.9rem; font-weight: normal; line-height: normal; letter-spacing: 0rem; color: #FFFFFF; }
.about .feature li strong { font-family: alimama; font-size: 2.4rem; font-weight: bold; line-height: normal; letter-spacing: 0rem; color: #FFFFFF; display: inline-block; margin-right: 0.6rem; }
.about .feature li span { display: block; font-size: 0.9rem; font-weight: normal; line-height: 0.9rem; letter-spacing: 0rem; color: #FFFFFF; }
.about .feature li img { width: 3.4rem; }
.about .about_list { margin: -3.1rem 4% 0; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.about .about_list dl { width: 32.17%; height: 15rem; border-radius: 0.6rem 1.6rem 0.6rem 0.6rem; opacity: 1; background: #FFFFFF; box-sizing: border-box; padding: 0.8rem; transition: all 0.5s ease; }
.about .about_list dt { line-height: 0; height: 5.5rem; overflow: hidden; border-radius: 0.4rem; }
.about .about_list dt img { width: 100%; height: 100%; object-fit: cover; }
.about .about_list dd { position: relative; }
.about .about_list dd a { padding: 1.6rem 0.5rem 0; display: block; height: 7.9rem; box-sizing: border-box; }
.about .about_list dd a:after { position: absolute; content: ""; width: 1.6rem; height: 1.6rem; opacity: 1; border: 0.05rem solid #E2E3E5; box-sizing: border-box; background: url(/mobile/images/ys_next.png) no-repeat center; background-size: 1rem auto; left: 0.5rem; bottom: 0.7rem; border-radius: 50%; transition: all 0.5s ease; }
.about .about_list dd strong { display: block; font-size: 1.5rem; font-weight: bold; line-height: 1.5rem; letter-spacing: 0rem; color: #212122; }
.about .about_list dd span { display: block; font-size: 0.7rem; font-weight: normal; line-height: 0.7rem; letter-spacing: 0rem; color: #212122; margin-top: 0.3rem; }
/* .open-video { height: 21.05rem; } */
.open-video video,.open-video iframe { width: 100%; height: 100%; object-fit: cover; }
.news { padding: 5rem 4% 3.5rem; }
.news h2 a { display: block; font-size: 2.4rem; font-weight: 900; line-height: 2.8rem; text-align: center; letter-spacing: 0rem; color: #212122; font-weight: bold; }
.news h2 strong { display: block; }
.news_nav { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; margin: 3rem 0 1.5rem; }
.news_nav h3 { margin: 0 1.5rem; }
.news_nav h3 a { display: block; width: 9.3rem; height: 2.7rem; border-radius: 7.65rem; opacity: 1; box-sizing: border-box; border: 1px solid #E2E3E5; font-size: 1.5rem; font-weight: bold; line-height: 2.6rem; letter-spacing: 0px; color: #212122; text-align: center; }
.news_nav h3.on,.news_nav h3:hover { border-color: #00398D; }
.news_nav h3.on a,.news_nav h3:hover a { color: #00398D; }
.news_con li { height: 4.2rem; border-top: 1px solid #E2E3E5; }
.news_con li img{display: none;}
.news_con li a { display: block; padding-left: 0.8rem; position: relative; }
.news_con li a:before { position: absolute; content: ""; width: 0.3rem; height: 0.3rem; background: #212122; border-radius: 50%; left: 0; top: 1.95rem; }
.news_con li h4 { font-size: 1.2rem; font-weight: 500; line-height: 4.2rem; letter-spacing: 0rem; color: #212122; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.news_con li:first-child { height: 19.4rem; border-radius: 0.6rem; overflow: hidden; line-height: 0; position: relative; margin-bottom: 1.5rem;border:0;}
.news_con li:first-child a { display: block; height: 19.4rem;padding: 0;}
.news_con li:first-child a::before{display: none;}
.news_con li:first-child a:after { position: absolute; content: ""; width: 100%; height: 100%; left: 0; top: 0; background: linear-gradient(180deg,rgba(0,0,0,0) 61%,rgba(0,0,0,0.8) 99%); }
.news_con li:first-child img { width: 100%; height: 100%; object-fit: cover; display: block;}
.news_con li:first-child h4 { position: absolute; width: 100%; box-sizing: border-box; padding: 0 1.5rem; font-size: 1.2rem; font-weight: 500; line-height: 2.2rem; letter-spacing: 0rem; color: #FFFFFF; left: 0; bottom: 1rem; z-index: 2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }