@charset "utf-8";
.banner { position: relative; background: #fff; margin: 0 auto; overflow: hidden; clear: both; }
.banner .swiper-slide { line-height: 0; }
.banner .swiper-slide img { width: 100%; }
.banner .swiper-pagination { bottom: 30px !important; }
.banner .swiper-pagination-bullet { width: 8px; height: 8px; background: #fff; opacity: 0.4; border-radius: 4px; cursor: pointer; margin: 0 8px !important; transition: all 0.5s ease; }
.banner .swiper-pagination-bullet-active { opacity: 1; width: 26px; }
.banner .prev,.banner .next { width: 54px; height: 54px; cursor: pointer; margin-left: 10px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.3); background-color: rgba(255,255,255,0.2); top: 46%; left: -100px; position: absolute; z-index: 9; transition: all 0.5s ease; }
.banner .prev:hover,.banner .next:hover { border-color: #fff; }
.banner .next { left: auto; right: -100px; }
.banner:hover .prev { left: 3%; }
.banner:hover .next { right: 3%; }
/*title*/
h2.main_title { text-align: center; }
h2.main_title a { display: block; font-size: 0; line-height: 0; }
h2.main_title strong { display: inline-block; font-size: 42px; line-height: 100%; color: #323232; position: relative; }
h2.main_title strong:before,h2.main_title strong:after { position: absolute; content: ""; width: 330px; height: 24px; background: url(/images/tbg1.png) no-repeat center; background-size: 100% 100%; top: 22px; }
h2.main_title strong:before { left: -366px; }
h2.main_title strong:after { right: -366px; background-image: url(/images/tbg2.png); }
h2.main_title i { color: #1768E4; }
h2.main_title span { display: block; font-weight: normal; font-size: 18px; line-height: 100%; color: #818181; margin-top: 21px; }
.search { height: 90px; background: #ffffff; box-shadow: 0px 4px 8px 1px rgba(123,123,123,0.13); }
.search .container { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; }
.search .keyword { padding-left: 35px; background: url(/images/hot.png) no-repeat left center; font-size: 14px; line-height: 90px; color: #2d2d2d; display: flex; display: -webkit-flex; overflow: hidden; }
.search .keyword strong { font-weight: normal; display: block; }
.search .keyword a { color: #999; transition: all 0.5s ease; display: block; margin-right: 28px; }
.search .keyword a:hover { color: #1768E4; }
.search .search_input { width: 431px; height: 45px; border-radius: 5px; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; border: 1px solid rgba(153,153,153,0.5); }
.search .search_input input[type="text"] { padding-left: 14px; display: block; background: none; border: none; outline: none; font-size: 14px; line-height: 43px; color: #2d2d2d; width: 360px; }
.search .search_input .submit { display: block; background: none; border: none; outline: none; width: 50px; height: 43px; background: url(/images/s_btn.png) no-repeat center; cursor: pointer; font-size: 0; }
/*product*/
.product { padding: 102px 0 143px; position: relative; overflow: hidden; }
.product:before { position: absolute; content: ""; height: 660px; background: #ebebeb; width: 100%; left: 0; top: 0; }
.product_nav { margin: 66px 0 50px; overflow: hidden; display: grid; grid-template-columns: repeat(5,1fr); gap: 1px; }
.product_nav h3 { width: 100%; overflow: hidden; transition: all 0.5s ease; }
.product_nav h3 a { display: block; background: #fff; transition: all 0.5s ease; box-sizing: border-box; padding: 0 22px; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; }
.product_nav h3 span { display: block; font-size: 16px; line-height: 76px; color: #4d4d4d; }
.product_nav h3 i { display: none; font-size: 20px; line-height: 76px; color: #fff; font-family: "D-DIN"; font-weight: normal; transition: all 0.5s ease; }
.product_nav h3:hover { box-shadow: 0px 7px 19px 2px rgba(23,104,228,0.41); }
.product_nav h3:hover a { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; background: linear-gradient(135deg,#355ec3,#1768e4); }
.product_nav h3:hover span { color: #fff; }
.product_nav h3:hover i { display: block; }
.product_hot dl { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; height: 530px; background: #ffffff; box-shadow: 0px 9px 54px 3px rgba(123,123,123,0.24); }
.product_hot dt { width: 61.428%; height: 530px; line-height: 0; overflow: hidden; }
.product_hot dt img { width: 100%; height: 100%; object-fit: cover; }
.product_hot dd { width: 38.572%; box-sizing: border-box; padding: 100px 6.57% 0 4.78%; }
.product_hot dd h4 a { display: block; font-size: 28px; line-height: 30px; color: #1768E4; padding-bottom: 22px; position: relative; }
.product_hot dd h4 a:after { position: absolute; content: ""; width: 76px; height: 3px; background: #1768e4; left: 0; bottom: 0; }
.product_hot dd p { font-size: 14px; line-height: 24px; color: #999; max-height: 72px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; margin: 30px 0 128px; }
.product_hot dd .more { display: flex; display: -webkit-flex; }
.product_hot dd .more a { display: block; width: 164px; height: 42px; background: #ffffff; border-radius: 20px; border: 2px solid #1768e4; box-sizing: border-box; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; transition: all 0.5s ease; }
.product_hot dd .more a img { width: 22px; display: block; margin-right: 8px; }
.product_hot dd .more a span { display: block; font-size: 16px; line-height: 38px; color: #1768E4; }
.product_hot dd .more a:hover { background: linear-gradient(135deg,#355ec3,#1768e4); box-shadow: 0px 7px 19px 2px rgba(23,104,228,0.41); border-radius: 20px; }
.product_hot dd .more a:hover img { filter: brightness(10); }
.product_hot dd .more a:hover span { color: #fff; }
.product_hot dd .more a:first-child { margin-right: 26px; }
.product .recommend { text-align: center; margin: 50px 0 44px; }
.product .recommend span { display: inline-block; font-weight: normal; font-size: 34px; line-height: 40px; color: #323232; position: relative; }
.product .recommend span:before,.product .recommend span:after { position: absolute; content: ""; width: 419px; height: 40px; background: url(/images/tbg3.png) no-repeat center; top: 0; }
.product .recommend span:before { left: -436px; }
.product .recommend span:after { right: -436px; background-image: url(/images/tbg4.png); }
.pro_con { position: relative; }
.pro_list { overflow: hidden; }
.pro_list li { width: 32.214%; position: relative; background:#f1f1f1; }
.pro_list li > a { display: block; overflow: hidden; line-height: 0; }
.pro_list li > a img { width: 86%; margin:3% 7% 11%; }
.pro_list li h4 { position: absolute; width: 100%; bottom: 0; left: 0; height: 100%; transition: all 0.5s ease; }
.pro_list li h4 a { display: block; font-size: 24px; line-height: 32px; color: #000; font-weight: normal; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 374px 20px 0; box-sizing: border-box; width: 100%; height: 100%; transition: all 0.5s ease; }
.pro_list li h4 a:after { position: absolute; content: ""; content: "+"; width: 36px; height: 36px; background: #ffffff; border-radius: 50%; text-align: center; font-size: 30px; line-height: 30px; color: #2c4d9d; font-weight: bold; left: 50%; margin-left: -18px; bottom: 40px; transition: all 0.5s ease; opacity: 0; }
.pro_list li:hover h4 { background: rgba(41,102,209,0.8); }
.pro_list li:hover h4 a { height: 100%; padding-top: 180px; color: #fff; }
.pro_list li:hover h4 a:after { opacity: 1; bottom: 160px; }
.y_prev,.y_next { position: absolute; width: 65px; height: 65px; top: 50%; margin-top: -32px; transition: all 0.5s ease; filter: grayscale(1); opacity: 0.5; cursor: pointer; }
.y_prev img,.y_next img { width: 100%; }
.y_prev:hover,.y_next:hover { filter: grayscale(0); opacity: 1; }
.pro_prev { left: -125px; }
.pro_next { right: -125px; }
.ys { padding: 108px 0 94px; background: url(/images/ys_bg.jpg) no-repeat center top; overflow: hidden; }
.ys .container { position: relative; }
.ys .pic { width: 432px; position: absolute; top: 100px; right: 50%; margin-right: 200px; }
.ys .pic img { width: 100%; }
.ys .ys_con { float: right; margin-top: 58px; }
.ys .ys_slide { display: block; float: right; width: 746px; height: 150px; background: #ffffff; border-radius: 5px; margin-bottom: 10px; overflow: hidden; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; box-sizing: border-box; transition: all 0.5s ease; padding: 14px 14px 14px 26px; }
.ys .ys_slide i { display: block; width: 82px; height: 82px; background: linear-gradient(-55deg,#25c9ff,#1768e4); border-radius: 50%; }
.ys .ys_slide i img { filter: brightness(10); }
.ys .ys_slide > img { width: 199px; }
.ys .ys_slide div { padding: 0 28px; }
.ys .ys_slide h4 { font-size: 22px; line-height: 26px; color: #4d4d4d; margin-bottom: 16px; font-weight: bold; }
.ys .ys_slide p { font-size: 14px; line-height: 18px; color: #999; }
.ys .ys_slide.on { background: linear-gradient(-55deg,#25c9ff,#1768e4); box-shadow: 0px 7px 19px 2px rgba(23,104,228,0.41); width: 828px; }
.ys .ys_slide.on i { background: #eeeeee; border: 7px solid #fff; }
.ys .ys_slide.on i img { filter: brightness(1); }
.ys .ys_slide.on h4,.ys .ys_slide.on p { color: #fff; }
.sm_banner { background: url(/images/sm_bg.jpg) no-repeat center top; height: 328px; }
.sm_banner .fl { width: 300px; padding-top: 83px; float: left; }
.sm_banner .fl h2 { margin-bottom: 18px; }
.sm_banner .fl h2 span { display: block; font-size: 34px; line-height: 46px; color: #fff; letter-spacing: 2px; }
.sm_banner .fl p { font-size: 16px; line-height: 30px; color: #fff; font-weight: bold; }
.sm_banner .fr { width: 300px; float: right; padding-top: 78px; }
.sm_banner .fr h3 { text-align: right; }
.sm_banner .fr h3 span { display: inline-block; font-size: 26px; line-height: 42px; color: #fff; letter-spacing: 2px; background: #2966d1; box-shadow: 0px 7px 19px 2px rgba(23,104,228,0.41); padding: 0 15px; }
.sm_banner .fr h3 span:last-child { background: #1c54b5; }
.sm_banner .s_tel { text-align: right; margin-top: 40px; }
.sm_banner .s_tel span { display: inline-block; font-size: 14px; line-height: 16px; color: #fff; padding-left: 21px; background: url(/images/s_tel.png) no-repeat left center; }
.sm_banner .s_tel strong { display: block; font-size: 28px; line-height: 100%; color: #fff; margin-top: 4px; font-weight: bold; font-family: "D-DIN"; }
.industry { padding: 100px 0 109px; }
.industry .industry_con { padding-top: 48px; display: flex; display: -webkit-flex; }
.industry li { height: 377px; width: 16.66%; box-sizing: border-box; padding: 34px 30px 0; transition: all 0.5s ease; position: relative; text-align: center; }
.industry li > img { width: 141px; display: block; margin: 0 auto 59px; }
.industry li h3 { font-size: 24px; line-height: 100%; color: #323232; font-weight: bold; padding-bottom: 23px; position: relative; transition: all 0.5s ease; }
.industry li h3:after { position: absolute; content: ""; width: 58px; height: 3px; background: #2966d1; left: 50%; margin-left: -29px; bottom: 0; opacity: 0; transition: all 0.5s ease; }
.industry li p { font-size: 14px; line-height: 24px; color: #323232; display: none; }
.industry li a.ask { position: absolute; width: 139px; height: 41px; background: #ffffff; border-radius: 21px; border: 2px solid #2966d1; left: 50%; margin-left: -70px; bottom: 26px; transition: all 0.5s ease; box-sizing: border-box; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; }
.industry li a.ask img { width: 22px; display: none; margin-right: 9px; }
.industry li a.ask span { font-size: 14px; line-height: 37px; color: #2966d1; font-weight: bold; }
.industry li:before { position: absolute; content: ""; width: 1px; height: 323px; background: rgba(153,153,153,0.2); top: 28px; left: 0; }
.industry li:last-child:after { position: absolute; content: ""; width: 1px; height: 323px; background: rgba(153,153,153,0.2); top: 28px; right: 0; }
.industry li:hover { background: #ffffff; box-shadow: 0px 7px 21px 3px rgba(87,87,87,0.13); }
.industry li:hover > img { display: none; }
.industry li:hover h3 { margin-bottom: 37px; padding-top: 26px; }
.industry li:hover h3:after { opacity: 1; }
.industry li:hover p { display: block; }
.industry li:hover a.ask { background: linear-gradient(-55deg,#355ec3,#1768e4); box-shadow: 0px 5px 12px 1px rgba(23,104,228,0.39); border: none; height: 39px; }
.industry li:hover a.ask img { display: block; }
.industry li:hover a.ask span { color: #fff; line-height: 39px; }
/*case*/
.case { background: #eee; padding-top: 107px; overflow: hidden; }
.case_con { position: relative; }
.case_con .case_list { padding: 62px 0; overflow: hidden; }
.case_con .case_list_con { width: 803px; margin: 0 auto; }
.case_con dt { line-height: 0; overflow: hidden; background: #000; }
.case_con dt img { width: 100%; }
.case_con dd { height: 129px; background: #fff; }
.case_con dd a { display: block; padding: 38px 32px 0; box-sizing: border-box; height: 129px; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.case_con dd h4 { width: 240px; }
.case_con dd h4 strong { display: block; font-size: 18px; line-height: 28px; color: #999; font-weight: bold; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.case_con dd h4 span { display: block; font-size: 14px; line-height: 100%; color: #999; font-weight: normal; margin-top: 7px; }
.case_con dd p { font-size: 14px; line-height: 24px; color: #999; max-height: 48px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; width: 447px; }
.case_con .swiper-slide dt img { opacity: 0.5; }
.case_con .swiper-slide-active { box-shadow: 0px 9px 54px 3px rgba(123,123,123,0.24); }
.case_con .swiper-slide-active dt img { opacity: 1; }
.case_con .swiper-slide-active dd h4 strong { color: #000; }
.case_con .swiper-slide-active dd h4 span { color: #009af3; }
.case_con .swiper-slide-active dd p { color: #333; }
/*client*/
.client { background: #eee; padding-bottom: 134px; }
.client h2 { margin-bottom: 44px; }
.client h2 a { display: block; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; padding-top: 12px; }
.client h2 strong { display: block; font-size: 32px; line-height: 100%; color: #000; font-weight: bold; }
.client h2 i { color: #1768E4; }
.client h2 span { display: block; float: right; font-size: 20px; line-height: 100%; color: #1768e4; font-weight: normal; padding-top: 12px; transition: all 0.5s ease; }
.client h2 span:hover { letter-spacing: 1px; }
.client ul { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.client li { background: #ffffff; box-shadow: 0px 5px 16px 2px rgba(104,104,104,0.15); width: 19%; line-height: 0; overflow: hidden; }
.client li img { width: 100%; }
.power { background: url(/images/power_bg.jpg) no-repeat center top; padding: 109px 0 139px; overflow: hidden; }
.power h2 strong,.power h2 span { color: #fff; }
.power h2 strong:before { background-image: url(/images/tbg5.png); }
.power h2 strong:after { background-image: url(/images/tbg6.png); }
.power_nav { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; margin: 66px 0 43px; }
.power_nav h3 { width: 24%; height: 116px; background: #ffffff; position: relative; cursor: pointer; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; transition: all 0.5s ease; }
.power_nav h3 img { max-width: 100%; margin-right: 16px; }
.power_nav h3 i { display: block; }
.power_nav h3 strong { display: block; font-size: 24px; line-height: 100%; color: #323232; font-weight: normal; }
.power_nav h3 span { display: block; font-size: 14px; line-height: 100%; color: #323232; font-weight: normal; font-family: "D-DIN"; margin-top: 9px; }
.power_nav h3:after { position: absolute; content: ""; border-style: solid; border-width: 12px; border-color: #fff transparent transparent transparent; top: 104px; left: 50%; margin-left: -12px; opacity: 0; transition: all 0.5s ease; }
.power_nav h3.on,.power_nav h3:hover { background: #2966d1; box-shadow: 0px 10px 24px 3px rgba(23,104,228,0.57); }
.power_nav h3.on img,.power_nav h3:hover img { filter: brightness(10); }
.power_nav h3.on strong,.power_nav h3:hover strong { color: #fff; font-weight: bold; }
.power_nav h3.on span,.power_nav h3:hover span { color: #fff; }
.power_nav h3.on:after,.power_nav h3:hover:after { top: 100%; opacity: 1; border-color: #2966d1 transparent transparent transparent; }
.power_con { height: 530px; background: #ffffff; box-shadow: 0px 9px 54px 3px rgba(123,123,123,0.24); overflow: hidden; padding: 30px 50px 30px 30px; box-sizing: border-box; }
.power_con dl { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; background: #fff; }
.power_con dt { width: 56.287%; height: 470px; line-height: 0; overflow: hidden; }
.power_con dt img { width: 100%; height: 100%; object-fit: cover; }
.power_con dd { width: 40.9%; padding-top: 43px; }
.power_con dd h3 { font-size: 36px; line-height: 100%; color: #2966d1; font-weight: normal; padding-bottom: 36px; border-bottom: 1px solid #999; position: relative; margin-bottom: 38px; }
.power_con dd h3:after { position: absolute; content: ""; width: 183px; height: 4px; background: #2966d1; left: 0; bottom: -1px; z-index: 2; }
.power_con dd h4 { font-size: 22px; line-height: 100%; color: #000; font-weight: normal; }
.power_con dd p { font-size: 16px; line-height: 24px; color: #808080; margin: 18px 0 36px; }
.power_con dd ul { display: flex; display: -webkit-flex; }
.power_con dd li { width: 213px; line-height: 0; overflow: hidden; }
.power_con dd li img { width: 100%; }
.power_con dd li:first-child { margin-right: 16px; }
/*news*/
.news { padding-top: 106px; padding-bottom: 131px; background: #eeeeee; }
.news_nav { margin-bottom: 38px; margin-top: 68px; border-bottom: 2px solid #dadada; }
.news_nav { position: relative; display: flex; display: -webkit-flex; }
.news_nav h3 strong { display: inline-block; font-size: 20px; line-height: 100%; color: #52595e; font-weight: normal; position: relative; padding: 0 32px 26px; }
.news_nav h3 strong:after { position: absolute; content: ""; width: 0; height: 2px; background: #2966d1; left: 0; bottom: -2px; opacity: 0; transition: all 0.5s ease; }
.news_nav h3 span { position: absolute; font-size: 20px; line-height: 100%; color: #2966d1; transition: all 0.5s ease; right: 0; top: 0; font-weight: normal; display: none; }
.news_nav h3 span:hover { letter-spacing: 1px; }
.news_nav h3.on strong,.news_nav h3:hover strong { color: #000; font-weight: bold; }
.news_nav h3.on strong:after,.news_nav h3:hover strong:after { width: 100%; opacity: 1; }
.news_nav h3.on span,.news_nav h3:hover span { display: block; }
.news_con .swiper-slide { background: #eee; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.news_con dl { width: 32.35%; }
.news_con dt { line-height: 0; overflow: hidden; }
.news_con dt img { width: 100%; }
.news_con dd h4 { font-size: 18px; line-height: 28px; color: #000; font-weight: normal; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-top: 24px; transition: all 0.5s ease; }
.news_con dd p { font-size: 14px; line-height: 27px; color: #999; max-height: 54px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 14px 0 30px; }
.news_con dd span { display: block; font-size: 16px; line-height: 100%; color: #6d6d6d; transition: all 0.5s ease; font-family: "D-DIN"; font-weight: normal; }
.news_con dl:hover dd h4,.news_con dl:hover dd span { color: #000; }
.faq { margin-top: 65px; background: #fff; height: 189px; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; }
.faq h3 { width: 138px; height: 189px; }
.faq h3 a { display: block; background: #2966d1; font-size: 20px; line-height: 189px; color: #fff; font-weight: bold; text-align: center; }
.faq .faq_con { width: calc(100% - 180px); overflow: hidden; }
.faq li { position: relative; box-sizing: border-box; width: 33.33%; }
.faq li a { display: block; padding: 32px 60px 0 10px; box-sizing: border-box; height: 189px; }
.faq li h4 { font-size: 18px; line-height: 30px; color: #000; font-weight: normal; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; transition: all 0.5s ease; }
.faq li p { font-size: 14px; line-height: 27px; color: #999; max-height: 54px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 7px 0 24px; }
.faq li span { display: block; font-size: 16px; line-height: 100%; color: #6d6d6d; font-family: "D-DIN"; font-weight: normal; }
.faq li:hover h4 { color: #1768E4; }
/*about*/
.about { background: url(/images/about_bg.jpg) no-repeat center top; height: 721px; position: relative; }
.about:after { position: absolute; content: ""; width: 50%; left: 50%; top: 0; height: 100%; background: rgba(255,255,255,0.9); }
.about .container { position: relative; }
.about h2 { float: left; padding-top: 89px; margin-left: -45px; }
.about h2 a { display: block; padding-bottom: 12px; position: relative; display: flex; display: -webkit-flex; align-items: flex-end; }
.about h2 a:after { position: absolute; content: ""; width: 459px; height: 1px; background: #1768E4; opacity: 0.59; right: 16px; bottom: 0; }
.about h2 img { width: 256px; display: block; margin-right: 19px; }
.about h2 strong { display: block; font-size: 26px; line-height: 36px; color: #323232; font-weight: bold; }
.about h2 strong:last-child { padding-left: 20px; }
.about h2 i { color: #1768E4; }
.about .con { width: 45.57%; float: right; position: relative; z-index: 2; padding-top: 85px; }
.about h3 a { display: block; position: relative; padding-top: 28px; }
.about h3 strong { display: inline-block; font-size: 42px; line-height: 100%; color: #2966d1; position: relative; }
.about h3 strong:after { position: absolute; content: ""; width: 330px; height: 24px; background: url(/images/tbg2.png) no-repeat center; background-size: 100% 100%; top: 14px; right: -365px; }
.about h3 span { font-weight: 400; font-size: 80px; color: #000000; line-height: 1; font-style: italic; opacity: 0.13; position: absolute; font-family: serif; left: 26px; top: 0; }
.about h4 { font-size: 24px; line-height: 100%; color: #323232; font-weight: bold; margin: 70px 0 13px; }
.about p { font-size: 16px; line-height: 30px; color: #818181; }
.about a.moreinfo { margin-top: 28px; display: block; transition: all 0.5s ease; box-sizing: border-box; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; width: 162px; height: 40px; background: #1768e4; border-radius: 20px; }
.about a.moreinfo img { width: 22px; display: block; }
.about a.moreinfo span { display: block; font-size: 16px; line-height: 40px; color: #fff; font-weight: bold; transition: all 0.5s ease; margin-left: 8px; }
.about a.moreinfo:hover span { margin-left: 10px; }
.about .album { display: flex; display: -webkit-flex; margin-top: 62px; }
.about .album li { width: 285px; line-height: 0; overflow: hidden; background: #adadad; box-shadow: 0px 7px 19px 2px rgba(23,104,228,0.41); border: 4px solid #ffffff; box-sizing: border-box; }
.about .album li img { width: 100%; }
.about .album li:first-child { margin-right: 18px; }

/*links*/
.links { height: 57px; overflow: hidden; box-sizing: border-box; background: #eeeeee; }
.links em { font-style: normal; font-size: 14px; line-height: 57px; color: #999; float: left; margin-right: 60px; }
.links a { display: block; font-size: 14px; color: #999; line-height: 57px; margin-right: 50px; transition: all 0.5s ease; float: left; }
.links a:hover { color: #1768E4; }
@media screen and (max-width:1440px),screen and (max-width:1440px) and (-webkit-min-device-pixel-ratio:2) {
  .pro_list li h4 a { padding-top: 344px; }
  .pro_list li:hover h4 a:after { bottom: 140px; }
  .y_prev,.y_next { width: 60px; height: 60px; margin-top: -30px; }
  .y_prev { left: -80px; }
  .y_next { right: -80px; }
}