﻿@charset "utf-8";
/* CSS Document */
*{ margin: 0; padding: 0;}
body{ font-family:"Microsoft YaHei",Arial; font-size:100%; color:#000; max-width: 1920px; margin:0px auto; padding:0px; overflow-x:hidden; color: #000;}
ol,ul,li,p,dl,dt,dd,h1,h2,h3,h4,h5,h6{ list-style:none outside none; margin:0px; padding:0px; font-size:100%; font-weight:normal;}
img { border:none; max-width: 100%;}
a:link, a:visited { color: #000; text-decoration: none; outline:none;}
a:hover, a:active { color: #000; text-decoration: none; outline:none;}
video { width: 100%; height: 100%;}
.clear{ clear:both;}
.page_button a { margin-left: 5px; padding: 0 10px; display: inline-block; width: auto; line-height: 32px; border: 1px rgba(0, 0, 0, 0.103) solid; box-sizing: border-box;}
.page_button span { display: inline-block; width: 32px; line-height: 32px;}
.page_button span.current { background: #3061ae; color: #fff;}
.page_button a:hover { background: #3061ae; color: #fff;}

/* newshow------------------------------------ */
.newsshow-container { width: 95%; max-width: 1300px; margin: 50px auto;}
.newsshow_title { text-align: center; font-size: 26px; margin-bottom: 20px;}
.newsshow_title p { font-size: 16px; margin-top: 10px;}
.newsshow_text { padding: 20px 0; border-top: 1px dashed #ccc; border-bottom: 1px dashed #ccc; margin-bottom: 30px;}
.newsshow_text div { margin-bottom: 30px;}
/* .context { display: flex;} */
/* .newsshow a:link, .newsshow  a:visited { color: #000;} */
/* .context a { background: #53c5c1; width: 100px; line-height: 40px; display: inline-block; text-align: center; color: #fff !important;} */

.relevant-case ul { display: flex; flex-wrap: wrap; justify-content: space-between;}
.relevant-case li { flex: 0 1 30%; margin-bottom: 15px; text-align: center;}
.relevant-case li:hover img { transform: scale(1.05); transition: 0.5s;}
.relevant-case li img { transition: 0.5s;}
.case_pic { overflow: hidden;}
.case_wb { line-height: 30px; background: rgb(123, 123, 138); margin-top: 15px; transition: 0.5s; color: #fff;}
.relevant-case li:hover .case_wb { background: rgb(168, 168, 200); transition: 0.5s;}
.toggle_button { display: flex; justify-content: space-between;}
.toggle_button a { background: #3061ae; width: 100px; line-height: 40px; display: inline-block; text-align: center; color: #fff !important;}
.bdsharebuttonbox  { margin: 20px 0;}
.bdsharebuttonbox a { width: auto;}
.relevant_title { font-size: 20px; text-align: center; margin-bottom: 15px;}
.relevant_news li { float: left; width: 45%; list-style-type: circle;  list-style-position: inside;}
.relevant_news li span { float: right; color: #b6b2b2;}
.relevant_news li:nth-of-type(even) { margin-left: 4%; padding-left: 5%; box-sizing: border-box;}
@media screen and (max-width:700px) {
      .relevant_news ul { display: flex; flex-direction: column;}
      .relevant_news li { width: 100%;}
      .relevant_news li:nth-of-type(even) { padding-left: 0; margin-left: 0;}
      .newsshow_title { font-size: 22px;}
}
/* productshow--------------------------------------------------- */
.product_show { width: 100%; padding: 50px 0; background: #f0f0f0;}
.product_container { width: 95%; max-width: 1300px; margin: auto; padding: 20px; background: #fff; box-sizing: border-box;}
.product_container .left { flex: 0 1 40%;}
.product_container .right { flex: 0 1 50%; text-align: center;}
.product_container .right div>span { font-size: 30px; margin-bottom: 30px; display: block;}
.product_container .right p { font-size: 24px;}
.pro_introdution { max-width: 1300px; margin: 50px auto; padding: 30px 20px; box-sizing: border-box; background: #fff; display: flex; justify-content: space-between;}
.pro_introdution .left { flex: 0 1 78%;}
.introduction_title { display: flex; margin-bottom: 30px; border-bottom: 2px rgba(204, 204, 204, 0.438) solid;}
.introduction_title p { font-size: 20px; color: #212121; background: #2b3888; padding: 0 10px; color: #fff; margin-right: 1px; line-height: 46px;}
.introduction_title p:nth-child(2) { background: #f08418;}
.introduction_title a { display: flex; align-items: center; font-size: 18px; color: #fff; text-align: center; line-height: 46px;}
.relevant_product { background: #fff; padding: 0 20px; box-sizing: border-box; flex: 0 1 20%;}
.relevant_text { color: #fff;  line-height: 30px; text-align: center; background: #c5c5c5; transition: 0.5s; height: 28px; line-height: 28px; overflow: hidden;}
.relevant_content li:hover img { transform: scale(1.05); transition: 0.5s;}
.relevant_content li:hover .relevant_text { background: #2b3888; transition: 0.5s;}
.relevant_content li img { transition: 0.5s;}
.relevant_content li + li { margin-top: 10px;}
.relevant_photograph { overflow: hidden;}
.productshow_button { display: flex; justify-content: space-between;}
.productshow_button a { display: block; background: #2b3888; padding: 10px; color: #fff;}
.dd ul { display: block !important;}
.dd h4:after { margin-bottom: 0 !important;}

::-webkit-scrollbar {width:5px;height:8px;background-color:#fff;border-radius:4px; position:relative;}
::-webkit-scrollbar-thumb {background-color:#b1b1b1;border-radius:3px;}
@media screen and (max-width: 1024px) {
      .pro_introdution { display: block; margin: 50px auto 0;}
      .relevant_product { margin-top: 50px; padding: 0;}
      .relevant_content ul { display: flex; justify-content: space-between;}
      .relevant_content li { flex: 0 1 32%;} 
      .relevant_content li + li { margin-top: 0;}
      .relevant_title { font-weight: bold; color: #2b3888;}
      .product_container .right div>span { font-size: 24px;}
      
}
@media screen and (max-width: 768px) {
      .product_container .right div>span { font-size: 22px;}
}
@media screen and (max-width: 700px) {
      .product_container .right div>span { font-size: 18px;}
      .relevant_content li:nth-of-type(n+3) { display: none;}
      .relevant_content li { flex: 0 1 49%;}
      .relevant_text { padding: 0 10px;}
      .product_show  { padding: 40px 0 50px;}
}

.iphone_footer { width: 100%; display: none; padding: 5px 0; text-align: center; background: #202962; position: fixed; bottom: 0;}
.iphone_footer ul { display: flex;}
.iphone_footer li { flex: 0 1 25%;}
.iphone_footer a { display: block; width: 100%; color: #fff;}
.iphone_footer li + li { border-left: 1px solid rgba(255, 255, 255, 0.596);}
.iphone_footer img { width: 25%;}
@media screen and (max-width: 700px) {
      .iphone_footer { display: block; z-index: 100;}
}
.iw_poi_title { color: #CC5522;}
/*基础配置*/

@font-face {
      font-family:"SourceHanSanCN";
      src: url('../fonts/SOURCEHANSANSCN-REGULAR.OTF');
}
@font-face {
      font-family:"SourceHanSanCN-Light";
      src: url('../fonts/SOURCEHANSANSCN-LIGHT.OTF');
}
@font-face {
      font-family:"DIN";
      src: url('../fonts/Din.ttf');
}
@font-face {
      font-family:"Myriad Pro";
      src: url('../fonts/MyriadPro-Regular-14.otf');
}
@font-face {
      font-family:"Montserrat";
      src: url('../fonts/Montserrat-Regular.otf');
}
@font-face {
      font-family:"Montserrat-Light";
      src: url('../fonts/Montserrat-Light.otf');
}

/* header----------------------------- */
.nav { width: 100%; background: #fff; position: relative;}
.nav-container { height: 100px; height: 100px; line-height: 100px; width: 95%; max-width: 1640px; margin: auto; display: flex; justify-content: space-between; }
.nav-left { display: flex; align-items: center;}
.nav-right { flex: 0 1 79.268%; display: flex; justify-content: space-between; align-items: center;}
.nav-right-l { flex: 0 1 67.7%; position: relative;}
.nav-right-l>ul { display: flex; color: #494949; justify-content: space-between; align-items: center;}
.nav-right-l a { display: block;}
.nav-right-l>ul>li { position: relative;}
.nav-right-l>ul>li::after { content: ''; background: #f08519; height: 2px; width: 120%; position: absolute; bottom: 1px; left: -10%; transition: 0.5s; transform: scale(0);}
.nav-right-l>ul>li:hover::after, .nav-right-l li.current::after { transform: scale(1);}
.nav-right-r { flex: 0 1 24%; display: flex; justify-content: space-between; align-items: center; flex-direction: row-reverse;}
.nav-iphone { background: url(../images/nav-iphone.jpg) no-repeat; background-position: 0 49%; padding-left: 30px; color: #212a63; font-size: 22px;}
.nav-scan {  cursor: pointer; position: relative; flex: 0 1 35%;}
.nav-scan:hover .click-scan { display: block;}
.click-scan { position: absolute; width: 100px; height: 100px; bottom: -500%; left: -150%; background: #ededed; display: none; transition: 0.5s; z-index: 10;}
.second-nav { width: 120px; text-align: center; line-height: 50px; position: absolute; left: -24%; top: 100%; z-index: 100; background: #fff; display: none;}
.second-nav li:hover { background: #f084197e; color: #fff;}
.other-nav { left: -43%;}     

.mobile_menu { display: none;}
.mobile_menu div { width: 28px; height: 3px; background: #2b356a;}
.mobile_menu div + div { margin-top: 5px;}
.mobile_sub_menu { display: none; width: 40%; position: fixed; right:-100%; height: 1000px; margin-left: auto; background: #fff; padding: 30px; box-sizing: border-box; transition: 0.5s; z-index: 50;}
.mobile_sub_menu>div>a { font-size: 18px; font-weight: bold;}
.mobile_sub_menu ul { padding-left: 20px;}
.mobile_sub_menu a { display: block; line-height: 40px; font-size: 16px;}
.toggleClass { right: 0%; transition: 0.5s;}

@media screen and (max-width: 1680px) {
      .nav-right-r { flex: 0 1 28%;}
}
@media screen and (max-width: 1600px) {
      .nav-iphone { padding-left: 35px;}
}
@media screen and (max-width: 1440px) {
      .nav-left { margin-right: 30px;}
      .nav-right-l { flex: 0 1 72%;}
      .nav-right-r { flex: 0 1 26%;}
      .nav-iphone { font-size: 18px;}
}
@media screen and (max-width: 1366px) {
      .nav-right { flex: 0 1 72%;}
      .nav-right-r { display: none;}
      .nav-right-l { flex: 1;}
}
@media screen and (max-width: 1024px) {
      .nav-right { display: none;}
      .mobile_menu { display: block; flex: 0 1 10%; display: flex; justify-content: center; align-items: center; flex-direction: column; color: #2067ed; font-size: 18px;}
      .mobile_sub_menu { display: block;}
}
@media screen and (max-width: 768px) {
      .mobile_menu { padding-right: 20px;}
}
@media screen and (max-width : 700px) {
      .nav-container { height: 60px;}
      .nav-left img { width: 80%;}
      .mobile_sub_menu { width: 60%; padding: 30px 15px;}
}




/* index-------------------------------------------------- */
.index-a { width: 100%; position: relative; overflow: hidden;}
.index-a-container { position: relative; animation: fadeInUp;}
.index-a-button.swiper-pagination { position: absolute; left: 43.75% !important; bottom: 5.128% !important; width: auto !important; color: #fff;}
.swiper-pagination-bullet { width: 70px !important; height: 2px !important; background: #fff !important;}
@media screen and (max-width: 1024px) {
      .index-a-button.swiper-pagination { left: 36.75% !important;}
}
@media screen and (max-width: 700px) {
      .swiper-slide img { display: none;}
      .banner-one.swiper-slide  { height: 100vh; background: url(../images/iphone-banner1.jpg) no-repeat; background-position-x:50%}
      .banner-two.swiper-slide  { height: 100vh; background: url(../images/iphone-banner2.jpg) no-repeat; background-position-x:50%}
      .banner-three.swiper-slide  { height: 100vh; background: url(../images/iphone-banner3.jpg) no-repeat; background-position-x:50%}
      .index-a-button.swiper-pagination { left: 18.75% !important; bottom: 11.128% !important;}
}

.index-b { padding: 72px 0 50px; width: 100%; overflow: hidden;}
.b-container { width: 95%; max-width: 1640px; margin: auto;}
.b-top { text-align: center; margin-bottom: 50px; position: relative; animation: fadeInDown;}
.b-top h2 { font-family: SourceHanSanCN; font-size: 46px;}
.b-top p { font-family: Montserrat; color: #868686;}
.b-top::after { content: ''; position: absolute; bottom: -20%; left: 47.5%; background: #4073d1; width: 70px; height: 2px;}
.b-bottom { animation: zoomIn;}
.b-bottom ul { display: flex; justify-content: space-between; }
.b-bottom li { flex: 0 1 32.5%; position: relative;}
.b-bottom li:hover img { transform: scale(1.05);}
.index-product { overflow: hidden;}
.index-product img { transition: 0.5s;}
.index-product-font { position: absolute; bottom: 9.2%; left: 10%;}
.index-product-font p { color: #f2f2f2; font-size: 30px; font-family: SourceHanSanCN;}
.index-product-font span { color: #f2f2f2; font-size: 24px; width: 30px; height: 30px; line-height: 28px; text-align: center; display: inline-block; margin:0 0 0 25px; border: 2px solid #fff; border-radius: 50%; box-sizing: border-box;}
.index-product-font div { color: #ffffff; font-size: 12px; opacity: 0.5;}
@media screen and (max-width: 1280px) {
      .index-product-font p { font-size: 24px;}
      .index-product-font span { font-size: 22px; width: 26px; height: 26px; line-height: 24px; margin: 0 0 0 20px;}
}
@media screen and (max-width: 1024px) {
      .b-top h2 { font-size: 36px;}
      .b-top::after { left: 46.5%;}
      .index-product-font span { font-size: 20px;}
      .index-product-font p { font-size: 20px;}
}
@media screen and (max-width: 768px) {
      .b-top h2 { font-size: 28px;}
      .b-top::after { left: 45.5%;}
      .index-product-font span { display: none;}
}
@media screen and (max-width: 768px) {
      .b-bottom ul li:nth-of-type(2) { display: none;}
      .b-bottom li { flex: 0 1 49.5%;}
}
@media screen and (max-width: 700px) {
      .index-b { padding: 50px 0;}
      .b-top h2 { font-size: 24px;}
      .b-top::after { left: 40%;}
      .b-top { margin-bottom: 30px;}
}






.index-c { width: 100%; background: linear-gradient(to bottom, #fff, #f8f8f8); padding: 50px 0; overflow: hidden;}
.c-container { width: 95%; margin: auto; max-width: 1640px; background: url(../images/wrold.png) bottom right no-repeat; position: relative;}
.c-top { text-align: center; margin-bottom: 50px; position: relative; animation: fadeInDown;}
.c-top h2 { font-family: SourceHanSanCN; font-size: 46px;}
.c-top p { font-family: Montserrat; color: #868686;}
.c-top::after { content: ''; position: absolute; bottom: -20%; left: 47.5%; background: #4073d1; width: 70px; height: 2px; }
.c-bottom-top { display: flex; justify-content: space-between; animation: fadeInUp 1s;}
.index-about { flex: 0 1 31.7%; padding: 80px 0 0 35px; box-shadow: -1px 11px 29px 0px rgb(0 0 0 / 12%); animation: fadeInLeft 1s;}
.index-about h4 { font-size: 26px; color: #3d3d3d; font-family: SourceHanSanCN; margin-bottom: 30px;} 
.index-about p { color: #6b6b6b; line-height: 30px; margin: 50px 0;}
.index-about span { display: inline-block; color: #6d93c3; line-height: 30px; position: relative;}
.index-about span::after { content: ''; background: #6d93c3; width: 20px; height: 1px; right: -1%; bottom: 42%; transform: rotate(-45deg); transform-origin : 100% 0 0; position: absolute;}
.c-bottom-mid { animation: fadeInLeft;}
.c-bottom-b { margin-top: 100px; animation: fadeInDown;}
.c-bottom-b ul { display: flex; justify-content: center;}
.c-bottom-b li { flex: 0 1 22%;}
.c-bottom-b span { font-size: 80px; margin-right: 35px; line-height: 60px; background: linear-gradient(to bottom, #3a8295,#3c5f98); -webkit-background-clip: text; color: transparent;}
.c-bottom-b em { font-size: 24px; color: #565656; font-style: normal; vertical-align: top;}
.c-bottom-b i { font-size: 18px; color: #565656; font-style: normal; margin-left: -24px;}
.c-bottom-b li:nth-of-type(3) i { margin-left: -48px;}
/* .wave { position: absolute; width: 24px; height: 24px; border-radius: 50%; background: #4ebbfd; right: 39.8%; bottom: 28%;}
.wave::before { animation: wave 4s ease infinite; content: ''; width: 24px; height: 24px; border: 1px #4ebbfd solid; background: transparent; border-radius: 50%; box-sizing: border-box; position: absolute; left: 0; top: 0;}
.wave::after { animation: wave 4s ease 2s infinite; content: ''; width: 24px; height: 24px; border: 1px #4ebbfd solid; background: transparent; border-radius: 50%; box-sizing: border-box; position: absolute; left: 0; top: 0;}
@keyframes wave {
      0% { transform: scale(1); opacity: 1;}    
      100% { transform: scale(4); opacity: 0;}
} */
@media screen and (max-width: 1680px) {
      .c-bottom-b li { flex: 0 1 25%;}
}
@media screen and (max-width: 1600px) {
      .index-about { flex: 0 1 38.7%;}
}
@media screen and (max-width: 1440px) {
      .index-about { flex: 0 1 50.7%; padding: 20px 0 0 35px;}
      .index-video { display: flex;}
}
@media screen and (max-width: 1366px) {
      .index-about p { margin: 35px 0;}
      .c-bottom-mid { width: 39.3%;}
      .c-bottom-b span { margin-right: 15px;}
      /* .c-bottom-b ul { justify-content: space-between;} */
}
@media screen and (max-width: 1280px) {
      .index-about { flex: 0 1 55.7%;}
      .c-bottom-mid { width: 40.1%;}
      .index-about h4 { margin-bottom: 15px;}
      .c-bottom-b span { font-size: 60px;}
}
@media screen and (max-width: 1024px) {
      .index-about { flex: 0 1 103%; padding: 20px 0 20px 20px; background: #fff;}
      .c-bottom-mid { width: 49.1%;}
      .c-top h2 { font-size: 36px;}
      .c-top::after { left: 46.5%;}
      .c-bottom-b span { font-size: 50px;}
}
@media screen and (max-width: 768px) {
      .index-about h4 { display: inline-block; margin-bottom: 0;}
      .c-bottom-mid { display: none;}
      .c-bottom-top { display: block;}
      .c-top h2 { font-size: 28px;}
      .c-top::after { left: 45.5%;}
      .c-top { margin-bottom: 20px;}
      .index-about p { margin: 20px 0 0 0;}
      .index-about span { display: block; text-align: right; padding-right: 20px;}
      .index-about span::after { right: 3%;}
      .c-bottom-b { margin-top: 60px;}
      .c-bottom-b ul { flex-wrap: wrap;}
      .c-bottom-b li { flex: 0 1 45%; box-sizing: border-box;}
      .c-bottom-b li:nth-of-type(-n+2) { margin-bottom: 30px;}
      .c-bottom-b li:nth-of-type(even) { padding-left: 50px;}
      .c-bottom-b span { font-size: 60px;}
}
@media screen and (max-width: 700px) {
      .index-c { padding: 40px 0 50px;}
      .c-top h2 { font-size: 24px;}
      .c-top::after { left: 40%;}
      .index-about h4 { margin-bottom: 10px; font-size: 20px;}
      .index-about h4:nth-of-type(2) { display: none;}
      .index-about p br:nth-of-type(1) { display: none;}
      .index-about span { letter-spacing: -5px;}
      .index-about span::after { right: 4%;}
      .index-about p { margin: 0;}
      .c-bottom-b li { flex: 0 1 48%;}
      .c-bottom-b li:nth-of-type(even) { padding-left: 0;}
      .c-bottom-b span { font-size: 28px; margin-right: 17px;}
      .c-bottom-b li:nth-of-type(3) img { width: 24%;}
      .c-bottom-b i { margin-left: -18px; font-size: 16px;}
      .c-bottom-b li:nth-of-type(3) i { margin-left: -32px;}
      .c-bottom-b li:nth-of-type(3) em { margin-left: -12px;}
      .c-bottom-b em { font-size: 16px;}
}





.index-d { width: 100%; padding: 130px 0 150px 0; overflow: hidden;}
.d-container { width: 95%; max-width: 1640px; margin: auto;}
.d-top { display: flex; justify-content: space-between; margin-bottom: 60PX;}
.d-top-l { animation: flipInX;}
.d-top-l h3 { font-size: 40px; color: #212a63; font-family: SourceHanSanCN; font-weight: bold;}
.d-top-l p { font-size: 24px; color: #949494; font-family: Montserrat-Light;}
.d-top-r { animation: flipInY;}
.d-top-r a { font-size: 20px; color: #4f4f4f;  font-family: SourceHanSanCN;}
.d-top-r span { display: inline-block; width: 30px; height: 30px; line-height: 30px; font-size: 18px; background: #3061ae; margin-left: 15px; border-radius: 50%; text-align: center; color: #fff;}
.d-bottom { display: flex; justify-content: space-between; animation: zoomIn;}
.d-botom-l { flex: 0 1 71.64%;}
.d-botom-l ul { display: flex; justify-content: space-between;}
.d-botom-l li { background: url(../images/idnex-news-static.jpg) no-repeat; padding: 50px 25px 0 35px; box-sizing: border-box; flex: 0 1 45%; transition: 0.5s; background-size: cover;}
.index-news-date { color: #6e6e6e; font-size: 24px; font-family: Montserrat; margin-bottom: 10px; transition: 0.5s;}
.index-news-title { color: #3e3e3e; font-size: 22px; font-family: SourceHanSanCN; line-height: 40px; height: 80px; overflow: hidden; transition: 0.5s;}
.index-news-content { color: #6e6e6e; font-size: 18px; font-family: SourceHanSanCN-Light; margin: 50px 0 162px 0; line-height: 30px; height: 90px; overflow: hidden; transition: 0.5s;}
.d-botom-l li:nth-of-type(1) { flex: 0 1 36.6%;}
.d-botom-l li:nth-of-type(1):hover { flex: 0 1 59.57%; background: url(../images/index-news-hover.jpg) no-repeat; background-size: cover;}
.d-botom-l li:nth-of-type(1):hover + li:nth-of-type(2) { flex: 0 1 36.6%; background: url(../images/idnex-news-static.jpg) no-repeat; background-size: cover;}
.d-botom-l li:nth-of-type(1):hover + li:nth-of-type(2) .more a { opacity: 0;}
.d-botom-l li:nth-of-type(1):hover + li:nth-of-type(2) .index-news-date { color: #6e6e6e;}
.d-botom-l li:nth-of-type(1):hover + li:nth-of-type(2) .index-news-title { color: #3e3e3e;}
.d-botom-l li:nth-of-type(1):hover + li:nth-of-type(2) .index-news-content { color: #6e6e6e;}
.d-botom-l li:nth-of-type(1):hover .more a { opacity: 1;}
.d-botom-l li:nth-of-type(1):hover div { color: #fff !important;}
.d-botom-l li:nth-of-type(2) { flex: 0 1 59.57%; background: url(../images/index-news-hover.jpg) no-repeat; background-size: cover;}
.d-botom-l li:nth-of-type(2) .index-news-date { color: #fff;}
.d-botom-l li:nth-of-type(2) .index-news-title { color: #fff;}
.d-botom-l li:nth-of-type(2) .index-news-content { color: #fff;}
.more a { display: block; width: 150px; line-height: 50px; text-align: center; color: #494848; background: #e6f0ff; margin-bottom: 50px; transition: 0.5s}
.d-botom-l li:nth-of-type(1) .more a{ opacity: 0;}
.d-botom-r { flex: 0 1 25.61%;}
.d-botom-r li { padding: 72px 35px 70px 45px; box-sizing: border-box; background: url(../images/idnex-news-static-2.jpg);  transition: 0.5s;}
.d-botom-r li:nth-of-type(1) { margin-bottom: 50px;}
.d-botom-r li:hover { background: url(../images/index-news-hover-2.jpg); transition: 0.5s; background-size: cover;}
.d-botom-r li:hover div { color: #fff !important;}
@media screen and (max-width : 1024px) {
      .d-botom-l li { padding: 20px 20px 0 20px;}s
      .index-news-content { margin: 50px 0 60px 0;}
      .index-news-title { font-size: 22px;}
      .index-news-date { margin-bottom: 5px;}
      .more a { margin-bottom: 30px;}
      .d-botom-r li { padding: 30px 20px 38px;}
      .d-top-l h3 { font-size: 36px;}
      .d-top-r { display: flex; align-items: center;}
}
@media screen and (max-width : 768px) {
      .index-d { padding: 50px 0;}
      .d-botom-l li { padding: 20px 20px 0 20px;}
      .index-news-content { margin: 30px 0 30px 0;}
      .index-news-title { font-size: 22px;}
      .index-news-date { margin-bottom: 5px;}
      .more a { margin-bottom: 30px;}
      .d-botom-r li { padding: 21px 20px 22px;}
      .d-top-l h3 { font-size: 28px;}
      .d-top-r span { width: 26px; height: 26px; line-height: 28px;}
}
@media screen and (max-width: 700px) {
      .d-top-l h3 { font-size: 22px;}
      .d-top-l p { font-size: 18px;}
      .index-d { padding: 50px 0;}
      .d-bottom { display: block;}
      .d-botom-r { display: none;}
      .d-botom-l ul { flex-direction: column-reverse;}
      .d-top { margin-bottom: 30px;}
      .more a { margin-bottom: 0; width: 120px; line-height: 40px;}
      .d-botom-l li { padding: 20px 20px 20px 20px;}
      .index-news-content { margin: 20px 0 10px;}
      .index-news-title { line-height: 30px; height: 60px;}
      .d-botom-l li:nth-of-type(1) { margin-top: 20px;}
      .index-news-date { margin-bottom: 15px;}
      .index-news-title { font-size: 18px;}
      .index-news-content { font-size: 16px;}
      .d-top-r { display: flex; align-items: center;}
}




.footer { width: 100%; background: #edf5fb; position: relative; border-top: 6px #3061ae solid;}
.footer::before { content: ''; width: 7.3%; height: 6px; background: #f08519; position: absolute; top: -6px; left: 0;}
.footer-container { width: 95%; max-width: 1640px; margin: auto; display: flex; justify-content: space-between; padding: 105px 0;}
.friend-link { display: flex; justify-content: space-between; border-bottom: 1px solid #e3e6e8; padding-bottom: 32px;}
.friend-link select {  cursor: pointer; width: 140px; height: 40px;border: 1px #e7e7e7 solid; appearance: none; background: url(../images/arrow.png)  no-repeat; background-position: center right 16%; padding: 0 25px;}
.select { background: #fff;}
.footer-contact { margin-top: 28px; display: flex; justify-content: space-between;}
.address p { color: #7d7d7d; line-height: 30px;}
.address a { color: #212a63; font-size: 40px; display: block; line-height: 60px;}
.footer-scan { background: #fff; padding: 10px; margin-left: 10px;}
.footer-scan span { display: block; font-size: 14px; color: #858585; text-align: center; margin-top: 12px;}
.footer-right { flex: 0 1 50%; display: flex; justify-content: space-between;}
.footer-right h5 { font-weight: bold; margin-bottom: 15px;}
.footer-right a { font-size: 14px; color: #6e6e6e; line-height: 30px}
.footer-right a:hover { text-decoration: underline;}
.footer-bottom { border-top: 1px #e4e8ea solid;}
.footer-bottom-container { line-height: 98px; width: 95%; max-width: 1500px; margin: auto; display: flex; justify-content: space-between; color: #6e6e6e;}
.footer-bottom-container a { color: #6e6e6e;}
.footer-bottom-container a:hover { color: #000; text-decoration: underline;}
@media screen and (max-width: 1366px) {
      .footer-bottom-container span { display: none;}
      .footer-left { margin-right: 20px;}
}
@media screen and (max-width: 1024px) {
      .footer-bottom-container span { display: none;}
      .footer-left { margin-right: 20px;} 
      .footer-container {display: block;}
      .footer-right { display: none;}
}
@media screen and (max-width: 1023px) {
      .footer-container {display: block;}
      .footer-right { display: none;}
}
@media screen and (max-width: 700px) {
      .footer-container { padding: 30px 0;}
      .footer-left {    margin-right: 0;}
      .friend-link div:nth-of-type(1) { display: flex; align-items: center;}
      .select { margin-left: 15px;}
      .footer-contact { display: block;}
      .address a { font-size: 30px; line-height: 40px;}
      .footer-scan { margin-left: 0px; width: 33%; margin-top: 15px;}
      .footer-bottom-container { line-height: 28px; display: block; padding: 5px 0;}
      .footer-bottom-container div { display: inline-block; margin: -28px 0 0 26%;}
      .footer-bottom-container p { display: inline-block;}
      .footer-bottom { margin-bottom: 55px;}
}




/* about------------------------------------ */
.about { width: 100%; padding: 100px 0;}
.about_banner { width: 100%; height: 400px; background: url(../images/about.jpg) center no-repeat; background-size: cover;}
.about-container { width: 95%; max-width: 1640px; margin: auto;}
.about-list a { display: block;}
.about-list li.current { border-bottom: 2px #496fb4 solid; filter: grayscale(0) !important;}
@media screen and (max-width: 1024px) {
      .about { padding: 80px 0;}
      .about-list li:nth-of-type(1) { background: url(../images/product-list-1.jpg) no-repeat 15% 50% !important;}
      .about-list li:nth-of-type(2) { background: url(../images/product-list-2.jpg) no-repeat 17% 50% !important;}
      .about-list li:nth-of-type(3) { background: url(../images/product-list-3.jpg) no-repeat 15% 50% !important;}
      .about-list li:nth-of-type(4) { background: url(../images/about-list-4.jpg) no-repeat 19% 50% !important;}
}
@media screen and (max-width: 768px) {
      .about { padding: 50px 0;}
      .about-list li:nth-of-type(1) { background: url(../images/product-list-1.jpg) no-repeat 8% 50% !important;}
      .about-list li:nth-of-type(4) { background: url(../images/about-list-4.jpg) no-repeat 12% 50% !important;}
      .gsjj h2 { font-size: 1.5rem !important;}
      .gstp h2 { font-size: 1.5rem !important;}
}
@media screen and (max-width: 700px) {
      .about-list li:nth-of-type(1) { background: none !important;}
      .about-list li:nth-of-type(2) { background: none !important; padding-left: 0 !important;}
      .about-list li:nth-of-type(3) { background: none !important; padding-left: 0 !important;}
      .about-list li:nth-of-type(4) { background: none !important;}
      .about_banner { height: 200px;}     
      .about { padding: 40px 0 50px;}
      .jj_a, .jj_b p { text-indent: 32px;}
      .gsjj i { margin: .5em auto 1em !important;}
}



/* product------------------------------------------ */
.product_banner1 { width: 100%; height: 400px; background: url(../images/product-banner-1.jpg) center no-repeat; background-size: cover;}
.product_banner2 { width: 100%; height: 400px; background: url(../images/product-banner-2.jpg) center no-repeat; background-size: cover;}
.product_banner3 { width: 100%; height: 400px; background: url(../images/product-banner-3.jpg) center no-repeat; background-size: cover;}
.list { width: 100%; line-height: 130px; font-size: 18px; color: #747474; text-align: center;}
.list-container { margin: auto; border-left: 1px #c5c5c5 dotted; box-sizing: border-box; width: 95%; margin: auto; max-width: 1640px;}
.list-container ul { display: flex;}
.list-container li { flex: 0 1 33.33%; border-right: 1px #c5c5c5 dotted; box-sizing: border-box;}
.list-container li:nth-of-type(1) { background: url(../images/product-list-1.jpg) no-repeat 30% 50%; filter: grayscale(100%);}
.list-container li:nth-of-type(2) { background: url(../images/product-list-2.jpg) no-repeat 25% 50%; filter: grayscale(100%);}
.list-container li:nth-of-type(3) { background: url(../images/product-list-3.jpg) no-repeat 20% 50%; filter: grayscale(100%);}
.list-container li:nth-of-type(4) { background: url(../images/about-list-4.jpg) no-repeat 30% 50%; filter: grayscale(100%);}
.list-container li.cur { border-bottom: 2px #496fb4 solid; filter: grayscale(0);}
.product-container{ width: 95%; max-width: 1640px; margin: 140px auto;}
.product-container li { float: left; width: 32%; margin-right: 2%; margin-bottom: 140px; position: relative; transition: 0.5s;}
.product-container li:nth-of-type(3n) { margin-right: 0;}
.product-name { position: absolute; font-size: 24px; color: #fff; left: 4.528%; bottom: 5.09%; }
.product-container li:hover img { transform: scale(1.05);}
.product-container li::after { content: ''; width: 101%; height: 0; position: absolute; bottom: -0.5%; left: -0.43%; transition: 0.5s; z-index: -1;}
.product-container li:hover::after { background: #496fb4; height: 101%;}
.product-photograph { overflow: hidden;}
.product-photograph img { transition: 0.5s;}
@media screen and (max-width: 1280px) {
      .product-name { font-size: 20px;}
}
@media screen and (max-width: 1024px) {
      .list-container li:nth-of-type(1) { background: url(../images/product-list-1.jpg) no-repeat 27% 50%;}
      .list-container li:nth-of-type(2) { background: url(../images/product-list-2.jpg) no-repeat 21% 50%;}
      .list-container li:nth-of-type(3) { background: url(../images/product-list-3.jpg) no-repeat 12% 50%;}
}
@media screen and (max-width: 1023px) {
      .product-name { font-size: 16px; height: 16px; line-height: 16px; overflow: hidden;}
}
@media screen and (max-width: 768px) {
      .product_banner1 { background-position-x: 18%;}
      .list-container li:nth-of-type(1) { background: url(../images/product-list-1.jpg) no-repeat 23% 50%;}
      .list-container li:nth-of-type(2) { padding-left: 20px; background: url(../images/product-list-2.jpg) no-repeat 17% 50%;}
      .list-container li:nth-of-type(3) { padding-left: 30px;}
      .product-container { margin: 80px auto;}
}
@media screen and (max-width: 700px) {
      .product_banner1 { height: 200px;}
      .product_banner2  { height: 200px;}
      .product_banner3  { height: 200px;}
      .list { font-size: 16px; line-height: 50px; background: #f5f3f3;}
      .list-product li:nth-of-type(1) { flex: 0 1 25%; background: none;}
      .list-product li:nth-of-type(2) { padding-left: 0; flex: 0 1 35%; background: none;}
      .list-product li:nth-of-type(3) { padding-left: 0; flex: 0 1 40%; background: none;}
      .product-container li { width: 49%; margin-bottom: 50px;}
      .product-container li:nth-of-type(odd) { margin-right: 2%;}
      .product-container li:nth-of-type(even) { margin-right: 0;}
      .product-container { margin: 50px auto;}
      .list-container li { border-right: none;}
      .list-container { border-left: none;}
      

}




/* news--------------------------------------------------- */
.news_banner { width: 100%; height: 400px; background: url(../images/news.jpg) center no-repeat; background-size: cover;}
.list-news ul { flex-direction: row;}
.list-news li { flex: 0 1 33.33%;}
.list-news li:nth-of-type(1) { background: url(../images/news-list-1.jpg) no-repeat 33% 50%; filter: grayscale(100%);}
.list-news li:nth-of-type(2) { background: url(../images/news-list-2.jpg) no-repeat 33% 50%; filter: grayscale(100%);}
.list-news li:nth-of-type(3) { background: url(../images/news-list-3.jpg) no-repeat 33% 50%; filter: grayscale(100%);}
.list-container li.cur { border-bottom: 2px #496fb4 solid; filter: grayscale(0);}
.list-container a { display: block;}
.news { background: rgb(243, 242, 242); padding: 118px 0; z-index: -100;}
.news-container { width: 95%; max-width: 1640px; margin: auto;}
.news-container li { float: left; width: 48.78%; margin: 0 2.4% 42px 0; padding: 5px; position: relative; box-sizing: border-box; border: 1px #d3d3d3 solid; background: #f8f8f8; z-index: 10;}
.news-container li:nth-of-type(2n) { margin-right: 0;}
.news-container li a { display: flex; justify-content: space-between;}
.news-photograph { flex:  0 1 47.5%;}
.news-right { flex: 0 1 47.5%;  box-sizing: border-box; padding: 42px 35px 0 0 ;}
.news-name { font-size: 20px; color: #3e3e3e; height: 40px; line-height: 20px; overflow: hidden;}
.news-content { color: #878787; line-height: 30px; color: #878787; margin: 23px 0; overflow: hidden; height: 60px;}
.news-bottom { display: flex; justify-content: space-between;}
.news-more { width: 126px; ;line-height: 34px; height: 34px; text-align: center; color: #000; font-size: 14px; background: #e7f2ff; transition: 0.5s;}
.news-date { color: #a5a5a5;}
.news-container li::after { content: ''; position: absolute; width: 101%; height: 103%; left: -0.5%; bottom: -1.5%; background: #f8f8f8; border: 2px transparent solid; transition: 0.5s; z-index: -1;}
.news-container li:hover::after { border: 2px #2b75c9 solid; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 30%);}
.news-container li:hover img { transform: scale(1.05);}
.news-photograph { overflow: hidden;}
.news-photograph img { transition: 0.5s;}
.news-container li:hover .news-more { background: #3c67b4; color: #fff;}
@media screen and (max-width: 1366px) {
      .news-right { padding: 15px 15px 0 0;}
}
@media screen and (max-width: 1280px) {
      .news-content { margin: 15px 0; line-height: 25px; height: 50px;}
}
@media screen and (max-width: 1024px) {
      .news { padding: 100px 0;}
      .news-container li a { display: block;}
      .news-container li { padding: 5px 18px;}
}
@media screen and (max-width: 768px) {
      .news { padding: 80px 0;}
}
@media screen and (max-width: 700px) {
      .news_banner { height: 200px;}
      .news { padding: 10px 0 50px;}
      .news-container li { width: 100%; margin-right: 0;}
      .news-right { padding: 15px 0 0 0 ;}
      .list-news li { background: none !important; padding-left: 0 !important;}
}






/* contact---------------------------------------------- */
.contact_banner { width: 100%; height: 400px; background: url(../images/contact.jpg) center no-repeat; background-size: cover;}
.contact { width: 100%; padding: 100px 0;}
.contact-container { width: 95%; max-width: 1640px; margin: auto;}
.map { margin-top: 50px;}
@media screen and (max-width: 1024px) {
      .contact { padding: 40px 0 50px;}
      .lx_r { display: none;}
}
@media screen and (max-width: 768px) {
      .lx_r { display: block;}
      .contact { padding: 40px 0 50px;}
      .lx_r img { width: 100% !important;}
}
@media screen and (max-width: 700px) {
      .ry { padding: 1rem 0 !important;}
      .contact_banner { height: 200px;}
      #dituContent { height: 250px !important;}
}



/* honor--------------------------------------- */
.honor { width: 100%; padding: 100px 0; background: #eee;}
.honor-container { width: 95%; max-width: 1640px; margin: auto;}
.honor-container li { float: left; text-align: center;margin: 0 2% 30px 0; width: 32%;}
.honor-container li:nth-of-type(3n) { margin-right: 0;}
.honor_name { margin-top: 15px; transition: 0.5s; font-size: 20px; height: 26px; line-height: 26px; overflow: hidden;}
.honor-container li:hover img { transform: scale(1.05);}
.honor-container li:hover .honor_name { color: #ff8000;}
.honor-container li img { transition: 0.5s; width: 100%;}
.honor_img { overflow: hidden; }

/* .honor-content li:nth-of-type(3n) { margin-right: 0;} */
.honor-content li p { margin-top: 10px; font-size: 20px;}
.honor-content li:hover img { transform: scale(1.05); transition: 0.5s; }
.honor-content li div { overflow: hidden;}
.honor-content li img { transition: 0.5s;}
@media screen and (max-width : 1024px) {
      .qywh h2 { font-size: 1.75rem !important;}
}
@media screen and (max-width : 768px) {
      .qywh h2 { font-size: 1.5rem !important;}
      .honor_name { font-size: 18px;}
}
@media screen and (max-width : 700px) {
      .qywh i { margin: 1em auto 1em !important;}
      .honor { padding: 40px 0 50px;}
      .honor-container li { width: 49%;}
      .honor-container li:nth-of-type(odd) { margin-right: 2%;}
      .honor-container li:nth-of-type(even) { margin-right: 0;}
      .honor_name { font-size: 16px;}
}




.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after { font-size: 18px !important;}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after { font-size: 18px !important;}
.swiper-button-next, .swiper-rtl .swiper-button-prev { width: 30px !important; height: 30px !important; background: #ddd !important;}
.swiper-button-prev, .swiper-rtl .swiper-button-next { width: 30px !important; height: 30px !important; background: #ddd !important;}





/*sitemap*/
:root {
      --style_color: #212a63
}
.gm {
      width: 95%;
      max-width: 1500px;
      margin: 0 auto;
  }
  .sitemap_nr>dl{ border-bottom: 1px solid #ddd; padding-bottom: 20px; margin-top: 30px;}
  .sitemap_nr>dl>a{ font-size: 1.5rem; font-weight: bold; color: var(--style_color); display: block;}
  .sitemap_nr>dl>dt{ padding: 15px 0 8px 0;}
  .sitemap_nr>dl>dt>a{ font-size: 1.125rem; border-left: 2px solid var(--style_color); padding-left: 10px; display: block; line-height: 20px; height: 20px; font-weight: bold; color: var(--style_color);}
  .sitemap_nr>dl>dd{ display: flex; flex-wrap: wrap;}
  .sitemap_nr>dl>dd>a{ display: block; margin-right: 15px; line-height: 24px;}
  @media screen and (max-width:700px){
      .sitemap_nr>dl>a{ font-size: 1.125rem;}
      .sitemap_nr>dl>dt>a{ font-size: 1rem;}
      .sitemap_nr>dl>dd>a{ font-size: 0.875rem;}
  }