﻿
@charset "utf-8";

html {font-size: 10px;-webkit-text-size-adjust: none;-webkit-tap-highlight-color: rgba(0,0,0,0); color:#333333; font-family:"Microsoft YaHei",Verdana,Arial,Helvetica,sans-serif;}


@media screen and (min-width: 320px) {html {font-size: calc(320px * 20 / 750);}}
@media screen and (min-width: 360px) {html {font-size: calc(360px * 20 / 750);}}
@media screen and (min-width: 375px) {html {font-size: calc(375px * 20 / 750);}}  
@media screen and (min-width: 400px) {html {font-size: calc(400px * 20 / 750);}}
@media screen and (min-width: 414px) {html {font-size: calc(414px * 20 / 750);}} 
@media screen and (min-width: 440px) {html {font-size: calc(440px * 20 / 750);}}
@media screen and (min-width: 480px) {html {font-size: calc(480px * 20 / 750);}}
@media screen and (min-width: 520px) {html {font-size: calc(520px * 20 / 750);}}
@media screen and (min-width: 560px) {html {font-size: calc(560px * 20 / 750);}}
@media screen and (min-width: 600px) {html {font-size: calc(600px * 20 / 750);}}
@media screen and (min-width: 640px) {html {font-size: calc(640px * 20 / 750);}}
@media screen and (min-width: 750px) {html {font-size: 20px;}}

.nodata{ text-align:center;font-size: 1.5rem;    letter-spacing: 0.2rem;color: #999999;}
input[type="text"],input[type="button"], input[type="submit"], input[type="reset"],input[type="number"] {
-webkit-appearance: none; border-radius:unset;}
textarea,select {-webkit-appearance: none;}
input[disabled],button[disabled]{  border: 1px solid #DDD!important; background-color: #F5F5F5!important; color:#ACA899!important;}

/*兼容设置*/
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
color: #999999;
}

input:-moz-placeholder, textarea:-moz-placeholder {
color:#999999;
}

input::-moz-placeholder, textarea::-moz-placeholder {
color:#999999;
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
color:#999999;
}

/*改变苹果原有样式*/
input[type="text"],input[type="button"], input[type="submit"], input[type="reset"] {
    -webkit-appearance: none;}
    textarea {-webkit-appearance: none;}  

.container{
    width: 100%;
    max-width: 640px;margin: 0 auto;
    min-width: 320px;
    overflow:hidden;
    position:relative;
}

/*格式化*/
#content p img{ width:100%;display:block; margin:0 auto; max-width:560px;}
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td, span, input, textarea {margin:0;padding:0;}
body{  background:#ffffff;} 
li, ol { list-style:none; }
ins { text-decoration:none; }
i, em { font-style:normal; }
a { text-decoration:none; color:#333333;}
a:hover { cursor:pointer; text-decoration:none;}
a:active{star:expression(this.onFocus=this.blur());}
:focus{outline:0;}
.clear { clear:both; line-height:0px; overflow:hidden; zoom:1; font-size:0px; content:'.';}
.clearfix:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}
img{ padding:0; margin:0;}
a img { border:none; }
input,textarea{ border:none; font-size:1.2rem;}
h1, h2, h3, h4, h5, h6{ font-weight:normal; font-size:1.2rem;}


/*排版通用*/
.f-mm{ margin-left:auto; margin-right:auto;}/*居中对齐*/
.f-fl{ float:left;} /*左浮动*/
.f-fr{ float:right;} /*右浮动*/
.f-tr{ text-align:right;} /*右对齐*/
.f-tl{ text-align:left;} /*左对齐*/
.f-tc{ text-align:center;} /*中间对齐*/
.f-pr{ position:relative;} /*定位*/
.f-di{ display:inline;}

/*显示2行标题 */
.cols2{display:-webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp:2;  overflow: hidden; text-overflow: ellipsis;}
.cols3{display:-webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp:3;  overflow: hidden; text-overflow: ellipsis;}


/*杂项*/
.u-co-bt{ border-radius:4px; /*css3圆角*/ width:80px; height:26px; line-height:26px; display: inline-block; vertical-align: middle;  padding-top:1px;}/*提交按钮样式*/
.u-co-bt.z-spe{ width:100%;}
.u-lico{ width:24px; height:24px; border-radius:4px;  /*css3圆角*/ background:#000; padding:10px;opacity: 0.8; position:relative; left:50%; margin:10px 0 10px -14px; box-shadow:0 0 3px #2d2d2d;}/*等待载入*/
.fs15{font-size:1.25rem;} /*15号字体*/
.fs12{font-size:1rem;} /*12号字体*/
.emptyData{display: block;text-align: center;line-height: 4rem;margin: 2rem;padding:2rem;border: 0.05rem dashed #dedede;font-size: 1.6rem;width:100%;color: #999999!important;}

/*开屏秀*/
.pageShare img{ display:block; width:0px; height:0px;}
.loading{position:fixed;width:100%;height:100%; top:0;display:none; max-width:750px; min-width:320px; z-index:99999; font-size:1.2rem;}
.loading #showNext{ line-height:2.25rem; display:none; color:#ffffff; border:0.05rem solid #e85c21; background:#e85c21; border-radius:0.5rem; padding-left:1rem; padding-right:1rem; text-align:center; position:absolute; right:1rem; top:1rem; z-index:99;font-size:1.2rem;}
.wrap{ opacity:0;}
.homeShow{ animation: fade 0.8s ease both;-webkit-animation: fade 0.8s ease both; }


/*动画效果*/
@-webkit-keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
    }
  
    100% {
      opacity: 1;
      display:block;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  @keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
    }
  
    100% {
      opacity: 1;
      display:block;
      -webkit-transform: none;
      transform: none;
    }
  }
  

.cur.fadeInRight{ animation: fadeInRight 0.8s ease; -webkit-animation: fadeInRight 0.8s ease; animation-fill-mode: forwards; }

@-webkit-keyframes returnToNormal {
    from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); }
    to { opacity: 1; -webkit-transform: none; transform: none; }
}
@keyframes returnToNormal {
    from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); }
    to { opacity: 1; -webkit-transform: none; transform: none; }
}

