@charset "UTF-8";

:root {
    --primary-color: rgb(202, 20, 29);
    --border-color: rgb(121, 121, 121);
    --font-color: #000000;
    --bg-color: #ececec;
    --content-padding:calc((100% - 1564px) / 2);
    --header-height: 135px;
}

@font-face {
  font-family: 'CN-Bold';
    src: url('/static/web/font/SourceHanSansCN-Bold.woff2');
    /*src: url('/static/web/font/SourceHanSansCN-Bold.otf');*/
}
@font-face {
  font-family: 'CN-ExtraLight';
    src: url('/static/web/font/SourceHanSansCN-ExtraLight.woff2');
    /*src: url('/static/web/font/SourceHanSansCN-ExtraLight.otf');*/
}
@font-face {
  font-family: 'CN-Heavy';
    src: url('/static/web/font/SourceHanSansCN-Heavy.woff2');
    /*src: url('/static/web/font/SourceHanSansCN-Heavy.otf');*/
}
@font-face {
  font-family: 'CN-Light';
    src: url('/static/web/font/SourceHanSansCN-Light.woff2');
    /*src: url('/static/web/font/SourceHanSansCN-Light.otf');*/
}
@font-face {
  font-family: 'CN-Medium';
    src: url('/static/web/font/SourceHanSansCN-Medium.woff2');
    /*src: url('/static/web/font/SourceHanSansCN-Medium.otf');*/
}
@font-face {
  font-family: 'CN-Normal';
    src: url('/static/web/font/SourceHanSansCN-Normal.woff2');
    /*src: url('/static/web/font/SourceHanSansCN-Normal.otf');*/
}
@font-face {
  font-family: 'CN-Regular';
    src: url('/static/web/font/SourceHanSansCN-Regular.woff2');
    /*src: url('/static/web/font/SourceHanSansCN-Regular.otf');*/
}

.main{max-width: 1564px;margin: 0 auto;}
html{font-family:sans-serif;-webkit-text-size-adjust:100%;font-size: 24px;}
*{padding:0;margin:0;-webkit-box-sizing:border-box;box-sizing:border-box;outline:0;-webkit-tap-highlight-color:transparent}

a:hover{color: var(--font-color);}
body {
    max-width: 100%;
    margin: 0 auto;
    font-size: 16px;
    line-height: 1.2;
    background-color: #fff;
    -webkit-overflow-scrolling: touch;
    /* overflow: hidden; */
    color: var(--font-color);
    /* letter-spacing: 1px; */
    /* word-spacing: 1px; */
    font-family: CN-Light;
    overflow-y: auto;

}
html,
body {height: 100%;}

h1{
  font-weight: 300;
}
h2 {
  font-family: CN-Bold;
  font-size: 36px;
}

