*{box-sizing:border-box}
html,body{margin:0;padding:0}
body.tpl-shangmao{
  color:#333;background:#fff;
  font:14px/1.7 "Microsoft YaHei",Arial,sans-serif
}
h1,h2,h3,h4,p,ul,dl,dd,dt{margin:0;padding:0}
ul{list-style:none}
a{text-decoration:none;color:#333}
img{border:0;max-width:100%;vertical-align:middle}
.clearfix:after{content:".";display:block;height:0;clear:both;overflow:hidden;visibility:hidden}

.container-fluid{width:1430px;max-width:calc(100% - 32px);margin:0 auto}

.x-header{padding:1.7vh 0;background:#fff}
.x-logo{float:left;max-width:28%;line-height:66px}
.x-logo a{
  display:block;overflow:hidden;color:#333;font-size:24px;font-weight:700;
  white-space:nowrap;text-overflow:ellipsis
}
.x-menu{float:right;width:auto;max-width:68%}
.x-menu>li{float:left;position:relative;text-align:center}
.x-menu>li>a{display:block;padding:0 28px;color:#333;font:400 17px/66px "Microsoft YaHei"}
.x-menu>li>a:hover,.x-menu>li.active>a{color:#007ec5}
.x-menu>li:after{content:"/";position:absolute;right:0;top:23px;color:#c7c7c7}
.x-menu>li:last-child:after{content:none}

.x-banner{overflow:hidden;background:#111}
.x-banner img{display:block;width:100%;height:auto}
.x-banner img[src=""]{display:none}

.x-title{color:#007ec5;position:relative}
.x-title h3{color:inherit;font:600 40px/66px "Microsoft YaHei";text-align:center}
.x-title h3 span{display:block;color:#999;font:400 16px/20px "Microsoft YaHei";text-transform:uppercase}

.x-product{padding:5vh 0 5.8vh;background:#f8f8f8}
body.tpl-shangmao .x-product .product-source,
body.tpl-shangmao .x-product .product-source ul,
body.tpl-shangmao .x-product .product-source li{display:none!important}
body.tpl-shangmao .x-product .x-product-list{
  display:flex;flex-wrap:wrap;margin:50px -13px 0;padding:0
}
body.tpl-shangmao .x-product .x-product-item{width:25%}
body.tpl-shangmao .x-product .x-product-item:nth-child(n+9){display:none!important}
body.tpl-shangmao .x-product .x-product-itembg{padding:10px 13px}
body.tpl-shangmao .x-product .x-product-item a{
  display:block;padding:9px;border:1px solid #eee;background:#fff
}
body.tpl-shangmao .x-product .x-product-item .img{overflow:hidden;font-size:0}
body.tpl-shangmao .x-product .x-product-item .img img{
  display:block;width:100%;height:auto;transition:transform .5s
}
body.tpl-shangmao .x-product .x-product-item .img:hover img{transform:scale(1.1)}
body.tpl-shangmao .x-product .wz{margin:30px 0}
body.tpl-shangmao .x-product .wz h3{
  margin:0 0 15px;color:#333;font:600 18px/36px "Microsoft YaHei";text-align:center
}
body.tpl-shangmao .x-product .x-product-item-more{width:150px;margin:0 auto;overflow:hidden}
body.tpl-shangmao .x-product .x-product-item-more h4{
  float:left;width:105px;margin:0;border:1px solid #e2e2e2;background:#fff;
  color:#666;font:400 12px/38px "Microsoft YaHei";text-align:center
}
body.tpl-shangmao .x-product .x-product-item-more span{
  float:right;display:block;width:45px;background:#e2e2e2;color:#000;font:400 12px/40px "Microsoft YaHei";text-align:center
}
body.tpl-shangmao .x-product .x-product-item:hover a{border-color:#007ec5}
body.tpl-shangmao .x-product .x-product-item:hover .x-product-item-more h4{
  border-color:#3d3d3d;background:#3d3d3d;color:#fff
}
body.tpl-shangmao .x-product .x-product-item:hover .x-product-item-more span{background:#007ec5;color:#fff}

body.tpl-shangmao .x-news{padding:6.7vh 0 8.5vh;background:#fff}
body.tpl-shangmao .x-news .news-source,
body.tpl-shangmao .x-news .news-source ul.runtime-news-list,
body.tpl-shangmao .x-news .news-source ul.runtime-news-list>li,
body.tpl-shangmao .x-news .news-source ul.runtime-news-list>li.fl{display:none!important}
body.tpl-shangmao .x-news .x-news-box{margin-top:3.125%;font-size:0}
body.tpl-shangmao .x-news .x-news-left{display:inline-block;vertical-align:middle;width:46%;font-size:14px}
body.tpl-shangmao .x-news .x-company-list{position:relative;overflow:hidden}
body.tpl-shangmao .x-news .x-company-item{display:none;position:relative}
body.tpl-shangmao .x-news .x-company-item.is-on{display:block}
body.tpl-shangmao .x-news .x-company-item a{display:block;width:100%;text-align:center}
body.tpl-shangmao .x-news .x-company-item a:after{content:"";display:inline-block;height:100%;vertical-align:middle}
body.tpl-shangmao .x-news .x-company-item img{
  display:inline-block;vertical-align:middle;width:100%;max-width:100%;height:auto
}
body.tpl-shangmao .x-news .x-company-item p{
  position:absolute;left:0;right:0;bottom:0;margin:0;padding-left:16px;
  overflow:hidden;background:rgba(0,0,0,.6);border-top-right-radius:36px;
  color:#fff;font:400 16px/52px "Microsoft YaHei";text-align:left;white-space:nowrap;text-overflow:ellipsis
}
body.tpl-shangmao .x-news .x-company-item p span{float:right;padding-right:20px;font:400 14px/52px "Microsoft YaHei"}
body.tpl-shangmao .x-news .x-company-item:hover a p{color:rgba(255,255,255,.6)}
body.tpl-shangmao .x-news .x-news-right{display:inline-block;vertical-align:middle;float:right;width:50%;font-size:14px}
body.tpl-shangmao .x-news .x-news-right>li{list-style:none}
body.tpl-shangmao .x-news .x-news-right>li>a{display:block;overflow:hidden}
body.tpl-shangmao .x-news .x-news-right>li+li{margin-top:56px}
body.tpl-shangmao .x-news .x-news-right>li:nth-child(n+4){display:none!important}
body.tpl-shangmao .x-news .x-news-right .news-img{float:left;width:25%;overflow:hidden}
body.tpl-shangmao .x-news .x-news-right .news-img img{display:block;width:100%;max-width:100%;height:auto}
body.tpl-shangmao .x-news .x-news-right .news-date{
  float:left;width:16%;padding:10px 0 15px;text-align:center;position:relative
}
body.tpl-shangmao .x-news .x-news-right .news-date:before{
  content:"";position:absolute;top:10px;right:0;bottom:6px;width:2px;background:#e3e3e3
}
body.tpl-shangmao .x-news .x-news-right .news-date h4{margin:0;color:#2e2f34;font:600 40px/52px Arial}
body.tpl-shangmao .x-news .x-news-right .news-date h5{margin:0;color:#666;font:400 16px/30px Arial}
body.tpl-shangmao .x-news .x-news-right .news-text{float:right;width:56%;margin-top:11px}
body.tpl-shangmao .x-news .x-news-right .news-text h3{margin:0 0 6px;color:#333;font:600 18px/26px "Microsoft YaHei"}
body.tpl-shangmao .x-news .x-news-right .news-text p{
  display:-webkit-box;margin:0;overflow:hidden;color:#999;font:400 14px/26px "Microsoft YaHei";
  -webkit-box-orient:vertical;-webkit-line-clamp:2
}
body.tpl-shangmao .x-news .x-news-right li:hover .news-text h3{color:#007ec5}

.x-about{position:relative;padding-bottom:40px}
.x-about-img img{display:block;width:100%;height:320px;object-fit:cover}
.x-about-box{position:relative;min-height:280px}
.x-about-left{
  position:absolute;top:-150px;left:0;z-index:2;width:344px;
  background:url(/template-static/shangmao/images/2bce45a1954c4bbc6fbe8b3f441ea6f82db06be3.jpg) no-repeat center #3d3d3d
}
.x-about-title{padding:20px 0;text-align:center}
.x-about-title h3{color:#fff;font:600 40px/66px "Microsoft YaHei"}
.x-about-title p{color:#fff;font:400 14px/28px "Microsoft YaHei"}
.x-about-name{padding:40px}
.x-about-name>h3{color:#fff;font:400 24px/40px "Microsoft YaHei"}
.x-about-hot{margin-top:40px}
.x-about-hot h3{
  padding-left:38px;color:rgba(255,255,255,.6);font:400 14px/26px "Microsoft YaHei";
  background:url(/template-static/shangmao/images/1a0811dd95c10e2dae5d3fbd360e2727677c0a62.png) no-repeat left center
}
.x-about-hot p{color:#fff;font:400 32px/44px "Microsoft YaHei"}
.x-about-right{float:right;width:70%;padding:10px 0 20px}
.x-about-right h4{padding:30px 0 19px;color:#333;font:600 28px/52px "Microsoft YaHei"}
.x-about-right p{color:#666;font:400 16px/36px "Microsoft YaHei"}

.x-layout{padding:5vh 0;background:#181819}
.x-layout-menu{float:left;width:58%}
.x-layout-menu dl{float:left;width:33%;text-align:left}
.x-layout-menu dt{margin-bottom:1em;color:#fff;font:600 18px/30px "Microsoft YaHei"}
.x-layout-menu dd a{display:block;color:rgba(255,255,255,.6);font:400 14px/28px "Microsoft YaHei"}
.x-layout-menu dd a:hover{color:rgba(255,255,255,.8)}
.about-more{margin-top:2vh}
.about-more a{color:rgba(255,255,255,.2)}
.about-more a:hover{color:rgba(255,255,255,.8)}
.x-layout-side{float:right;width:38%}
.x-layout-tel h3{
  padding-left:28px;color:#fff;font:400 16px/30px "Microsoft YaHei";
  background:url(/template-static/shangmao/images/3a8013fc19f6a31512d44ea33f2ef06d124346a4.png) no-repeat left center
}
.x-layout-contact{margin-top:8px}
.x-layout-contact .hotline{color:#fff;font:600 36px/52px Arial}
.x-layout-contact p{margin:0;color:rgba(255,255,255,.7);font-size:14px;line-height:1.7}
.x-seo{margin-top:2vh;color:#999}
.x-seo a{color:#999;font:400 12px/12px "Microsoft YaHei"}
.x-seo a:hover{color:#666}
.x-footer{padding:15px 0;background:#0c0c0c;color:rgba(255,255,255,.6);font:400 14px/46px "Microsoft YaHei"}
.x-copyright{float:left}
.x-region{float:right;text-align:right}
.x-footer a{color:rgba(255,255,255,.5)}
.x-footer a:hover{color:rgba(255,255,255,.8)}
.x-link{background:#fff;border-bottom:3px solid #0c0c0c;font:400 16px/80px "Microsoft YaHei"}
.x-link a{margin-right:14px;color:#333;font:400 14px/80px "Microsoft YaHei"}
.x-link a:hover{color:#007ec5}

.page-position{padding:22px 0;color:#666;font-size:14px}
.page-position a{color:#666}
.page-position a:hover{color:#007ec5}
.page-position-extra:empty{display:none}
.page-position-extra:not(:empty)::before{content:" > "}
.page-wrap{padding-bottom:50px;background:#fff}
.page-wrap-left{float:left;width:305px;margin-right:4.16666667%}
.page-wrap-right{overflow:hidden}
.page-title{margin-bottom:24px;color:#333;font-size:24px}
.page-wrap:has(.xypg-news-detail) .page-title{display:none}
.page-text{color:#555;line-height:2}

.xypg-left-box{margin-bottom:20px}
.xypg-left-title{padding:10px 20px;background:#007ec5}
.xypg-left-title h3{color:#fff;font-size:20px;font-weight:700;line-height:30px}
.xypg-left-title span{margin-left:10px;color:#fff;font-size:16px;font-weight:400}
.xypg-left-title span:before{content:"/";padding-right:5px}
.xypg-left-con{border:1px solid #eee;border-top:0}
.xypg-left-nav>li{border-bottom:1px solid #eee}
.xypg-left-nav>li:last-child{border-bottom:0}
.xypg-left-nav>li>a{display:block;padding:15px 18px;color:#2e2e2e;font-size:16px;line-height:22px}
.xypg-left-nav>li:hover>a,.xypg-left-nav>li.clicked>a{color:#007ec5}
.latest-news li{border-bottom:1px dashed #eee}
.latest-news a{display:block;padding:10px 15px;overflow:hidden;color:#555;white-space:nowrap;text-overflow:ellipsis}
.latest-news a:hover{color:#007ec5}
.page-wrap-contact{padding:15px}
.page-wrap-contact h4{margin-bottom:8px;color:#333}
.page-wrap-contact p{color:#666;line-height:1.9}

body.tpl-shangmao .page-wrap ul.runtime-news-list,
body.tpl-shangmao .page-wrap .xypg-news-list{
  display:block!important;width:100%!important;margin:0;padding:0;grid-template-columns:none!important
}
body.tpl-shangmao .page-wrap ul.runtime-news-list>li,
body.tpl-shangmao .page-wrap .xypg-news-list>li{
  display:block!important;position:relative;float:none!important;width:auto!important;
  margin:0 0 35px!important;padding:30px!important;overflow:visible!important;
  border:1px solid #e1e1e1!important;background:#fff!important;box-shadow:none!important;transform:none!important
}
body.tpl-shangmao .page-wrap ul.runtime-news-list>li:hover,
body.tpl-shangmao .page-wrap .xypg-news-list>li:hover{box-shadow:0 2px 13px 1px rgba(8,1,3,.18)!important;transform:none!important}
body.tpl-shangmao .page-wrap .news-img{display:none!important}
body.tpl-shangmao .page-wrap .xypg-news-list .tit,
body.tpl-shangmao .page-wrap .news-text{position:relative;margin:0 0 15px;padding:0!important;border-bottom:1px solid #cbcbcb}
body.tpl-shangmao .page-wrap .xypg-news-list .tit h3,
body.tpl-shangmao .page-wrap .news-text h3{
  margin:0!important;padding:0 28% 15px 0!important;color:#565656!important;
  font-size:18px!important;font-weight:400!important;white-space:normal!important
}
body.tpl-shangmao .page-wrap .xypg-news-list .tit .date,
body.tpl-shangmao .page-wrap .xypg-news-list .date,
body.tpl-shangmao .page-wrap .news-date,
body.tpl-shangmao .page-wrap .news-date time{
  display:block!important;position:absolute;right:0;top:0;width:auto;height:auto;padding:0;
  background:none!important;color:#666;font-size:14px;font-style:normal
}
body.tpl-shangmao .page-wrap .time1,body.tpl-shangmao .page-wrap .time2{display:none!important}
body.tpl-shangmao .page-wrap .news-text .info,
body.tpl-shangmao .page-wrap .xypg-news-list .info{display:block!important;margin:0;color:#999;font-size:14px;line-height:2;-webkit-line-clamp:unset}
body.tpl-shangmao .page-wrap .news-text .more,body.tpl-shangmao .page-wrap .xypg-news-list .more{
  display:block!important;margin-top:15px
}
body.tpl-shangmao .page-wrap .xypg-news-list .more span{
  display:inline-block!important;width:130px;line-height:33px;text-align:center;
  border:1px solid #e1e1e1;color:#666;font-size:0
}
body.tpl-shangmao .page-wrap .xypg-news-list .more span::after{content:"了解详情 +";font-size:14px}
body.tpl-shangmao .page-wrap li:hover .tit h3,body.tpl-shangmao .page-wrap li:hover .news-text h3{color:#292e39!important}
body.tpl-shangmao .page-wrap li:hover .more,body.tpl-shangmao .page-wrap li:hover .more span{
  color:#fff!important;background:#292e39!important;border-color:#292e39!important
}

body.tpl-shangmao .page-wrap .xypg-product-list,
body.tpl-shangmao .page-wrap .product-list,
body.tpl-shangmao .page-wrap .product-grid{display:block!important;margin:0 -1.5%;padding:0;font-size:0;grid-template-columns:none!important}
body.tpl-shangmao .page-wrap .runtime-product-item,
body.tpl-shangmao .page-wrap .xypg-product-list>li{
  display:inline-block!important;float:none!important;vertical-align:bottom;
  width:30.333%!important;margin:0 1.5% 20px!important;padding:10px 10px 0!important;
  border:1px solid #eee;background:#fff;font-size:14px
}
body.tpl-shangmao .page-wrap .runtime-product-item>a{display:block!important;flex-direction:unset!important;height:auto!important}
body.tpl-shangmao .page-wrap .runtime-product-image{display:block;overflow:hidden;font-size:0;background:#f3f3f3}
body.tpl-shangmao .page-wrap .runtime-product-image img{
  display:block;width:100%;height:auto;min-height:0;transition:transform .5s
}
body.tpl-shangmao .page-wrap .runtime-product-item:hover .runtime-product-image img{transform:scale(1.1)}
body.tpl-shangmao .page-wrap .runtime-product-title{
  position:static!important;display:block!important;height:auto!important;min-height:0!important;
  margin:0!important;padding:.8em 0!important;background:transparent!important;color:#5a5a5a!important;
  font-size:14px!important;font-weight:400!important;line-height:1.6!important;text-align:center!important
}
body.tpl-shangmao .page-wrap .runtime-product-item:hover{border-color:#007ec5}
body.tpl-shangmao .page-wrap .runtime-product-item:hover .runtime-product-title{color:#007ec5!important}

.detail-grid{display:grid;grid-template-columns:42% 1fr;gap:30px}
.detail-image{min-height:300px;background:#f3f3f3;position:relative;display:grid;place-items:center}
.detail-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#fff}
.detail-info h1{margin:0 0 12px;color:#007ec5;font-size:24px}
.detail-info p{padding:10px 0;border-bottom:1px dashed #ddd}
.detail-block{margin-top:28px;line-height:1.9}
.detail-block h3{padding-left:12px;border-left:4px solid #007ec5;font-size:19px}

body.tpl-shangmao .page-wrap .xypg-news-detail{color:#333}
body.tpl-shangmao .page-wrap .xypg-news-detail .news-title,
body.tpl-shangmao .page-wrap .xypg-news-detail h1.news-title{
  margin:0 0 10px!important;padding:0!important;
  color:#363636!important;font-size:20px!important;font-weight:700!important;line-height:1.7!important
}
body.tpl-shangmao .page-wrap .xypg-news-detail .news-cover{margin:0 0 18px;text-align:center}
body.tpl-shangmao .page-wrap .xypg-news-detail .news-meta{
  margin-bottom:20px;padding:0;border:0;border-bottom:1px dashed #cfcfcf;
  color:#9e9e9e;font:14px/35px Arial;overflow:hidden
}
body.tpl-shangmao .page-wrap .xypg-news-detail .news-meta span{display:inline-block;margin-right:20px}
body.tpl-shangmao .page-wrap .xypg-news-detail .news-content{color:#333;font-size:14px;line-height:1.7}
body.tpl-shangmao .page-wrap .xypg-news-detail .news-content p{margin:10px 0 20px;line-height:24px}
body.tpl-shangmao .page-wrap .xypg-news-detail .news-share{display:none}
body.tpl-shangmao .page-wrap .xypg-news-detail .news-extra-row{margin-top:15px;padding:10px;overflow:hidden;border:1px solid #eee;color:#666;font-size:14px}
body.tpl-shangmao .page-wrap .xypg-news-detail .news-extra-row span{float:left;margin-right:8px;color:#007ec5}
body.tpl-shangmao .page-wrap .xypg-news-detail .news-extra-row a{color:#666}
body.tpl-shangmao .page-wrap .xypg-news-detail .news-extra-row a:hover{color:#007ec5}

@media(max-width:1450px){.container-fluid{width:1200px}}
@media(max-width:1430px){
  body.tpl-shangmao .x-news .x-news-right>li+li{margin-top:26px}
  body.tpl-shangmao .x-news .x-news-right .news-date{padding-top:0;padding-bottom:0}
}
@media(max-width:1200px){
  .container-fluid{width:auto;max-width:none;margin:0 16px}
  .x-about-left{width:300px}
  .x-about-right{width:calc(100% - 330px)}
}
@media(max-width:1024px){
  body.tpl-shangmao .x-product .wz{margin-top:10px}
  body.tpl-shangmao .x-product .wz h3{font-size:16px}
}
@media(max-width:990px){
  .page-wrap-left{float:none;width:auto;margin:0 0 24px}
  body.tpl-shangmao .page-wrap .runtime-product-item{width:47%!important}
  body.tpl-shangmao .page-wrap .xypg-news-list .tit{border-bottom:0}
  body.tpl-shangmao .page-wrap .xypg-news-list .tit h3{padding-right:0!important;padding-bottom:10px!important}
  body.tpl-shangmao .page-wrap .xypg-news-list .tit .date,
  body.tpl-shangmao .page-wrap .xypg-news-list .date{position:static!important;padding-bottom:5px;border-bottom:1px solid #cbcbcb;color:#999}
  .detail-grid{grid-template-columns:1fr}
  .x-about-left{position:static;width:100%;margin-bottom:16px}
  .x-about-right{float:none;width:100%}
  .x-layout-menu,.x-layout-side{float:none;width:100%}
  .x-layout-side{margin-top:24px}
}
@media(max-width:768px){
  .x-header,.x-logo,.x-menu{float:none;width:auto;max-width:none}
  .x-logo{line-height:50px;text-align:center}
  .x-menu{text-align:center}
  .x-menu>li{float:none;display:inline-block}
  .x-menu>li>a{padding:0 12px;line-height:44px}
  .x-title h3{font-size:22px;line-height:36px}
  body.tpl-shangmao .x-product .x-product-item{width:50%}
  body.tpl-shangmao .x-product .x-product-itembg{padding:1px}
  body.tpl-shangmao .x-news .x-news-left,body.tpl-shangmao .x-news .x-news-right{
    display:block;float:none;width:100%
  }
  body.tpl-shangmao .x-news .x-news-right{margin-top:20px}
  body.tpl-shangmao .x-news .x-news-right .news-img{width:35%}
  body.tpl-shangmao .x-news .x-news-right .news-text{width:62%}
  .x-copyright,.x-region{float:none;text-align:left}
}