@keyframes fade {
    from{
      opacity: 1;
     display:block;
    }
  
    to 
    {
      display:none;
      opacity: 0;
      height:0;
    }
  }
  
  .fade {
    -webkit-animation-name: fade;
    animation-name: fade;
  }


/* -- 页面整体布局 -- */
.wrap{min-width:320px; max-width:750px; margin:0 auto; overflow:hidden; position:relative;} /*网站首页宽度*/
.wrap img{ width:100%;}


/*------通用部件-----*/



/* 内页分页样式  */
.g-page{ padding-bottom:2rem; padding-top:1rem;}
.g-page .u-pup,.g-page .u-pne,.g-page .u-sa{border-radius:0.25rem;display:inline-block;font-size:1.2em; height: 2.5rem;line-height: 2.5rem; text-align: center;width:25%;vertical-align: middle;} /*上一页样式*/
.g-page p{ width:10%; display: inline-block;}
.g-page .pager-select{display:inline-block;padding:0 1rem; margin: 0 0.5rem; width:10%; height: 2.5rem; line-height:2.5rem; position:relative; vertical-align: middle;}
.g-page .page_number{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events:none;  border-radius: 0.5rem; box-shadow: 0 0 0.25rem #333333 inset; text-indent: -1rem;}
.g-page .page_number:before{ width: 0; height:0; content: ""; position: absolute; border-top: 0.5rem solid #aaa; border-left: 0.5rem solid rgba(0,0,0,0);border-right: 0.5rem solid rgba(0,0,0,0); left: 50%; margin-left:1rem; top: 1rem;}
.g-page .pager-select .page_number span{ padding: 0 0.1rem; font-weight: bold;}
.g-page .select_box{ width: 100%; height: 100%; opacity: 0; position: absolute; z-index: 0; left: 0; top: 0; text-align: center;}
/* 内页分页样式  */





/*内页面包屑导航样式 开始*/
.m-btit {line-height: 3rem; padding-left: 0.916rem; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;border-top:1px solid #d9d9d9; box-shadow:0 1px #ffffff; position:relative; background-color:#f6f6f6;background-image: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#eaeaea));
	background-image: -webkit-linear-gradient(top, #f6f6f6, #eaeaea);  /*背景渐变，针对苹果浏览器写的兼容*/
	background-image: -moz-linear-gradient(top, #f6f6f6, #eaeaea); /*背景渐变，针对火狐浏览器写的兼容*/
	background-image: -o-linear-gradient(top, #f6f6f6, #eaeaea); /*背景渐变，针对欧朋浏览器写的兼容*/
	background-image: -ms-linear-gradient(top, #f6f6f6, #eaeaea); /*背景渐变，针对手机微软浏览器写的兼容*/
	background-image: linear-gradient(top, #f6f6f6, #eaeaea); /*背景渐变，正常的写法*/
	border-bottom:1px solid #d9d9d9; } /*内页面包屑导航背景*/
.m-btit:before{content:""; /*配合:before这个属性，写 before的时候一定要加上去*/
	position:absolute;
	left:0;
	top:0;
	width:100%;
	border-top: 1px solid #ffffff;}	/*内页面包屑导航背景上面的线条*/
.m-btit span{ padding:0 8px; position:relative; height:100%; top:-12px; display:inline-block;}
.m-btit span:before{content:""; /*配合:before这个属性，写 before的时候一定要加上去*/
	position:absolute;
	background:#7c7c7c;
	width:8px;
    height:8px;
    left:2px;
	top:3px;
	z-index:10;
	-moz-transform: rotate(45deg); /*角度45度，针对火狐浏览器写的兼容*/
	-o-transform: rotate(45deg); /*角度45度，针对欧朋浏览器写的兼容*/
	-webkit-transform: rotate(45deg); /*角度45度，针对苹果浏览器写的兼容*/
	transform: rotate(45deg);}  /*角度45度，内页面包屑箭头样式*/
.m-btit span:after{content:""; /*配合:before这个属性，写 before的时候一定要加上去*/
	position:absolute;
	width:8px;
    height:8px;
    left:1px;
	top:3px;
	z-index:11; background-color:#f2f2f2;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#eeeeee)); /*针对苹果老式浏览器写的兼容*/
	background-image: -webkit-linear-gradient(top, #f2f2f2, #eeeeee); /*背景渐变，针对苹果浏览器写的兼容*/
	background-image: -moz-linear-gradient(top, #f2f2f2, #eeeeee); /*背景渐变，针对火狐浏览器写的兼容*/
	background-image: -o-linear-gradient(top, #f2f2f2, #eeeeee); /*背景渐变，针对欧朋浏览器写的兼容*/
	background-image: -ms-linear-gradient(top, #f2f2f2, #eeeeee); /*背景渐变，针对手机微软浏览器写的兼容*/
	background-image: linear-gradient(top, #f2f2f2, #eeeeee);  /*背景渐变，正常的写法*/
	-moz-transform: rotate(45deg); /*角度45度，针对火狐浏览器写的兼容*/
	-o-transform: rotate(45deg); /*角度45度，针对欧朋浏览器写的兼容*/
	-webkit-transform: rotate(45deg); /*角度45度，针对苹果浏览器写的兼容*/
	transform: rotate(45deg);	} /*角度45度，内页面包屑箭头样式*/
/*内页面包屑导航样式 结束*/	

/*谢书烈  2019-08-28添加*/
body,html{ width:100%; max-width:750px; min-width:320px; margin:0 auto;}
.g-hd img,.g-ft img{ width:100%; display:block; }
  /*分享图标*/
.pageShare img{ display:block; width:0px; height:0px;}

/*404样式一*/
.notfound_bg p{ display:block; font-size:10rem; line-height:150%; letter-spacing:0.5rem;}
.notfound dl{display: flex;align-items: center;    justify-content: center; flex-flow: row wrap; padding-left:4rem; padding-right:4rem;}
.notfound dl dt{text-align:left; display:inline-block;}
.notfound dl dd{ display:inline-block;}
.notfound dt em{ color:#6f6f6f; font-size:1rem; word-spacing: 0.25rem; font-weight:bold; text-transform:uppercase; display:block;}
.notfound dt em strong,.notfound dt b strong{ color:#0073bd;}
.notfound dt b{ display:block; font-size:3.5rem; color:#333333; padding-top:0.4rem; padding-bottom:0.4rem;}
.notfound dt p{ font-size:1.3rem; color:#666666; display:block; margin-bottom:1rem;}
.notfound dt a{ display:inline-block; width:7.75rem; text-align:center; font-size:1rem; height:2.5rem; line-height:2.5rem; color:#ffffff; margin-right:1rem; border-radius:0.2rem; background:#333333;}
.notfound dt a:hover{ opacity:0.8;}
.notfound dt .home{ background:#0073bd;}
.notfound dt i{ display:block; margin-top:1rem; margin-bottom:0.6rem; color:#666666;}
.notfound dt span{ font-size:1.4rem; color:#333333; font-weight:bold; display:block; background:url(/Skins/Default/Img/404/tel.png) no-repeat left center; background-size:auto 100%; line-height:1.75rem; padding-left:2rem }
.notfound dd{}

/*站点地图*/
.g-map .m-con{ padding:0 10px 10px 10px;}
.g-map .main_tit{ line-height:30px; font-size:16px; height:30px; text-shadow:1px 1px 1px #ffffff;text-indent:10px; margin:10px 0;}
.g-map .map_list{border:1px solid #ddd; border-radius:5px; width:100%; overflow:hidden; box-shadow:2px 1px 3px #ddd;}
.g-map .map_list a li{ float:left; display:table-cell; width:33%; padding:10px 0; text-align:center; white-space:nowrap; overflow:hidden; position:relative; text-overflow: ellipsis;}
.g-map .map_list a li:before{content:""; position:absolute;right:0; top:0; height:100%;border-right:1px dashed #ddd;}
.g-map .map_list a li:after{content:""; position:absolute;bottom:0; left:0; width:100%; border-bottom:1px dashed #ddd;}
.g-map .map_list a:nth-child(3n) li:before{ border-right:0;}

/*----------------------------------------------------------------------------------------------------------------------------*/
/*--------------------做单时把下面的头部和底部样式删除，换成自己写的样式，样式命名按规范命名----------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/

/*默认下拉导航
.erji{display: none;position:fixed; right:0; top:0; width:100%; z-index: 99999; max-width:640px; height:100%; padding:6rem 0;background: rgba(0,0,0,0.8);}
.erji .ul a{line-height: 4rem;height: 4rem; border-bottom:rgba(255,255,255,0.25) 1px solid; width: 100%;text-align: center;}
.erji .ul a:last-child{border-bottom:none;}
.erji .ul a{font-size: 1.4rem;color: #ffffff;display: block;width: 100%;}
.erji .cs{ display:block; position:absolute; right:0.8rem; top:0.8rem; width:20px; height:20px;}
*/


#Details_Page{}
body{padding-top:5rem;}


/*内页底部浮动导航*/
.pro-nav{position:fixed;width:100%;text-align:center;bottom:4.08rem;left:0;z-index:100;opacity: 0.8;}
.pro-nav .more{display:block;height:3rem;line-height:3rem;background:#222; background-size: contain; font-size:1rem;color:#ffffff;}
.pro-nav-list{position:absolute;width:100%;bottom:100%;left:-100%;background:#222; background-size: contain; -webkit-transition:left .3s linear;transition:left .3s linear;}
.pro-nav-list li a{display:inline-block;width:100%;height:2.5rem;line-height:2.5rem;border-bottom:1px solid #333333;text-align:center;color:#ffffff;font-size:0.83rem; box-sizing:border-box;}
.pro-nav-list li span{ display:inline-block; position:absolute; right:0; z-index:99; width:25%; padding-right:5%; color:#ffffff; text-align:right; height:2.5rem;line-height:2.5rem; border-bottom:1px solid #444;font-size:0.83rem; border-bottom:none; }
.pro-nav-list li a.cur{ color:orange; font-weight:bold;}
.pro-nav-list li a:first-child{border-top:0;}
.pro-nav-list.open{left:0;}

.pro-nav-list li{ position:relative; font-size:0;}
.pro-nav-list li p{ display:none; position: absolute;left: 100%;bottom: 2.5rem;width: 100%; background:rgba(0,0,0,0.7);}
.pro-nav-list li p span{ display:block;text-align:left;position: static;text-indent: 2rem;font-size: 1.5rem;border-bottom: 1px solid #666666;width: 100%;}
.pro-nav-list li p a{ display:inline-block; width:50%; border-right:1px solid #333333; box-sizing:border-box;}
.pro-nav-list li p.odd a:last-child{ width:100%; border-right:none;}
.pro_menu a{ width:50%;display: inline-block;float: left;}



/*----------------------------------------------------------------------------------------------------------------------------*/
/*--------------------头部样式，底部样式替换----------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------*/




/******************算定义样式 http://www.xiaobiu.com 2020/11/10 0:01:08**********************/
body { font-family: Arial; padding-top: 0;}
.hd { height: 4.75rem; position: relative; z-index: 19; background: #fff; line-height: 0; }
.hd .h_con { height: 4.75rem; padding: 0 2.67%; box-sizing: border-box; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; }
.hd img { max-width: 100%; }
.logo { width: 14.45rem; }
.navbtn { width: 2.3rem; height: 1.8rem; cursor: pointer; }
.menu2 { position: relative; z-index: 9; }
.menu2 .slideMenu { height: 100%; width: 100%; height: calc(100vh - 4.75rem); z-index: 80; background: rgba(4,7,20,0.85); overflow: hidden; position: absolute; right: 0; left: 0; transition: transform 1s; -webkit-transition: transform 1s; padding-bottom: 2rem; box-sizing: border-box; padding: 5.2rem 11.87% 0; display: flex; display: -webkit-flex; justify-content: space-evenly; flex-direction: column; display: none; }
.menu2 .slideMenu .h_action { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; margin-top: 8.2rem; }
.menu2 .slideMenu .search { width: 19.6rem; height: 3.3rem; border-radius: 0.25rem; border: 1px solid #c8cbd5; box-sizing: border-box; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; margin-right: 2.4rem; }
.menu2 .slideMenu .search input { display: block; border: none; background: none; outline: none; }
.menu2 .slideMenu .search input[type="text"] { font-size: 1rem; color: #fff; line-height: 3.2rem; flex-grow: 1; }
.menu2 .slideMenu .search input[type="submit"] { width: 4.2rem; background: url(/mobile/images/s_btn.png) no-repeat center; background-size: 1.7rem auto; font-size: 0; }
.menu2 .slideMenu .mail { display: block; width: 2.05rem; }
.menu2 .slideMenu .quote { margin-top: 2.05rem; }
.quote { display: block; width: 12.7rem; background: #f39800; border-radius: 0.25rem; position: relative; box-sizing: border-box; transition: all 0.5s ease; text-transform: uppercase; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; }
.quote span { display: block; font-size: 1.3rem; color: #fff; line-height: 3.1rem; padding-left: 0.5rem; }
.quote i { display: block; border-style: solid; border-color: transparent transparent transparent #fff; border-width: 0.45rem 0.9rem; margin-left: 0.5rem; }
.quote:hover { background: #ffa613; letter-spacing: 0.5px; }
.menu2 .slideMenu li { color: #fff; line-height: 4.5rem; font-size: 1.3rem; }
.menu2 .slideMenu li a { color: #fff; display: block; line-height: 4.5rem; position: relative; }
.menu2 .slideMenu li a:before { position: absolute; content: ""; border-style: solid; border-color: transparent transparent transparent #fff; border-width: 0.45rem 0.9rem; left: -1rem; top: 1.7rem; opacity: 0; transition: all 0.5s ease; }
/* .menu2 .slideMenu li.cur a,.menu2 .slideMenu li:hover a { padding-left: 1.5rem; } */
/* .menu2 .slideMenu li.cur a:before,.menu2 .slideMenu li:hover a:before { opacity: 1; left: 0; } */
.menu2 .slideMenu ul { overflow: hidden; }
.g-ft { background: #080e2a; }
.f_con { height: 18.2rem; padding: 3.6rem 2.67% 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: relative;margin-bottom: 4.9rem;}
.g-ft img { max-width: 100%; display: block; }
.f_menu { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; padding-bottom: 2.65rem; border-bottom: 1px solid #5a6687; margin-bottom: 2.85rem; position: relative; }
.f_menu a { display: block; font-size: 1.4rem; color: #fff; line-height: 2.4rem; font-weight: bold; }
.f_sms { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; }
.f_sms a { display: block; width: 3.35rem; margin: 0 1.7rem; }
.f_sitebar { position: fixed; right: 2.13%; bottom: 10%; z-index: 99; }
.f_sitebar .tel,.f_sitebar .go_top { display: block; width: 3.65rem; height: 3.65rem; background: #132162; box-shadow: 0rem 0.65rem 3.45rem 0.2rem rgba(50,33,33,0.19); border-radius: 50%; margin-bottom: 1rem; cursor: pointer; }
.f_nav { height: 4.9rem; background: #132162; min-width: 320px; max-width: 750px; width: 100%; position: fixed; bottom: 0; z-index: 100; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0 4.27%; }
.f_nav li img { width: 2rem; display: block; padding: 0.7rem 0 0.55rem; margin: 0 auto; }
.f_nav li a { height: 4.9rem; font-size: 0.9rem; color: #fff; line-height: 1; display: block; text-align: center; font-weight: bold; text-transform: uppercase; }