.txt-line{ text-decoration: line-through;}
/*对齐，浮动*/   
.tc{ text-align:center;}
.tr{ text-align: right;}
.tl{ text-align: left;}
.fl{ float:left;}
.fr{  float: right;}
.clearfix:before,.clearfix:after{content:""; display:table;clear:both;} 
ul,li{
  list-style: none;
}
table{border-spacing:0;border-collapse:collapse;}
td,th{padding:0}
td{line-height: 30px;text-align: left;padding-left: 20px;}
.inbl{display: inline-block;width:50%}
/*文字超出隐藏*/
.ellipsis{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.ellipsisTwo{
  overflow: hidden;
  -webkit-line-clamp: 2;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}
::-webkit-scrollbar{
    width: 8px;
    height: 8px;
    background: #ccc;
}
::-webkit-scrollbar-thumb{
    border-radius: 10px;
    background: #999;
    cursor: pointer;
}
::-webkit-scrollbar-thumb:hover{
    background: #666;
}
/*ie*/
body{
  -ms-scroll-chaining: chained;
  -ms-overflow-style: none;
  -ms-content-zooming: zoom;
  -ms-scroll-rails: none;
  -ms-content-zoom-limit-min: 100%;
  -ms-content-zoom-limit-max: 500%;
  -ms-scroll-snap-type: proximity;
  -ms-scroll-snap-points-x: snapList(100%, 200%, 300%, 400%, 500%);
  -ms-overflow-style: none;
}
.box-shadow{
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
}
.icon-tags{
    cursor: pointer;
    font-size: 24px;
    vertical-align: middle;
  }

.tips-info{
    font-size: 12px;
    color: #ccc;
  }
  .bg-base{
    background: rgba(215, 215, 215, 0.4980392156862745);
  }
  .bg-white{
    background: #fff;
  }

.mb10{
  margin-bottom: 10px;
}
.mt10{
  margin-top: 10px;
}
.ml10{
  margin-left: 10px;
}
.mr10{
  margin-right: 10px;
}

.mb20{
  margin-bottom: 20px;
}
.mt20{
  margin-top: 20px;
}
.ml20{
  margin-left: 20px;
}
.mr20{
  margin-right: 20px;
}

.pt10{padding-top: 10px;}
.pb10{padding-bottom: 10px;}
.pl10{padding-left: 10px;}
.pr10{padding-right: 10px;}

.pt20{padding-top: 20px;}
.pb20{padding-bottom: 20px;}
.pl20{padding-left: 20px;}
.pr20{padding-right: 20px;}

.pt5{padding-top: 5px;}
.pb5{padding-bottom: 5px;}
.pl5{padding-left: 5px;}
.pr5{padding-right: 5px;}

.pd10{padding: 10px;}
.pd20{padding: 20px;}

.row{display: flex;}
.just-sb {justify-content: space-between;}

.middle{
  vertical-align: middle;
}
.inline-block{
  display: inline-block;
}

.fontsize12{
  font-size: 12px;
}

.fontsize20{
  font-size: 20px;
}

.fontsize16{
  font-size: 16px;
}
.fontsize25{
  font-size: 25px;
}
.fontsize30{
  font-size: 30px;
}

.cursor{
  cursor: pointer;
}

.error{
  color: #e74c3c;
}
.input-error{
  border-color: #e74c3c !important;
}
.bold{
  font-weight: bold;
}

.primary-color {
  color: var(--primary-color);
}

.head-bg-img {
  height: 620px;
  width: 100%;
}


/* --------------------------------------------------------------------------------------------------------------------------- */
/* layui 相关样式覆盖 */

.layui-btn {
  background: #fff;
  color: #000;
  border: 1px solid #000;
  font-size: 20px;
}

.layui-btn:hover {
  background: var(--primary-color);
  border-color: var(--primary-color);
  color: #fff;
}

.btn-active {
  background: var(--primary-color);
  border-color: var(--primary-color);
  color: #fff;
}

.layui-laypage a, .layui-laypage button, .layui-laypage input, .layui-laypage select, .layui-laypage span {
  border: none;
}

.layui-laypage a:hover {
  color: var(--primary-color);
}

.layui-laypage .layui-laypage-curr .layui-laypage-em {
  background: #fff;
}
.layui-laypage .layui-laypage-curr em {
  color: var(--primary-color);
}
.layui-laypage-next em, .layui-laypage-prev em, .layui-laypage a, .layui-laypage span, .layui-laypage .layui-icon {
  font-size: 20px;
}
.layui-form-select dl dd.layui-this {
  color: var(--primary-color);
}

.layui-layer-dialog .layui-layer-content {
  font-size: 18px;
}

.img-scale {
  transform: scale(1);
  transition: all .5s;
}

.img-scale:hover {
  transform: scale(1.1);
}

.ov-hd {
  overflow: hidden;
}

.breadcrumb.menu a:hover {
  color: var(--primary-color);
}



/* --------------------------------------------------------------------------------------------------------------------------- */
/* mobile */

.mobile-pd {
  padding: 0 15px;
}

.nav-active {
  color: var(--primary-color);
}