.padding{ padding-top:100px; padding-bottom:100px; }
.indexpd{ padding-top: 150px; padding-bottom: 150px;}
.padding-bottom-80{ padding-bottom:100px;}
.padding-top-0{ padding-top:0; }
.swiper{--swiper-theme-color:  var(--blue);/* 设置Swiper风格 */--swiper-navigation-color: #172259;/* 单独设置按钮颜色 */--swiper-navigation-size: 24px;/* 设置按钮大小 */}

html{height: 100%;}
.index_banner {position: relative;width: 100%; }
.index_banner .swiper{ height:100vh; }
.index_banner .swiper-slide{ position: relative;width: 100%;overflow:hidden; }
.index_banner .swiper-slide img{width: 100%; height: 100%; object-fit: cover;}
.index_banner .swiper-slide .info{ position:absolute; width: calc(var(--width) / 2 + 200px);left: 50%; top:50%; transition-duration: 0.3s; z-index: 33; transform: translate(-50%, -50%); letter-spacing:1px; transition-delay:0.5s; }
.index_banner .swiper-slide .info > *{opacity: 0; transform: translateY(50px); transition: all 1s; }
.index_banner .swiper-slide-active .info > * {  opacity: 1; transform: none;}
.index_banner .swiper-slide-active .info > *:nth-child(1) { transition-delay: 0.4s;}
.index_banner .swiper-slide-active .info > *:nth-child(2) { transition-delay: 0.6s;}
.index_banner .swiper-slide-active .info > *:nth-child(3) { transition-delay: 0.8s;}
.index_banner .swiper-slide-active .info > *:nth-child(4) { transition-delay: 2s;}

.index_banner .swiper-slide .info h1{color: #fff; font-size:60px; text-align: center; font-weight: normal; line-height:1.2em; margin-bottom:50px; }
.index_banner .swiper-slide .info h3{color: #fff; line-height:1.4em;  font-weight: normal;margin-bottom:60px;  font-size:22px;}
.index_banner .swiper-slide .info .button{display: flex; justify-content: center; align-items: center;}
.index_banner .swiper-slide .info .button{}
.index_banner .swiper-slide .info .button a{display: flex; justify-content: left; align-items: center; grid-gap: 10px;}
.index_banner .swiper-slide .info .button a span{ color: #fff;}
.index_banner .swiper-slide .info .button a i{  color: #fff; width: 36px; border-radius: 30px; background: var(--main); height: 36px; line-height: 36px; display: flex; justify-content: center; align-items: center;}

.index_banner .swiper-pagination{ bottom:20px!important; }
.index_banner .swiper-pagination .swiper-pagination-bullet {border-radius: 0; height:2px; width:60px; transition-duration: 0.2s; background:rgba(255, 255, 255, 0.7); opacity:1; }
.index_banner .swiper-pagination .swiper-pagination-bullet-active{background: var(--main);}


.mouse{ position:absolute; left:50%; transform: translateX(-50%); bottom:50px; z-index:2; border-radius:30px; height:24px; width:14px; border:#fff solid 2px; }
.mouse span{ width:2px; height:6px; border-radius:3px; display:block; position:absolute; left:6px; top:8px; background:#fff;animation: mouse 2s ease-in-out infinite; }
@keyframes mouse{
    0%   { transform: translateX(0) translateY(0); }
    50%  { transform: translateX(0) translateY(-5px); }
    100% { transform: translateX(0) translateY(0); }
}


.index_about{background: url(../images/bg.jpg) no-repeat center center; background-size: cover; position: relative; overflow: hidden}
.index_about .pagewidth{ position: relative;}
.index_about .pagewidth .title{ margin-bottom:120px;}
.index_about .pagewidth .title h2{font-size: 18px; color: var(--main); font-weight:normal; margin-bottom: 20px;}
.index_about .pagewidth .title h3{font-size: 36px; color: #111; line-height: 1.4em; font-weight:normal; margin-bottom: 20px; width: 60%;}
.index_about .pagewidth .title .button a{display: flex; justify-content: left; align-items: center; grid-gap: 10px;}
.index_about .pagewidth .title .button a span{  color: #111;}
.index_about .pagewidth .title .button a i{  color: #fff; width: 36px; border-radius: 30px; background: var(--main); height: 36px; line-height: 36px; display: flex; justify-content: center; align-items: center;}
.index_about .pagewidth .number{ }
.index_about .lou{ width:1000px; position: absolute; right: -60px; bottom: 0px; z-index: 3;}
.index_about .lou img{ width: 100%;}
.index_about .number{ width: 60%; display: grid; grid-template-columns: repeat(3,1fr); grid-gap: 30px; }
.index_about .number .item h3{ color:var(--main);font-weight: 500; font-size: 60px;}
.index_about .number .item h3 strong{font-weight: 500;}
.index_about .number .item p{ color:#666; }

.index_app{ position: relative; background: #000; overflow: hidden}
.index_app .bg{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; width: 100%;transform: scale(1.2);  height: 100%;  object-fit: cover; opacity: 0.7; }
.index_app .pagewidth{ position: relative; z-index: 1;}
.index_app .pagewidth .title{text-align: center; margin-bottom: 60px;}
.index_app .pagewidth .title h2{font-size: 18px; color: #fff; font-weight:normal; margin-bottom: 20px;}
.index_app .pagewidth .title h3{font-size: 36px; color: #fff; line-height: 1.4em; font-weight:normal;}
.index_app .pagewidth .content{ display: grid; grid-template-columns: repeat(4,1fr); grid-gap: 30px; }
.index_app .pagewidth .content .item{text-align: center; color: #fff; overflow: hidden; padding: 40px; aspect-ratio: 6/8; background:rgba(0,0,0,0.0); border-radius: 6px;  transition-duration: 0.3s; border:rgba(255,255,255,0.0) solid 1px;-webkit-backdrop-filter:blur(0px); backdrop-filter: blur(0px);}
.index_app .pagewidth .content .item .box{transition-duration: 0.3s; position: absolute; top: 140px; left: 30px; right: 30px;}
.index_app .pagewidth .content .item .box .icon{margin-bottom: 20px;}
.index_app .pagewidth .content .item .box .icon img{ width: 60px;}
.index_app .pagewidth .content .item .box .name{ font-size: 28px; line-height: 1.4em; color: #fff; font-weight:normal; margin-bottom: 20px;}
.index_app .pagewidth .content .item .box .desc{ transition-duration: 0.3s;  line-height: 1.6em; color: #fff; font-weight:normal; margin-bottom: 50px; opacity: 0; visibility: hidden;}
.index_app .pagewidth .content .item .box .button{ transition-duration: 0.3s; opacity: 0; visibility: hidden; transition-delay: 0.15s;}
.index_app .pagewidth .content .item .box .button a{display: flex; justify-content: center; align-items: center; grid-gap: 10px;}
.index_app .pagewidth .content .item .box .button a span{  color: #fff;}
.index_app .pagewidth .content .item .box .button a i{  color: #fff; width: 36px; border-radius: 30px; background: var(--main); height: 36px; line-height: 36px; display: flex; justify-content: center; align-items: center;}
.index_app .pagewidth .content .item:hover{background:rgba(0,0,0,0.3); border:rgba(255,255,255,0.4) solid 1px;-webkit-backdrop-filter:blur(5px); backdrop-filter: blur(5px);}
.index_app .pagewidth .content .item:hover .box{top: 70px;}
.index_app .pagewidth .content .item:hover .box .desc{  line-height: 1.6em; color: #fff; font-weight:normal; margin-bottom: 20px; opacity:1 ; visibility:visible;}
.index_app .pagewidth .content .item:hover .box .button{ opacity:1 ; visibility:visible;}
.index_app .pagewidth .content .item:hover .box .button a{display: flex; justify-content: center; align-items: center; grid-gap: 10px;}
.index_app .pagewidth .content .item:hover .box .button a span{  color: #fff;}
.index_app .pagewidth .content .item:hover .box .button a i{  color: #fff; width: 36px; border-radius: 30px; background: var(--main); height: 36px; line-height: 36px; display: flex; justify-content: center; align-items: center;}


.index_product{ position: relative; background: #000; overflow: hidden}
.index_product .bg{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; width: 100%;transform: scale(1.2); height: 100%; object-fit: cover; opacity: 0.7; }
.index_product .pagewidth{ position: relative; z-index: 1;}
.index_product .pagewidth .title{text-align: center; margin-bottom: 60px;}
.index_product .pagewidth .title h2{font-size: 18px; color: #fff; font-weight:normal; margin-bottom: 20px;}
.index_product .pagewidth .title h3{font-size: 60px; color: #fff; line-height:1em; font-weight:normal; margin-bottom: 30px;}
.index_product .pagewidth .title p{font-size: 24px; color: #fff; line-height: 1.4em; font-weight:normal;}
.index_product .pagewidth .icon_list{ display: flex; justify-content: center; grid-gap: 30px; padding-top:50px;margin-bottom: 60px;}
.index_product .pagewidth .icon_list .item{ width: 90px;}
.index_product .pagewidth .icon_list .item .icon{ margin: 0 auto; width: 72px;height: 85px; position: relative; margin-bottom: 14px;transition: transform 0.6s; transition-delay: 0.1s; transform-style: preserve-3d;}
.index_product .pagewidth .icon_list .item .icon:hover{ transform: rotateY(180deg);}
.index_product .pagewidth .icon_list .item .icon img{ width: 100%;  transition-duration: 0.3s; transition-delay: 0.1s;}
.index_product .pagewidth .icon_list .item .icon img.icona{ display: block; position: absolute; opacity: 1;}
.index_product .pagewidth .icon_list .item .icon img.iconb{ display: block; position: absolute; opacity: 0;}
.index_product .pagewidth .icon_list .item .name{ color: #fff; text-align: center; line-height: 1.6em;}
.index_product .pagewidth .icon_list .item:hover .icon img.icona{opacity: 0;}
.index_product .pagewidth .icon_list .item:hover .icon img.iconb{opacity: 1;}
.index_product .pagewidth .button{ opacity:1 ; visibility:visible; margin-bottom: 60px;}
.index_product .pagewidth .button a{display: flex; justify-content: center; align-items: center; grid-gap: 10px;}
.index_product .pagewidth .button a span{  color: #fff;}
.index_product .pagewidth .button a i{  color: #fff; width: 36px; border-radius: 30px; background: var(--main); height: 36px; line-height: 36px; display: flex; justify-content: center; align-items: center;}




.index_service{ position: relative; background: url("../images/bg3.png") no-repeat center #1658a0; background-size: contain  }
.index_service .pagewidth{ position: relative; z-index: 1;}
.index_service .pagewidth .title{text-align: center; margin-bottom: 40px;}
.index_service .pagewidth .title h2{font-size: 18px; color: #fff; font-weight:normal; margin-bottom: 20px;}
.index_service .pagewidth .title h3{font-size: 36px; color: #fff; line-height: 1em; font-weight:normal;margin-bottom: 40px;}
.index_service .pagewidth .button a{display: flex; justify-content: center; align-items: center; grid-gap: 10px;}
.index_service .pagewidth .button a span{  color: #fff;}
.index_service .pagewidth .button a i{  color: var(--main); width: 36px; border-radius: 30px; background: #fff; height: 36px; line-height: 36px; display: flex; justify-content: center; align-items: center;}
.index_service .pagewidth .content{ display: grid; grid-template-columns: repeat(3,1fr); grid-gap: 30px; width: 1000px; margin: 0 auto; text-align: center }
.index_service .pagewidth .content .item{background: rgba(255,255,255,0); transition-duration: 0.3s; border-radius: 3px; padding-top: 20px; padding-bottom: 20px;}
.index_service .pagewidth .content .item:hover{background: rgba(255,255,255,0.1); }
.index_service .pagewidth .content .item img{ width: 76px; margin-bottom: 10px;}
.index_service .pagewidth .content .item p{ color:#fff; }


.index_news{}
.index_news .title{ display: flex;justify-content: space-between; align-items: center;}
.index_news .title h2{font-size: 18px; color: var(--main); font-weight:normal; margin-bottom: 20px;}
.index_news .title h3{font-size: 36px; color: #111; line-height: 1em; font-weight:normal;margin-bottom: 40px;}
.index_news .title .layui-tabs-header{ display: flex; justify-content: left; align-items: center; grid-gap: 40px;}
.index_news .title .layui-tabs-header li{  color: #111; font-weight:500; margin-bottom: 10px; cursor: pointer;}
.index_news .title .layui-tabs-header li.layui-this{ position: relative; color:var(--main);}
.index_news .title .layui-tabs-header li.layui-this:after{ content: ""; width: 100%; height: 2px; background: var(--main); position: absolute; left: 0; right: 0; bottom: -10px;}
.index_news  .layui-tabs-item .swiper-slide .img{aspect-ratio: 84/60; margin-bottom: 20px;}
.index_news .layui-tabs-body .swiper-slide .img img{ width: 100%;height: 100%;object-fit: cover;}
.index_news .layui-tabs-body .swiper-slide .info p{ color: #111; font-weight:normal; margin-bottom: 10px;}
.index_news .layui-tabs-body .swiper-slide .info h3{ font-size: 22px; color: #111; line-height: 1.4em; font-weight:normal;}
.index_news .layui-tabs-body .swiper-slide .info h3 a{color: #111;}
.index_news .layui-tabs-body .swiper-slide .info h3 a:hover{color: var(--main);}
.index_news .layui-tabs-body .swiper{ padding-bottom: 70px;}
.index_news .layui-tabs-body .swiper .swiper-button-next{ font-size: 20px; top: auto!important; left: 75px!important; bottom: 0px!important; border-radius: 50px;  height:58px; width: 58px; border:#cccccc solid 1px;}
.index_news .layui-tabs-body .swiper .swiper-button-prev{ font-size: 20px; top: auto!important; left: 0px!important; bottom: 0px!important; border-radius: 50px;  height:58px; width: 58px; border:#cccccc solid 1px;}
.index_news .layui-tabs-body .swiper .swiper-button-next:after,.index_news .layui-tabs-body .swiper .swiper-button-prev:after{ display: none!important;}
.index_news .layui-tabs-body .swiper .swiper-button-more{ position: absolute; left: 150px;bottom: 0px;}
.index_news .layui-tabs-body .swiper .swiper-button-more a{ transition-duration: 0.2s; display:inline-block;border-radius: 50px; line-height: 58px; text-align: center;  height:58px; padding-left:30px; padding-right:30px;border:#cccccc solid 1px;}
.index_news .layui-tabs-body .swiper .swiper-button-more a:hover{ background: var(--main); color: #fff; border: var(--main) solid 1px;}


.detailbanner{overflow: hidden; position: relative; background: #000; }
.detailbanner .pagewidth{position: relative; height: 100vh; }
.detailbanner .text{  text-align: center; position: absolute; left: 0px;right: 0px; top: 50%; transform: translateY(-50%); z-index: 2; }
.detailbanner .text h1{ font-size: 120px; margin-bottom: 20px; color: #fff; text-transform: uppercase;font-weight: 500;  text-align: center;  line-height: 1.1em; z-index: 2;}
.detailbanner .text h2{ font-size: 60px; color: #fff; font-weight:400;  text-align: center;  line-height: 1.1em; z-index: 2;}
.detailbanner .text p{  color: #fff; text-align: center;  line-height: 1.6em; z-index: 2; text-shadow:0 0px 10px #222; }

.detailbanner .text1{  text-align: center; position: absolute; left: 0px;right: 0px; bottom: 15%;z-index: 2; }
.detailbanner .text1 h1{  margin-bottom: 20px; color: #fff; text-transform: uppercase;font-weight: 500;  text-align: center;  line-height: 1.1em; z-index: 2;}
.detailbanner .text1 h1 a{ color: #fff;}
.detailbanner .text1 h2{ font-size: 60px; color: #fff; font-weight:400;  text-align: center;  line-height: 1.1em; z-index: 2;}
.detailbanner .text1 p{  color: #fff; text-align: center;  line-height: 1.6em; z-index: 2; text-shadow:0 0px 10px #222; }

.detailbanner .text2{  text-align: center; position: absolute; left: 0px;right: 0px; bottom: 15%;z-index: 2; }
.detailbanner .text2 h1{  margin-bottom: 20px; color: #fff; text-transform: uppercase;font-weight: 500;  text-align: center;  line-height: 1.1em; z-index: 2;}
.detailbanner .text2 h1 a{ color: #fff;}
.detailbanner .text2 h2{ font-size: 60px; color: #fff; font-weight:400;  text-align: center;  line-height: 1.1em; z-index: 2; margin-bottom: 30px;}
.detailbanner .text2 .desc{ font-size: 24px; color: #fff; font-weight:400;  text-align: center;  line-height: 1.6em; z-index: 2;}
.detailbanner .text2 .icon_list{ display: flex; justify-content: center; grid-gap: 30px; padding-top:50px;}
.detailbanner .text2 .icon_list .item{ width: 90px;}
.detailbanner .text2 .icon_list .item .icon{ width: 72px;height: 85px; margin: 0 auto; position: relative; margin-bottom: 14px;transition: transform 0.6s; transition-delay: 0.1s; transform-style: preserve-3d;}
.detailbanner .text2 .icon_list .item .icon:hover{ transform: rotateY(180deg);}
.detailbanner .text2 .icon_list .item .icon img{ width: 100%;  transition-duration: 0.3s; transition-delay: 0.1s;}
.detailbanner .text2 .icon_list .item .icon img.icona{ display: block; position: absolute; opacity: 1;}
.detailbanner .text2 .icon_list .item .icon img.iconb{ display: block; position: absolute; opacity: 0;}
.detailbanner .text2 .icon_list .item .name{ color: #fff; text-align: center; line-height: 1.6em;}
.detailbanner .text2 .icon_list .item:hover .icon img.icona{opacity: 0;}
.detailbanner .text2 .icon_list .item:hover .icon img.iconb{opacity: 1;}

.detailbanner img.detailbg{  width: 101%; height: 101%; object-fit: cover; opacity: 0.8; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1}

.detailbanner.vh50 .pagewidth{position: relative; height: 55vh; }
.detailbanner.vh50 .text1{ bottom: 25%; }




.detailmenu{ height: 75px;background: #f5f5f7;}
.detailmenu ul{display: flex; justify-content: center; align-items: center}
.detailmenu ul li a{ display:block; line-height: 75px; height: 75px;font-size: 16px; padding-left: 20px; padding-right: 20px; color: #666666; position: relative }

.detailmenu ul li a.active:after{content: ""; position: absolute; width:40%; left: 50%;transform: translateX(-50%); bottom: 0px; height: 3px; background: var(--main)}
.detailmenu ul li a.active{ color: var(--main); font-weight: 500;}



.content_company{border-bottom: #ddd solid 1px;}
.content_company .content h3{ font-size: 18px; font-weight: 500; text-align: center; margin-bottom:35px; line-height: 1em;}
.content_company .content h2{ font-size: 45px; font-weight: 500; text-align: center; padding-bottom: 80px; position: relative; line-height: 1em; margin-bottom: 20px;}
.content_company .content h2:after{ content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 1px; height: 50px; background: #cccccc; bottom: 0;}
.content_company .content{ padding-left: 14%; padding-right: 14%;}
.content_company .content p{ text-align: center; line-height: 1.6em; text-align:  center;}
.content_company .content .img { display:grid;  grid-template-columns:5fr 3fr;  grid-gap: 30px; align-items: flex-end;}
.content_company .content .img img{ width: 100%;}
.content_company .content ul{ padding-top: 90px; padding-bottom: 90px;}
.content_company .content ul li h4{ text-align: left}
.content_company .content ul li h4 strong{ font-weight: 500; color: var(--main); font-size: 45px;}
.content_company .content ul li h4 span{ font-weight: 500; color: var(--main); font-size: 32px;}
.content_company .content ul{ display: flex; justify-content: space-between; align-items: center; }
.content_company .content ul li p{ text-align: left; color: #666;}

.content_culture{border-bottom: #ddd solid 1px;}
.content_culture .title{ padding-bottom: 50px;}
.content_culture .title h2{font-size: 30px; font-weight: 500; text-align: center; line-height: 1em;}
.content_culture .content{display: grid;  grid-template-columns: repeat(3,1fr);  grid-gap: 30px; }
.content_culture .content .item{ position: relative; aspect-ratio: 114/125; background: #000; overflow: hidden}
.content_culture .content .item:after{ content: ""; position: absolute; left: 35px;right: 35px; top: 35px; bottom: 35px; background: rgba(0,0,0,0.3); z-index: 2;}
.content_culture .content .item .bg{ transition-duration: 0.3s; width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; opacity: 0.8;}
.content_culture .content .item .text{ text-align: center; position: absolute; left: 60px; right:60px; top: 32%;z-index: 3; transition-duration: 0.3s;}
.content_culture .content .item .text .icon{ margin: 0 auto; font-size: 32px; color: #fff;  position: relative; width:80px; margin-bottom: 30px; height:100px; background:url(../images/water.png) no-repeat; background-size: cover; }
.content_culture .content .item .text .icon i{top: 30px; position: absolute; left: 50%; transform: translateX(-50%); }
.content_culture .content .item .text .subtitle{ font-size: 36px; font-weight: 500; color: #fff; text-align: center; line-height: 1em; margin-bottom: 15px;}
.content_culture .content .item .text .description{ color: #fff; opacity: 0; visibility: hidden;  transition-duration: 0.3s;}
.content_culture .content .item:hover .text .description{ color: #fff; opacity: 1; visibility:initial; transition-duration: 0.3s; }
.content_culture .content .item:hover .text{ top:26%; z-index: 3;}
.content_culture .content .item:hover .bg{ transform: scale(1.1);  width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; opacity: 0.8;}

.content_certificate{border-bottom: #ddd solid 1px;}
.content_certificate .title{ padding-bottom: 50px;}
.content_certificate .title h2{font-size: 30px; font-weight: 500; text-align: center; line-height: 1em;}
.content_certificate .layui-tabs-header{ display: flex; justify-content: center; grid-gap: 30px; align-items: center; margin-bottom: 50px; }
.content_certificate .layui-tabs-header li{ color: #666; cursor: pointer; }
.content_certificate .layui-tabs-header li.layui-this{ color:var(--main); position: relative}
.content_certificate .layui-tabs-header li.layui-this:after{content: ""; position: absolute; width:50%; left: 50%;transform: translateX(-50%); bottom: -15px; height: 2px; background: var(--main)}
.content_certificate .swiper{ padding-bottom: 40px;}
.content_certificate .swiper-slide{ background: #fff}
.content_certificate .swiper-slide .img{ padding: 10px; height: 360px;background: #fff; border: #ececec solid 1px; border-bottom: none;}
.content_certificate .swiper-slide .img img{ width: 100%; height: 100%; object-fit: contain; }
.content_certificate .swiper-slide p{ text-align: center; padding-top: 12px; padding-bottom: 12px; border: #ececec solid 1px;border-top: none;}
.content_certificate .swiper-scrollbar-drag{background:var(--main)}

.content_branches .title{ padding-bottom: 50px;}
.content_branches .title h2{font-size: 30px; font-weight: 500; text-align: center; line-height: 1em;}

.content_history{ overflow: hidden; padding-top: 100px;}
.content_history .title{display: flex; justify-content: space-between; align-items: center;}
.content_history .left{width: 35%; text-align: center; position: relative;padding-bottom: 200px; padding-top: 0px;}
.content_history .left strong{font-size: 160px; color: #ececec; font-weight: normal}
.content_history .left img{width: 210px; border-radius: 6px; position: absolute; left: 50%; top: 25%; margin-left: -105px;}
.content_history .title h2{ padding-top: 100px; padding-bottom: 100px; width: 30%; line-height: 1em; text-align: center; font-size:60px; font-weight:500; text-transform:uppercase; text-align:center; color:#111;}
.content_history .title h2 span{color: var(--main);}
.content_history .right{width: 35%; padding-top: 200px; padding-bottom: 100px; text-align: center; position: relative;}
.content_history .right strong{font-size: 160px; color: #ececec; font-weight: normal}
.content_history .right img{width: 320px; border-radius: 6px; position: absolute; left: 50%; top: 10%; margin-left: -162px;}
.content_branches .article-list{position: relative; width: 1240px;display: block; margin: 0 auto;}
.content_branches .article-list img.map{ width: 1240px; height: auto;}
.content_branches .article-list .item{ width:10px; height: 10px; position: absolute;}
.content_branches .article-list .item .dot{ width:10px; height: 10px; cursor: pointer; border-radius: 10px; z-index: 5; background:var(--main); position: relative; transition-duration: 0.3s;}
.content_branches .article-list .item .dot .c1{animation: radiate 2s linear infinite;  position: absolute; width: 10px; height: 10px; border:var(--main) solid 1.5px;border-radius: 50%; top: 50%; left: 50%; transform: translate(-50%, -50%);}
@keyframes radiate{
    0%   {  width: 10px; height: 10px; opacity: 1;}
    100%   {  width: 48px; height: 48px; opacity: 0;}
}
.content_branches .article-list .item:hover .dot{background:#a52936; }
.content_branches .article-list .item:hover .dot .c1{border:var(--main) solid 1.5px;}
.content_branches .article-list .item .info{background: #fff; box-shadow: 0 5px 20px rgba(0,0,0,0.2); border-radius: 6px; width:300px; position: absolute;visibility: hidden; z-index: 15; left: 50%; transform: translateX(-50%); bottom: 40px; opacity: 0; transition-duration: 0.3s;}
.content_branches .article-list .item .info:after{content: ""; position: absolute;border: 8px solid transparent; border-bottom-width: 0; left: 50%; transform: translateX(-50%); border-top-color: #fff; bottom: -8px;}
.content_branches .article-list .item .info img{ width: 100%; height:200px;object-fit:cover; border-radius:6px 6px 0px 0px;}
.content_branches .article-list .item .info .subtitle{ position: relative;line-height:2em; padding-top:10px; padding-bottom:10px; height: 60px; text-align: center; font-weight: 500;  color: #a52936;}
.content_branches .article-list .item .subtitle .photo{ overflow:hidden; border:#fff solid 2px; border-radius:40px; height:72px; width:72px; z-index:4; position:absolute; left:20px; top:-38px;}
.content_branches .article-list .item .subtitle .photo img{ width:100%; height:100%; object-fit:cover;}
.content_branches .article-list .item:hover .info{ opacity: 1; visibility: visible;bottom: 30px;}

.content_team .title{ padding-bottom: 50px;}
.content_team .title h2{font-size: 30px; font-weight: 500; text-align: center; line-height: 1em;}
.content_team .content .article-list{display: grid;  grid-template-columns: repeat(4,1fr);  grid-gap: 30px; }
.content_team .content .article-list .item img{ width: 100%;}
.content_team .content .article-list .item .subtitle{ padding-top: 20px; font-size: 24px; color: #111; margin-bottom:6px;}
.content_team .content .article-list .item .description{  color: #666;}

.list_case_cate .title{ padding-bottom: 50px;}
.list_case_cate .title h2{font-size: 30px; font-weight: 500; text-align: center; line-height: 1em;}
.list_case_cate .content{ display: grid;  grid-template-columns: repeat(4,1fr);  grid-gap: 30px; }
.list_case_cate .content .item a{ position: relative; aspect-ratio: 84/100; overflow: hidden;  display: block}
.list_case_cate .content .item a img{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; transition-duration: 0.3s; transform: scale(1)}
.list_case_cate .content .item a:after{content: "";position: absolute;bottom: 0;width: 100%;height: 150px;z-index: 10;background: linear-gradient(0deg, rgba(0,0,0,0.6), rgba(0,0,0,0.0)); z-index: 2; }
.list_case_cate .content .item a h3{ position: absolute; left: 0; right: 0; bottom: 30px; width: 100%;  font-weight: normal; text-align: center; font-size:18px; color: #fff; z-index: 3; transition-duration: 0.3s;}
.list_case_cate .content .item a:hover img{ transform: scale(1.1)}
.list_case_cate .content .item a:hover h3{ bottom: 40px;}

.list_case_detail .description{ padding-bottom: 100px;}
.list_case_detail .description .pagewidth{ display: grid;  grid-template-columns:4fr 8fr;  grid-gap: 30px; }
.list_case_detail .description .pagewidth .title h3{ font-size: 36px; color: #111; font-weight: normal; line-height: 1.3em;}
.list_case_detail .description .pagewidth .html h4{font-size: 24px; color: #111; font-weight: 500; margin-bottom: 18px; line-height: 1.6em;}
.list_case_detail .description .pagewidth .html p{  color: #111; line-height: 1.6em;}

.list_case_detail .characteristic{ background:var(--main);  position: relative}
.list_case_detail .characteristic:after{ position: absolute; top: 0; left: 0; bottom: 0; content: ""; display: block; width: 100%; opacity: 0.2; height: 100%; z-index: 1;  background:url(../images/characteristicbg.jpg) no-repeat}

.list_case_detail .characteristic .title{ text-align: center; color: #fff; margin-bottom: 40px;}
.list_case_detail .characteristic .title h3{ font-size: 24px;font-weight: 500; margin-bottom: 20px;}
.list_case_detail .characteristic .title h2{ font-size:36px;font-weight: 500; line-height: 1.4em;}
.list_case_detail .characteristic .content{ display: flex; justify-content: space-between; grid-gap: 30px;}
.list_case_detail .characteristic .content .item{ cursor: pointer; position: relative; width: 100%; height: 400px; background:rgba(255,255,255,0.1); transition-duration: 0.3s; overflow: hidden;}
.list_case_detail .characteristic .content .item .text{ padding:20px; padding-top:80px; color: #fff; text-align: center; position: absolute; left: 0px; right:0px; top:0px; bottom:0; z-index: 3; transition-duration: 0.3s;}
.list_case_detail .characteristic .content .item .text .icon{ margin: 0 auto; font-size: 48px; position: relative; margin-bottom:10px;}
.list_case_detail .characteristic .content .item .text h3{ font-size: 20px; font-weight: 500;  text-align: center; line-height: 1.3em; margin-bottom: 20px; transition-duration: 0.1s;}
.list_case_detail .characteristic .content .item .text p{  opacity: 0; visibility: hidden;  transition-duration: 0.1s;}
.list_case_detail .characteristic .content .item:hover .text{top: 0px; padding-top:20px; z-index: 3;  opacity: 1; color: var(--main)}
.list_case_detail .characteristic .content .item:hover{background: rgba(255,255,255,0.9)}
.list_case_detail .characteristic .content .item:hover .text p{ opacity: 1; visibility:initial}
.list_case_detail .promise .title{ text-align: center; color: #111; margin-bottom: 40px;}
.list_case_detail .promise .title h3{ font-size: 24px;font-weight: 500; margin-bottom: 20px;}
.list_case_detail .promise .title h2{ font-size:36px;font-weight: 500; line-height: 1.4em;}
.list_case_detail .promise .content { display: flex; justify-content: center; align-items: center; }
.list_case_detail .promise .content img{ width: 500px;}

.list_case_list{ background: #fafafa;}
.list_case_list .title{ padding-bottom: 50px;}
.list_case_list .title h2{font-size: 24px; font-weight: 500; text-align: center; line-height: 1em;}
.list_case_list .article-list .item{ box-shadow: 0 10px 30px rgba(0,0,0,0.05); border-radius: 3px;background: #fff; margin-bottom: 30px; padding: 30px; transition-duration: 0.3s; }
.list_case_list .article-list .item:hover{ box-shadow: 0 20px 40px rgba(0,0,0,0.1);}
.list_case_list .article-list .item{ display: grid;  grid-template-columns: 360px auto;  grid-gap: 30px; }
.list_case_list .article-list .item .photo{aspect-ratio:100/66; overflow: hidden;}
.list_case_list .article-list .item .photo img{ width: 100%; height: 100%; object-fit: cover; transform: scale(1); transition-duration: 0.3s;}
.list_case_list .article-list .item:hover .photo img{ transform: scale(1.1)}
.list_case_list .article-list .item .info h3{ font-size: 24px; color: var(--main) ;line-height: 1em;  font-weight: normal; margin-bottom: 16px;}
.list_case_list .article-list .item .info .row_one{ display: grid; grid-template-columns: 3fr 9fr; margin-bottom: 10px;}
.list_case_list .article-list .item .info .row_one h4{ font-size: 14px; color: #999; font-weight: normal; margin-bottom: 8px;}
.list_case_list .article-list .item .info .row_one p{ font-size: 14px; color: #111; font-weight: normal; margin-bottom: 8px; line-height: 1.6em;}
.list_case_list .article-list .item .info .row_two{  margin-bottom: 20px;}
.list_case_list .article-list .item .info .row_two h4{ font-size: 14px; color: #999; font-weight: normal; margin-bottom: 8px;}
.list_case_list .article-list .item .info .row_two .bottom{ display: flex; justify-content: left; align-items: center; grid-gap: 6px;flex-wrap: wrap}
.list_case_list .article-list .item .info .row_two .bottom span{background: var(--main); color: #fff; font-size: 14px; padding:  4px 12px; border-radius: 20px;}
.list_case_list .article-list .item .info .row_two:last-child{ margin-bottom: 0;}

.crumbs { background:#fff;}
.crumbs .pagewidth{ line-height:80px;height:80px; color: #666; }
.crumbs i{ color:#666 }
.crumbs span{ }
.crumbs span a{ color:#666; }
.crumbs span a:hover{ color:var(--main); }
.crumbs span.line{ color:#666; }
.crumbs i:last-child{display: none;}

.page_message{background: var(--bg);}
.page_message .title {margin-bottom: 30px; }
.page_message .title h2{font-size: 36px; font-weight: 500; }
.page_message .title p{ margin-bottom:30px; color:#999; }
.page_message .three{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 30px;}
.page_message .layui-form-label{color: #333;font-size: 15px; display: block!important; float: none!important; text-align: left!important; padding-left: 0!important}
.page_message .layui-input-block{ margin-left:0!important; }
.page_message .layui-btn-lg{background: var(--main)!important; color: #fff; padding-top: 18px!important; padding-bottom: 18px!important; height: auto!important; line-height: 1em!important; width: 300px;}

.product_line_1{ background: url(../images/bg.jpg) no-repeat; background-size: cover; padding-top: 160px; padding-bottom: 160px;}
.product_line_1 .pagewidth{ display: grid; grid-template-columns: 4fr 1fr 7fr; grid-gap: 30px;}
.product_line_1 .pagewidth .title h2{ font-size: 36px; font-weight:normal; line-height: 1.4em;}
.product_line_1 .pagewidth .content p{ font-size: 18px; color: #111; font-weight: normal; line-height: 1.6em;}

.product_line_2{display: grid;  grid-template-columns: repeat(3,1fr);  grid-gap: 2px; margin-bottom: 2px;  }
.product_line_2 .item{ position: relative; aspect-ratio: 5/6; background: #000; overflow: hidden}
.product_line_2 .item .bg{ transition-duration: 0.3s; width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; opacity: 0.9;}
.product_line_2 .item .text{ text-align: center; position: absolute; left: 30px; right:30px; top: 34%;  z-index: 3; transition-duration: 0.3s;}
.product_line_2 .item .text .icon{ margin: 0 auto;   position: relative; width:60px; margin-bottom: 30px;}
.product_line_2 .item .text .icon img{width: 100% }
.product_line_2 .item .text .subtitle{ font-size: 36px; font-weight:normal; color: #fff; text-align: center; line-height: 1em; margin-bottom: 25px;}
.product_line_2 .item .text .description{ line-height: 1.6em; color: #fff; opacity: 0; visibility: hidden;  transition-duration: 0.3s;}
.product_line_2 .item:hover .text .description{ color: #fff; opacity: 1; visibility:initial; transition-duration: 0.3s; }
.product_line_2 .item:hover .text{ top:26%;z-index: 3;}
.product_line_2 .item:hover .bg{ transform: scale(1.1);  width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; opacity: 0.5;}

.product_line_3{ background:var(--main);  position: relative}
.product_line_3:after{ position: absolute; top: 0; left: 0; bottom: 0; content: ""; display: block; width: 100%; opacity: 0.2; height: 100%; z-index: 1;  background:url(../images/characteristicbg.jpg) no-repeat}
.product_line_3 .title{ text-align: center; color: #fff; margin-bottom: 40px;}
.product_line_3 .title h2{ font-size: 36px;font-weight:normal; margin-bottom: 20px;}
.product_line_3 .content { display: grid; position: relative;  grid-template-columns: repeat(2,1fr);  grid-gap: 30px; z-index: 2; }
.product_line_3 .content .item {position: relative;perspective: 1000px;cursor: pointer; aspect-ratio: 2/1;}
.product_line_3 .content .item-inner { position: relative; width: 100%; height: 100%; transition: transform 0.6s; transform-style: preserve-3d;}
.product_line_3 .content .item-inner .item-front > div{ width: 90%; text-align: center}
.product_line_3 .content .item-inner .item-front div .card-title{ width: 56px; margin: 0 auto; margin-bottom: 20px;}
.product_line_3 .content .item-inner .item-front div .card-title img{ width: 100%;}
.product_line_3 .content .item-inner .item-front div .card-description {font-size: 24px; line-height: 1.4em}
.product_line_3 .content .item:hover .item-inner { transform: rotateX(180deg);}
.product_line_3 .content .item-front, .item-back {position: absolute;width: 100%;height: 100%;backface-visibility: hidden;}
.product_line_3 .content .item-front {background: rgba(255,255,255,0.1);color: white;display: flex;align-items: center;justify-content: center;}
.product_line_3 .content .item-back {background:rgba(255,255,255,0.8);color: var(--main);transform: rotateX(180deg);display: flex;align-items: center;justify-content: center;}
.product_line_3 .content .item .item-back > div{ width: 90%; text-align: center}
.product_line_3 .content .item .item-back > div .card-title{ font-size:20px; color:var(--main); margin-bottom: 15px;}


.product_line_4{ position: relative}
.product_line_4 .title{ text-align: center; color: #111; margin-bottom: 40px;}
.product_line_4 .title h2{ font-size: 36px;font-weight:normal; margin-bottom: 20px;}
.product_line_4 .content .item{ display: flex; justify-content: space-between; z-index: 2; align-items: center; margin-bottom: 60px; }
.product_line_4 .content .item .img img{ width: 100%;object-fit: cover}
.product_line_4 .content .item .img{ width: 60%; }
.product_line_4 .content .item .info{ width: 37%;}
.product_line_4 .content .item .info h2{ font-size: 36px;font-weight:500; margin-bottom: 20px; line-height: 1.2em;}
.product_line_4 .content .item .info p { font-size: 18px; color: #333; font-weight: normal; line-height: 1.6em; margin-bottom: 24px;}
.product_line_4 .content .item .info ul {display: flex; justify-content: left; grid-gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 60px;}
.product_line_4 .content .item .info ul li{ margin-bottom: 14px;}
.product_line_4 .content .item .info ul li a{background: var(--main); color: #fff; padding: 10px 15px;border-radius: 20px;}
.product_line_4 .content .item .info ul li i{ }
.product_line_4 .content .item:nth-child(2n){flex-direction: row-reverse;}
.product_line_4 .content .item .info .more a{ display: block; border-radius: 60px; font-size: 18px; transition-duration: 0.2s; border:#ccc solid 1px; display: flex; justify-content: center; height: 60px; width: 60px; line-height: 60px; text-align: center;}
.product_line_4 .content .item .info .more a:hover{ background: var(--main); color: #fff; border:var(--main) solid 1px;}



.show_product .pagewidth{display: grid; grid-template-columns: 2fr 10fr; grid-gap: 60px; }
.show_product .pagewidth .side .title{ font-size: 24px; color:#111; margin-bottom: 30px; padding-top: 35px; border-top:var(--main) solid 2px; position: relative}
.show_product .pagewidth .side ul li{ border-bottom: #ccc solid 1px;}
.show_product .pagewidth .side ul li a{ height: 80px;display: flex; justify-content: space-between; align-items: center;  color: #666666; }
.show_product .pagewidth .side ul li.active a{ color: var(--main)}


.show_product .pagewidth .content .title{ font-size: 32px; color: var(--main); margin-bottom: 30px; padding-top: 30px; border-top: #dddddd solid 2px; position: relative}
.show_product .pagewidth .content .title:after{content: ""; position: absolute; left: 0px; top: -2px; width: 80px; height: 2px;background:var(--main)}
.show_product .pagewidth .content .html{ font-size: 17px; color: #333; line-height: 1.6em;}
.show_product .pagewidth .content .html h3{ font-size: 24px; font-weight:normal; margin-bottom: 0px;}
.show_product .pagewidth .content .html img{ max-width: 100%; margin: 20px 0;}
.show_product .pagewidth .content .html .layui-tabs-body{ padding: 0;}
.show_product .pagewidth .content .html .layui-tabs-header{ display: flex; justify-content: left; align-items: center; grid-gap: 30px;}
.show_product .pagewidth .content .html .layui-tabs-header li{font-weight: 500; cursor: pointer; height: 32px;}
.show_product .pagewidth .content .html .layui-tabs-header li.layui-this{ color:var(--main); font-weight: 500; position: relative}
.show_product .pagewidth .content .html .layui-tabs-header li.layui-this:after{ position: absolute;left: 0; bottom:-2px; right: 0; content: ""; display: block; width: 100%; opacity: 1; height:2px; background:var(--main); z-index: 1;}


.service_line_1 .title{ text-align: center; color: #111; margin-bottom: 40px;}
.service_line_1 .title h2{ font-size: 36px;font-weight:normal; margin-bottom: 20px;}
.service_line_1 .content{display: grid; grid-template-columns:repeat(2,1fr); grid-gap: 30px;}
.service_line_1 .content .item{ overflow: hidden; position: relative; background: #fafafa; border-bottom:var(--main) solid 2px;aspect-ratio: 16/9;}
.service_line_1 .content .item .bg{ transform: scale(1.1); position: absolute; left: 0; top: 0; bottom: 0; right: 0; height: 100%;object-fit: cover; width: 100%; z-index: 1; opacity: 0; transition-duration: 0.3s;}
.service_line_1 .content .item:hover .bg{ transform: scale(1); opacity: 1;}
.service_line_1 .content .item .icon{ position: absolute; right: 30px; top: 30px; z-index: 3; width:60px;}
.service_line_1 .content .item .icon img{ position: absolute; width: 100%;}
.service_line_1 .content .item .icon img.icona{ opacity: 1;}
.service_line_1 .content .item .icon img.iconb{ opacity: 0;}
.service_line_1 .content .item:hover .icon img.icona{ opacity: 0;}
.service_line_1 .content .item:hover .icon img.iconb{ opacity: 1;}
.service_line_1 .content .item h2 { position: absolute; left: 30px; top: 40px; z-index:3; color: #111; font-size: 32px;font-weight: 500;transition-duration: 0.3s;}
.service_line_1 .content .item .desc{ position: absolute; left: 30px; right: 30px; top:200px; transition-duration: 0.3s; z-index:3;  line-height: 1.6em; color: #444 }
.service_line_1 .content .item:hover h2{ color: #fff;}
.service_line_1 .content .item:hover .desc{ color: #fff; top:180px;}

.service_line_2 {background: #fafafa;}
.service_line_2 .title{ text-align: center; color: #111; margin-bottom: 40px;}
.service_line_2 .title h2{ font-size: 36px;font-weight:normal; margin-bottom: 20px;}
.service_line_2 .content{display: grid; grid-template-columns:repeat(3,1fr); grid-gap: 50px;}
.service_line_2 .content .item{ position: relative; transition-duration: 0.3s; background: #fff; box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05); border-radius: 30px; padding: 24px; display:grid; grid-template-columns: 50px auto; grid-gap:16px; align-items: center}
.service_line_2 .content .item .number{ width: 50px; height: 50px; background: #fafafa; border-radius: 40px; display: flex; justify-content: center; align-items: center; font-size: 24px; font-weight: 500}
.service_line_2 .content .item h2{  color: #333; line-height: 1.6em;font-size: 16px; font-weight: normal; transition-duration: 0.3s;}
.service_line_2 .content .item:hover{background: var(--main);}
.service_line_2 .content .item:hover h2{ color: #fff;}
.service_line_2 .content .item i{ position: absolute; right: -36px; top: 50%; transform: translateY(-50%); z-index: 3; font-size: 24px; color: #333;}
.service_line_2 .content .item:nth-child(3) i{ position: absolute; right:auto; transform: rotate(90deg);bottom: -36px; left: 50%; top: auto;  z-index: 3; font-size: 24px; color: #333;}
.service_line_2 .content .item:nth-child(4) i{ position: absolute; right:auto; transform: rotate(180deg);left:-36px; top: auto;  z-index: 3; font-size: 24px; color: #333;}
.service_line_2 .content .item:nth-child(5) i{ position: absolute; right:auto; transform: rotate(180deg);left:-36px; top: auto;  z-index: 3; font-size: 24px; color: #333;}
.service_line_2 .content .item:nth-child(6) i{ position: absolute; right:auto; transform: rotate(90deg);bottom: -36px; left: 50%; top: auto;  z-index: 3; font-size: 24px; color: #333;}
.service_line_2 .content .item:nth-child(9) i{ display: none}
.service_line_2 .content .item:nth-child(4){ order:8;}
.service_line_2 .content .item:nth-child(5){ order:7;}
.service_line_2 .content .item:nth-child(6){ order:6;}
.service_line_2 .content .item:nth-child(7){ order:9;}
.service_line_2 .content .item:nth-child(8){ order:10;}
.service_line_2 .content .item:nth-child(9){ order:11;}



.service_line_3 .title{ text-align: center; color: #111; margin-bottom: 40px;}
.service_line_3 .title h2{ font-size: 36px;font-weight:normal; margin-bottom: 20px;}
.service_line_3 .content{display: grid; grid-template-columns:repeat(2,1fr); grid-gap: 30px;}
.service_line_3 .content .item img{ width:100%; margin-bottom: 30px;}
.service_line_3 .content .item h2{ font-size: 24px; color: #333; line-height: 1.6em; font-weight: 500; margin-bottom: 15px;}
.service_line_3 .content .item .html ol li{  color: #333; line-height: 1.6em; }


.list_news .article-list{ display: grid;grid-template-columns: repeat(4, 1fr); grid-gap: 30px;}

.list_news .article-list .item{width: 100%;aspect-ratio: 85/90; background: #f5f5f7;  overflow: hidden; position: relative}
.list_news .article-list .item .img{ width: 100%;aspect-ratio: 16/14;}
.list_news .article-list .item .img img{ width: 100%; height: 100%; object-fit: cover}
.list_news .article-list .item .info{ padding:25px; height: 280px; position: absolute; left: 0px; right: 0px; top: 244px;background: #f5f5f7; transition-duration: 0.3s;}
.list_news .article-list .item .info .time{ font-family: 'Barlow'; margin-bottom: 10px; font-size: 15px; color: #666;}
.list_news .article-list .item .info h2{ font-size: 22px; line-height: 1.5em; margin-bottom: 20px; font-weight: 450;display: -webkit-box;  -webkit-line-clamp:2;  -webkit-box-orient: vertical; overflow: hidden;}
.list_news .article-list .item .info h2 a{ line-height: 1.5em; }

.list_news .article-list .item .info p{ color: #666666; font-size: 14px; line-height: 1.6em;display: -webkit-box;  -webkit-line-clamp:4;  -webkit-box-orient: vertical; overflow: hidden;}
.list_news .article-list .item .info .more{  position: absolute; left: 30px; bottom: 30px; }
.list_news .article-list .item .info .more a{display: flex; justify-content: left; align-items: center; grid-gap: 10px;}
.list_news .article-list .item .info .more a span{ font-size: 14px; color: #666;}
.list_news .article-list .item .info .more a i{  color: #fff; width: 36px; border-radius: 30px; background: var(--main); height: 36px; line-height: 36px; display: flex; justify-content: center; align-items: center;}
.list_news .article-list .item:hover .info{ top: 60px; }
.list_news .article-list .item:hover h2 a{ color: var(--main) }

.show_news{background: #f9f9fb}

.show_news .title{ font-size: 32px; font-weight: 500;color: #111; text-align: center; margin-bottom: 10px;}
.show_news .info{ font-size: 14px; text-align: center; color: #999; margin-bottom: 40px;}
.show_news .info span{ margin-left: 10px; margin-right: 10px;}
.show_news .content{background: #fff; padding: 40px; width: 960px; margin: 0 auto;}
.show_news .content .html img{max-width: 100%; margin-bottom: 20px;}
.show_news .content .html{ line-height: 1.6em; font-size: 17px; margin-bottom: 30px;}

.show_news .content .other{ border-top: #ddd solid 1px; padding-top: 30px; font-size: 17px; line-height: 2em; }


.page_contact .pagewidth{ display:grid; grid-template-columns:4fr 8fr; grid-gap:60px;}
.page_contact .pagewidth .info .title{ border-bottom: #ddd solid 1px; padding-bottom: 10px; margin-bottom: 10px;}
.page_contact .pagewidth .info .title h2{ font-size: 24px; color: #111;  font-weight: 500;}
.page_contact .pagewidth .info .content{ margin-bottom: 40px; }
.page_contact .pagewidth .info .content p{line-height: 2em;  color: #333;}
.page_contact .pagewidth .info .content p span{ margin-right: 10px; }
.page_contact .pagewidth .info .content ul {display: flex; justify-content: left; grid-gap: 10px; padding-top: 10px;}
.page_contact .pagewidth .info .content ul li a{background: #f5f5f7; color: #c3c3cb; padding: 8px; border-radius: 4px; font-size: 18px;}
.page_contact .pagewidth .info .content ul li a:hover{background:var(--main); color: #fff;}
.page_contact .pagewidth .info .content.wechat img{ width: 120px; box-shadow: 0px 5px 5px rgba(0,0,0,0.1)}
.page_contact .pagewidth .form{}
.page_contact .pagewidth .form .title{ border-bottom: #ddd solid 1px; padding-bottom: 10px; margin-bottom: 10px;}
.page_contact .pagewidth .form .title h2{ font-size: 24px; color: #111;  font-weight: 500;}
.page_contact .pagewidth .form .layui-input, .form  .layui-select, .form .layui-textarea{ height: 54px;}
.page_contact .pagewidth .form .three{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap:0 30px;}
.page_contact .pagewidth .form .layui-form-label{color: #333;display: block!important; float: none!important; text-align: left!important; padding-left: 0!important}
.page_contact .pagewidth .form .layui-input-block{ margin-left:0!important; }
.page_contact .pagewidth .form .layui-btn-lg{display: block!important; background: var(--main)!important; color: #fff; padding-top: 18px!important; width: 30%; margin: 0 auto; padding-bottom: 18px!important; height: auto!important; line-height: 1em!important;}


.page_join .pagewidth .form{ width:1000px; margin: 0 auto;}
.page_join .pagewidth .form .title{ border-bottom: #ddd solid 1px; padding-bottom: 10px; margin-bottom: 10px;}
.page_join .pagewidth .form .title h2{ font-size: 24px; color: #111;  font-weight: 500;}
.page_join .pagewidth .form .layui-input, .form  .layui-select, .form .layui-textarea{ height: 54px;}
.page_join .pagewidth .form .three{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap:0 30px;}
.page_join .pagewidth .form .layui-form-label{color: #333; display: block!important; float: none!important; text-align: left!important; padding-left: 0!important}
.page_join .pagewidth .form .layui-input-block{ margin-left:0!important; }
.page_join .pagewidth .form .layui-btn-lg{display: block!important; background: var(--main)!important; color: #fff; padding-top: 18px!important; width: 30%; margin: 0 auto; padding-bottom: 18px!important; height: auto!important; line-height: 1em!important;}


.list_job .layui-collapse{border:none!important;}
.list_job .layui-colla-item:first-child{border-top: #ececec solid 1px;}
.list_job .layui-colla-item{background: #fff;  border-radius:3px; border:#ececec solid 1px; margin-bottom: 30px; }
.list_job .layui-colla-title{padding:30px; height: auto; background: #fff;}
.list_job .layui-colla-item .layui-colla-title h2{ color:#222; font-size:24px; font-weight: 500; margin-bottom:10px; }
.list_job .layui-colla-item .layui-colla-title p span{ margin-right:50px; color:#999;  }
.list_job .layui-colla-title.open h2{color: var(--main);}
.list_job .layui-colla-item .layui-icon{display: none!important;}
.list_job .layui-colla-item .icon{ position: absolute; right: 30px; top: 30px; transition-duration: 0.3s; background:#cccccc; color: #fff;font-size: 20px; width: 32px; height: 32px; border-radius: 32px; line-height: 32px; display: block; text-align: center;}
.list_job .layui-colla-title.open .icon{background: var(--main); transform: rotate(45deg);}
.list_job .layui-colla-content{padding:30px;  line-height:1.7em; color:#222;}
.list_job .layui-colla-title.open .layui-colla-title p span{ margin-right:50px; color:#333;  }

.list_job .html{ padding: 30px;}
.list_job .html h3{font-size: 18px; color: #333; font-weight: 500; margin-bottom: 15px;}
.list_job .html ul{display:flex; justify-content: left; grid-gap:20px; align-items: center; margin-bottom: 40px;}
.list_job .html ul li img{ height: 24px;}
.list_job .html p{  line-height:1.7em; color:#222;}



.page_customize_title h2{ text-align: center; color: #111; font-size: 45px; font-weight: 450;}
.page_customize_title span{ color: var(--main)}
.page_customize{background: #f5f5f7;}

.page_customize .form{background: #fff; padding: 120px;}
.page_customize .pagewidth .form{}
.page_customize .pagewidth .form .layui-form-label{line-height:36px; }
.page_customize .pagewidth .form .layui-form-mid{line-height:36px;color: #333; }
.page_customize .pagewidth .form .layui-input, .form  .layui-select, .form .layui-textarea{ height: 54px; }
.page_customize .pagewidth .form .layui-form-label{color: #333;}
.page_customize .pagewidth .form .layui-btn-lg{display: block!important; background: var(--main)!important; color: #fff; padding-top: 18px!important; width: 30%; margin: 0 auto; padding-bottom: 18px!important; height: auto!important; line-height: 1em!important;}
.page_customize .pagewidth .form .layui-form-select dl{ top: 52px;}
.page_customize .pagewidth .form .layui-form-select dl dd.layui-this{ color: var(--main)}

.page_customize .layui-form-item{ margin-bottom: 15px;}
.page_customize hr{ margin: 30px 0}
.page_customize h2{ font-size:24px; color: var(--main); margin-bottom: 30px; font-weight: 500;}

.list_download .title ul{display: grid; grid-template-columns: 6fr 1fr 1fr; grid-gap:0px;}
.list_download .title ul li{ padding:15px 20px; background: #f1f1f1; color: #999; line-height: 1.6em;}
.list_download .item ul{display: grid; grid-template-columns: 6fr 1fr 1fr; grid-gap:0px; align-items: center}
.list_download .item ul li{padding:20px 20px; border-bottom: #ececec solid 1px; color: #111; line-height:1.6em;}
.list_download .item ul li a{ color:var(--main); transition-duration: 0.2s; background: fff; border:var(--main) solid 1px; border-radius: 20px; padding:5px 15px;}
.list_download .item ul li a:hover{background: var(--main); color: #fff;}






@media screen and (max-width: 1920px) {

}

@media screen and (max-width: 1600px) {

    .detailbanner .text h1{ font-size: 90px;}
    .detailbanner .text h2{ font-size: 48px;}
    .content_company .content{ padding-left: 0; padding-right: 0;}
    .content_company .content ul li h4 strong{ font-size: 72px;}
}
@media screen and (max-width: 1440px) {
    .index_banner .swiper-slide .info{ width: 80%}
    .index_about .number .item h3{ font-size: 52px;}
    .index_about .lou{ width: 700px;}
    .index_banner .swiper-slide .info h1{ font-size: 48px;}
    .detailbanner .text h1{ font-size: 60px;}
    .detailbanner .text h2{ font-size: 36px;}
    .content_company .content h2{ font-size: 36px;}
    .content_culture .content .item .text .subtitle{ font-size:32px;}
    .content_culture .content .item .text{top: 28%; }
    .content_culture .content .item:hover .text{ top:22%;}
    .content_history .left strong{font-size: 120px; }
    .content_history .right strong{font-size: 120px;}
    .content_history .title h2{ font-size: 48px;}
    .history-per-years .inner{ padding: 5%;}
    .detailbanner .text1 h1{ font-size: 24px; margin-bottom: 10px;}
    .detailbanner .text1 h2{ font-size: 48px;}
    .list_case_detail .description .pagewidth .title h3{ font-size: 32px;}
    .product_line_1 .pagewidth .title h2{ font-size: 32px;}
    .product_line_2 .item .text{top: 200px;}
    .product_line_2 .item .text .icon{ width: 48px}
    .product_line_2 .item .text .subtitle{ font-size: 24px;}
    .product_line_2 .item:hover .text{ top:16%;z-index: 3;}

    .product_line_4 .content .item .img img{ width: 100%;}
    .product_line_4 .content .item .img{ width: 50%;}
    .product_line_4 .content .item .info{ width: 50%;}
    .product_line_4 .content .item .info ul {display: flex; justify-content: left; grid-gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 40px;}
    .product_line_4 .content .item .info ul li{ margin-bottom: 14px;}
    .product_line_4 .content .item .info ul li a{background: var(--main); color: #fff; padding: 10px 15px;border-radius: 20px;}
    .product_line_4 .content .item .info ul li i{ }
    .product_line_4 .content .item:nth-child(2n){flex-direction: row-reverse;}
    .product_line_4 .content .item .info .more a{ font-size: 16px;  height: 48px; width: 48px; line-height: 48px; text-align: center;}
    .product_line_4 .content .item .info h2{ font-size:24px; line-height: 1.5em;}
    .product_line_4 .content .item .info p{ font-size: 16px;}
    .product_line_4 .content .item .info ul{ margin-bottom: 30px;}
    .detailbanner .text2 h1{ font-size: 20px;}
    .detailbanner .text2 h2{ font-size: 48px;}
    .detailbanner .text2 .desc{ font-size: 20px;}
    .service_line_1 .content .item h2{ padding-right:90px; line-height:1.4em;}
    .service_line_1 .content .item{aspect-ratio: 16/12;}

    .list_news .article-list{ display: grid;grid-template-columns: repeat(3, 1fr); grid-gap: 30px;}
    .page_customize_title h2{ font-size: 36px;}
    .page_customize .form{ padding: 60px;}

}
@media screen and (max-width: 480px) {
    .padding{ padding-top:50px; padding-bottom:50px; }
    .indexpd{ padding-top: 80px; padding-bottom: 80px;}
    .padding-bottom-80{ padding-bottom:50px;}
    .padding-top-0{ padding-top:0; }
    .swiper{--swiper-theme-color:  var(--blue);/* 设置Swiper风格 */--swiper-navigation-color: #172259;/* 单独设置按钮颜色 */--swiper-navigation-size: 24px;/* 设置按钮大小 */}
    .index_banner .swiper-slide .info{ width: 95%}
    .index_banner .swiper-slide .info h1 { font-size: 32px;}
    .index_about .pagewidth .title h3 { font-size: 24px; width: 100%}
    .index_about .lou{width: 100%}
    .index_app .pagewidth .title h3 { font-size: 24px;}
    .index_app .pagewidth .content .item{background:rgba(0,0,0,0.3); border:rgba(255,255,255,0.4) solid 1px;-webkit-backdrop-filter:blur(5px); backdrop-filter: blur(5px);}
    .index_app .pagewidth .content{ grid-template-columns: repeat(1, 1fr);}
    .index_app .pagewidth .title{ margin-bottom: 30px;}
    .index_app .pagewidth .content .item .box .name{ font-size: 24px;}

    .index_app .pagewidth .content .item .box{top: 70px;}
    .index_app .pagewidth .content .item .box .icon{margin-bottom: 20px;}
    .index_app .pagewidth .content .item .box .icon img{ width: 48px;}
    .index_app .pagewidth .content .item .box .desc{  line-height: 1.6em; color: #fff; font-weight:normal; margin-bottom: 20px; opacity:1 ; visibility: inherit;}
    .index_app .pagewidth .content .item .box .button{ opacity:1 ; visibility:visible;}
    .index_app .pagewidth .content .item .box .button a{display: flex; justify-content: center; align-items: center; grid-gap: 10px;}
    .index_app .pagewidth .content .item .box .button a span{  color: #fff;}
    .index_app .pagewidth .content .item .box .button a i{  color: #fff; width: 36px; border-radius: 30px; background: var(--main); height: 36px; line-height: 36px; display: flex; justify-content: center; align-items: center;}
    .index_product .pagewidth .title h3{ font-size: 32px;}
    .index_product .pagewidth .title p{ font-size: 20px;}


    .index_product .pagewidth .icon_list{ display: flex; justify-content: center; grid-gap: 12px; padding-top:40px;margin-bottom: 40px;flex-wrap: wrap}
    .index_product .pagewidth .icon_list .item{width: 30%}
    .index_product .pagewidth .icon_list .item .icon{margin: 0 auto; margin-bottom: 14px;transition: transform 0.6s; transition-delay: 0.1s; transform-style: preserve-3d;}
    .index_product .pagewidth .icon_list .item .icon img{ width: 100%;  transition-duration: 0.3s; transition-delay: 0.1s;}
    .index_product .pagewidth .icon_list .item .icon img.icona{ display: block; position: absolute; opacity: 1;}
    .index_product .pagewidth .icon_list .item .icon img.iconb{ display: block; position: absolute; opacity: 0;}
    .index_product .pagewidth .icon_list .item .name{ color: #fff; text-align: center; line-height: 1.6em;}
    .index_product .pagewidth .icon_list .item:hover .icon img.icona{opacity: 0;}
    .index_product .pagewidth .icon_list .item:hover .icon img.iconb{opacity: 1;}
    .index_service .pagewidth .title h3{ font-size: 32px;}

    .index_about .pagewidth .title{ margin-bottom: 30px;}
    .index_about .number{ margin-bottom: 50px;}


    .index_about .number{ width: 100%; display: grid; grid-template-columns:repeat(2, 1fr);grid-gap: 10px;}
    .index_about .number .item h3 strong{ font-size: 38px;}
    .index_service .pagewidth .content{grid-template-columns: repeat(2,1fr); grid-gap: 20px; width: 100% }
    .index_service .pagewidth .content .item{background: rgba(255,255,255,0); transition-duration: 0.3s; border-radius: 3px; padding-top: 20px; padding-bottom: 20px;}
    .index_service .pagewidth .content .item:hover{background: rgba(255,255,255,0.1); }
    .index_service .pagewidth .content .item img{ width: 40px; margin-bottom: 10px;}
    .index_service .pagewidth .content .item p{ color:#fff; }


    .index_news .title{ display: block}
    .index_news .title h3{ margin-bottom: 20px;}
    .detailbanner .text{ padding-left: 20px; padding-right: 20px;}
    .detailbanner .text h1{ font-size: 48px;}
    .detailbanner .text h2{ font-size: 24px; line-height: 1.4em;}
    .detailmenu{ height: auto;}
    .detailmenu ul{ grid-gap: 20px;}
    .detailmenu ul li a{ padding-left: 0px; padding-right: 0px;}
    .content_company .content h2{ font-size: 32px;}
    .content_company .content ul{ flex-wrap: wrap; grid-gap: 0px; padding-top: 60px; padding-bottom: 60px;}
    .content_company .content ul li{ width: 50%; height: 80px;}
    .content_company .content ul li h4 strong{ font-size: 38px;}
    .content_company .content .img{grid-template-columns: repeat(1,1fr); grid-gap: 20px;}
    .content_culture .content{grid-template-columns: repeat(1, 1fr); grid-gap: 20px;}
    .content_culture .content .item .text .icon{ width: 64px; height: 80px;}
    .content_culture .content .item .text .icon i{ top: 20px;}
    .content_culture .content .item .text .description{ color: #fff; opacity: 1; visibility:initial; transition-duration: 0.3s; }
    .content_culture .content .item .text{ top:22%; z-index: 3;}
    .content_culture .content .item .bg{ transform: scale(1.1);  width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; opacity: 0.8;}

    .content_certificate .swiper-slide p{ padding-top: 12px; padding-bottom: 12px;}
    .history-per-years .details{ width: 100%!important;}
    .content_team .content .article-list{ grid-template-columns: repeat(1, 1fr); grid-gap: 40px; }

    .content_history{ padding-top: 40px;}
    .content_history .title{ display: block}
    .content_history .left{width: 100%; padding-bottom:100px; height: 100px;}
    .content_history .left strong{ font-size: 72px; display: block; line-height: 1em;}
    .content_history .right{width: 100%; padding-top: 172px; padding-bottom: 40px;}
    .content_history .title h2{width: 100%; font-size: 32px; padding-bottom: 30px; padding-top: 30px;}
    .content_history .right img{ width: 280px; margin-left: -140px;}
    .content_history .right strong{ font-size: 72px; display: block; line-height: 1em;}
     .content_branches .title{ padding-bottom: 20px;}
    
    .content_branches .article-list .item{ position: initial!important; width: auto!important; height: auto!important; margin-bottom:20px;}
    .content_branches .article-list .item .dot{ display: none}
    .content_branches .article-list .item .info{width: auto; visibility: inherit; opacity: 1; position: inherit; left: auto; transform:translateX(0%)}
    .content_branches .article-list .item .info:after{ display:none}
    .content_branches .article-list{ width:100%;}
    .content_branches .article-list img.map{ width:100%; margin-bottom:20px;}

    .detailbanner .text1 h1{ font-size:16px;}
    .detailbanner .text1 h2{ font-size: 32px;}
    .list_case_cate .content{grid-template-columns: repeat(2, 1fr); grid-gap: 20px;}
    .list_case_cate .content .item a h3{bottom: 15px; font-size: 15px;}
    .list_case_cate .content .item a:hover h3{ bottom: 20px;}



    .list_case_detail .description .pagewidth{ display: block}
    .list_case_detail .description .pagewidth .title h3{ margin-bottom: 30px;}
    .list_case_detail .characteristic .title h3{font-size: 18px;}
    .list_case_detail .characteristic .title h2{ font-size: 32px;}
    .list_case_detail .characteristic .content{ display: block}
    .list_case_detail .promise .title h3{font-size: 18px;}
    .list_case_detail .promise .title h2{ font-size: 24px;}
    .list_case_detail .characteristic .title h2{ font-size: 24px;}
    .list_case_detail .characteristic .content .item{ margin-bottom: 20px;}
    .list_case_detail .characteristic .content .item .text{ position: initial; }
    .list_case_detail .characteristic .content .item .text{top: 60px; z-index: 3;  opacity: 1; color: var(--main)}
    .list_case_detail .characteristic .content .item{background: rgba(255,255,255,0.95)}
    .list_case_detail .characteristic .content .item .text p{ opacity: 1; visibility:initial}
    .list_case_detail .characteristic:after{background-size: cover;}
    .list_case_detail .promise .content img{ width: 80%}
    .list_case_list .article-list .item .info { padding-top: 20px;}
    .list_case_list .article-list .item .info .row_one{grid-template-columns: repeat(1, 1fr); grid-gap: 20px;}
    .list_case_list .article-list .item{ padding: 20px; margin-bottom: 20px;}

    .list_case_list .article-list .item{ display:block;  grid-template-columns: 360px auto;  grid-gap: 30px; }
    .list_case_list .article-list .item .photo{aspect-ratio:100/66; overflow: hidden;}



    .detailbanner .text2{ padding-left: 20px; padding-right: 20px;}
    .detailbanner .text2 h1{font-size: 18px;}
    .detailbanner .text2 h2{ font-size: 32px; margin-bottom: 20px;}
    .detailbanner .text2 .desc{font-size: 16px;}



    .detailbanner .text2 .icon_list{ display: flex; justify-content: center; grid-gap: 0px; padding-top:20px;margin-bottom: 20px;flex-wrap: wrap}
    .detailbanner .text2 .icon_list .item{width: 25%; margin-bottom: 10px;}
    .detailbanner .text2 .icon_list .item .icon{margin: 0 auto; width: 36px;  height: 42px; margin-bottom: 10px;transition: transform 0.6s; transition-delay: 0.1s; transform-style: preserve-3d;}
    .detailbanner .text2 .icon_list .item .icon img{ width: 100%;  transition-duration: 0.3s; transition-delay: 0.1s;}
    .detailbanner .text2 .icon_list .item .icon img.icona{ display: block; position: absolute; opacity: 1;}
    .detailbanner .text2 .icon_list .item .icon img.iconb{ display: block; position: absolute; opacity: 0;}
    .detailbanner .text2 .icon_list .item .name{ color: #fff; text-align: center; line-height: 1.6em; font-size: 12px;}
    .detailbanner .text2 .icon_list .item:hover .icon img.icona{opacity: 0;}
    .detailbanner .text2 .icon_list .item:hover .icon img.iconb{opacity: 1;}

    .product_line_1{ padding-top: 80px; padding-bottom: 80px;}
    .product_line_1 .pagewidth{ display: block}
    .product_line_1 .pagewidth .title h2{ margin-bottom: 30px;}
    .product_line_1 .pagewidth .content p{ font-size: 16px;}

    .product_line_2{ grid-template-columns: repeat(1, 1fr); padding: 2px;}
    .product_line_2 .item .text .icon{ width: 32px; margin-bottom: 16px;}
    .product_line_2 .item .text .subtitle{ margin-bottom: 16px;}

    .product_line_2 .item .text .description{ color: #fff; opacity: 1; visibility:initial; transition-duration: 0.3s; }
    .product_line_2 .item .text{ top:12%;z-index: 3;}
    .product_line_2 .item .bg{ transform: scale(1.1);  width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; opacity: 0.5;}
    .product_line_3 .title h2{ font-size: 32px;}
    .product_line_3 .content{ grid-template-columns: repeat(1, 1fr);}
    .product_line_3 .content .item{ aspect-ratio: 2/2}
    .product_line_3 .content .item .item-back > div .card-title{ font-size: 18px; line-height: 1.5em; margin-bottom: 16px;}
    .product_line_3 .content .item .item-back > div .card-description{ font-size: 13px; line-height: 1.5em; }
    .product_line_4 .title h2{ font-size: 32px;}
    .show_product .pagewidth .content .html .layui-tabs-header li{ height: auto; line-height: 1.3em;}
    .show_product .pagewidth .content .html .layui-tabs-header{ display: block}
    .show_product .pagewidth .content .html .layui-tabs-header li{ margin-bottom: 12px;}
    .layui-tabs-scroll{ padding: 0px!important;}
    .layui-tabs-bar .layui-icon-next { display: none}
    .layui-tabs-bar .layui-icon-prev { display: none}
    .product_line_4 .content .item{ display: block}
    .product_line_4 .content .item .img{ width: 100%; margin-bottom:20px;}
    .product_line_4 .content .item .info{ width: 100%}
    .show_product .pagewidth{ display: block;}
    .show_product .pagewidth .side{ display: none}
    .show_product .pagewidth .content .html{ font-size: 15px;}
    .show_product .pagewidth .content .html h3{ font-size: 18px;}
    .detailmenu ul li a{ font-size: 14px;}
    .detailmenu ul li a{ text-align: center; line-height: 1.4em; height: auto; padding-top: 20px; padding-bottom: 20px;}

    .show_news .content .other{ font-size: 15px;}
    .show_news{background:#fff; }
    .show_news .title{ font-size: 24px; line-height: 1.4em;}
    .show_news .content{ width: auto; padding: 0;}
    .show_news .content .html{ font-size: 15px;}

    .crumbs .pagewidth{ font-size: 12px;}


    .list_news .article-list{ grid-template-columns: repeat(1, 1fr); }
    .list_news .article-list .item .img{ aspect-ratio: 16/10}
    .list_news .article-list .item{ aspect-ratio: initial}
    .list_news .article-list .item .info{ position: initial}


    .page_contact .pagewidth{ display: block}
    .page_contact .pagewidth .form .three{ display: block;}
    .page_contact .pagewidth .form .layui-btn-lg{ width: 100%;}

    .page_join .pagewidth .form{ width: 100%;}
    .page_join .pagewidth .form .three{ display: block;}
    .page_join .pagewidth .form .layui-btn-lg{ width: 100%;}

    .list_job .layui-colla-title{ padding: 20px;}
    .list_job .layui-colla-item .layui-colla-title p span{ display: block}
    .list_job .layui-colla-content{ padding: 20px;}
    .list_job .layui-colla-item .layui-colla-title h2{ font-size: 18px;}
    .list_job .layui-colla-item .icon{ right: 20px; top: 20px;}
    .list_job .html{ padding: 0;}
    .list_job .html ul li img{ height: 18px;}
    .list_job .html h3{ font-size: 16px; margin-bottom: 10px;}

    .page_customize_title h2{ font-size: 24px; line-height: 1.4em;}

    .page_customize{background:#fff; border-top: #ececec solid 1px;}
    .page_customize .form{ padding: 0;}
    .page_customize h2{ margin-bottom:10px;}
    .page_customize .pagewidth .form .layui-form-label{ line-height: auto!important; padding: 0!important; display: blockl; float: initial; width: 100%;  text-align: left; }
    .page_customize .pagewidth .form .layui-input-block{ margin-left: 0;}
    .layui-form-item .layui-input-inline{margin-left: 0!important; left: 0!important;}
    .page_customize .layui-form-mid{ widht:100%; float: initial}
    .layui-form-item .layui-input-inline+.layui-form-mid{ margin-left: 0!important; top: auto!important;}
    .page_customize .pagewidth .form .layui-btn-lg{ width: 100%;}
    .page_customize .layui-form-mid.pingmi{ position: absolute; right: 0px; margin-top: -65px;}

    .list_download .title{ display: none}


    .list_download .item ul{grid-template-columns: 1fr 1fr; border-bottom: #ececec solid 1px; padding-bottom: 20px; margin-bottom: 20px;}

    .list_download .item ul li{padding:6px; border-bottom:none; color: #111; line-height:1.6em;}
    .list_download .item ul li a{ color:var(--main); transition-duration: 0.2s; background: fff; border:var(--main) solid 1px; border-radius: 20px; padding:5px 15px;}
    .list_download .item ul li a:hover{background: var(--main); color: #fff;}

    .list_download .item ul li:nth-child(1) {
        grid-column: 1 / 3; font-size: 16px;
    }

    .list_download .item ul li:nth-child(2) {
        grid-column: 1 / 2; color: #999;
    }

    .list_download .item ul li:nth-child(3) {
        grid-column: 2 / 3; text-align: right;
    }



}

/*小尺寸手机*/
@media screen and (max-width: 320px) {

}
/*横屏*/
@media all and (orientation : landscape) {}
/*竖屏*/
@media all and (orientation : portrait){}