@charset "utf-8";

::-webkit-scrollbar{width: 7px;}
::-webkit-scrollbar-track{background: #fff;}
::-webkit-scrollbar-thumb{background: #000;}
::-webkit-scrollbar-thumb:vertical:hover{background: #464646;}

body,td,th,input,textarea,select{font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Microsoft YaHei','PingFang SC', 'Source Han Sans SC', 'Noto Sans CJK SC', 'WenQuanYi Micro Hei', 'sans-serif'; color:#5f5f5f; outline:none;}
html{font-size:62.5%;}
html,body{background:#fff; height:100%;}
html,body,form{margin:0;}
img{border:0px none; vertical-align:middle; outline:none; max-width:100%; width:auto; height:auto;}
ul,dl{display:block; margin:0; padding:0;}
ul,dl{display:block; margin:0; padding:0;}
dd{margin:0; padding:0;}
li{list-style:none;}
p{display:block; margin:0; padding:0;}
a,button,input,img,div,p,li,span{border:0px none; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent;}
a{text-decoration:none; color:#777177; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent;}
a:active{color:#226e70;}
div:after, ul:after, li:after, p:after, dl:after{content:''; display:block; height:0; clear:both; font-size: 0;}
#think_page_trace_open{z-index:999998;}
*{line-height: 1;}
mark{display:inline-block;}


#head{position: fixed; z-index: 99; width: 100%; height: 88px; left: 0; top: 0; background: #fff; box-shadow: 0 5px 10px rgba(0,0,0, .07); transition: height .24s;}
#head .logo{margin-left: 50px; float: left; height: 60px;}
#head .logo>a{display: block; margin-top: 10px; text-align: center; font-size: 1.5rem; color: #2b2b2b; letter-spacing: .5rem;}
#head .logo>a>img{height: 51px; display: block; margin: auto auto .4rem auto;}
#head .logo>a>span{display: block; text-align: center; transition: opacity .25s;}

#head.small{height: 72px;}
#head.small .logo>a>span{opacity: 0;}

#head .nav-btn, #head .nav{display: none;}

#head .menu{float: left; margin-left: 70px;}
#head .menu>li{display: block; float: left; margin-left: 20px; margin-right: 20px; position: relative;}
#head .menu>li>a{display: block; font-size: 1.7rem; color: #2b2b2b; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei'; line-height: 88px; position: relative; transition: color .3s, line-height .15s;}
#head .menu>li>a::after{content: ''; display: block; width: 0; height: 1px; background: #ec0000; position: absolute; left: 50%; bottom: 28px; transition: all .3s;}
#head .menu>li:hover>a, #head .menu>li.active>a{color: #ec0000;}
#head .menu>li:hover>a::after{width: 100%; left: 0;}
#head .menu>li>div{overflow: hidden; height: 0; min-width: 1000px; position: absolute; left: 3px; top: 88px; transition: all .35s;}
#head .menu>li>div>a{display: inline-block; font-size: 1.6rem; margin-right: 30px; line-height: 70px; color: #fff; transition: all .2s; position: relative; z-index: 2;}
#head .menu>li>div>a:hover{opacity: .8;}
#head .menu>li>div::before{content: ''; display: block; width: 100%; height: 0; background: #d90000; position: fixed; left: 0; top: 88px; z-index: 1; transition: all .35s;}
#head .menu>li:hover>div{height: 70px;}
#head .menu>li:hover>div::before{height: 70px;}

#head.small .menu>li>a{line-height: 72px;}
#head.small .menu>li>a::after{bottom: 22px;}
#head.small .menu>li>div{top: 72px;}
#head.small .menu>li>div::before{top: 72px;}


#head .right{float: right; padding-right: 50px; line-height: 88px; font-size: 1.6rem; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei'; color: #1c1c1c; transition: line-height .16s;}
#head .icon-Phone-{font-size: 2.8rem; vertical-align: middle; margin-right: .6rem;}
#head .icon-zhongyingwen{margin-left: 1.2rem; font-size: 2.8rem; position: relative; top: .5rem;}
#head .right a{transition: all .3s;}
#head .right a:hover{color: #ec0000;}

#head.small .right{line-height: 72px;}

@media (max-width:1440px){
  #head .logo{margin-left: 40px;}
  #head .menu{margin-left: 50px;}
  #head .menu>li{margin-left: 20px; margin-right: 18px;}

  #head .right{padding-right: 40px; font-size: 1.5rem;}
}
@media (max-width:1366px){
  #head .logo{margin-left: 30px;}
  #head .menu{margin-left: 30px;}
  #head .menu>li{margin-left: 16px; margin-right: 16px;}
  #head .menu>li>a{font-size: 1.6rem;}
  #head .menu>li>div>a{font-size: 1.5rem;}

  #head .right{padding-right: 30px; font-size: 1.5rem;}
}
@media (max-width:1279px){
  #head{height: 66px;}
  #head .logo{width: 80px; margin: auto auto auto 10px; float: none; height: 50px;}
  #head .logo>a{margin-top: 8px; font-size: 1.2rem; letter-spacing: .5rem;}
  #head .logo>a>img{height: 36px; display: block; margin: auto auto .4rem auto; position: relative; left: -2px;}

  #head .nav-btn{display: block; width: 66px; height: 66px; position: absolute; z-index: 2; right: 0; top: 0;}
  #head .nav-btn>span{width: 22px; height: 2px; background: #2b2b2b; display: block; margin: 32px auto; transition: all .25s;}
  #head .nav-btn:before{position: absolute; left: 22px; top: 26px; width: 22px; height: 2px; background: #2b2b2b; content: ''; display: block; transition: top .2s .2s, transform .2s;}
  #head .nav-btn:after{position: absolute; left: 22px; top: 38px; width: 22px; height: 2px; background: #2b2b2b; content: ''; display: block; transition: top .2s .2s, transform .2s;}
  #head .nav-btn.active>span{opacity: 0;}
  #head .nav-btn.active:before{top: 32px; transform: rotate(45deg); transition: top .2s, transform .2s .2s;}
  #head .nav-btn.active:after{top: 32px; transform: rotate(-45deg); transition: top .2s, transform .2s .2s;}

  #head .nav{display: block; position: fixed; left: 0; right: 0; top: 66px; bottom: 0; z-index: 98; background: rgba(0,0,0,.8); color: #fff; padding: 20px; transform: translateX(-100%); transition: all .6s;}
  #head .nav.active{transform: translateX(0);}
  #head .nav>a{color: #fff; font-size: 1.6rem; vertical-align: middle;}
  #head .nav .list{margin-top: 20px;}
  #head .nav .list>a{display: block; color: #fff; border-bottom: 1px solid rgba(255,255,255,.2); font-size: 1.6rem; padding: 15px 0 16px 0;}

  #head .menu{display: none;}
  #head .right{display: none;}
}


#btm{padding: 60px 100px 90px 100px; background: #fff; position: relative; z-index: 2;}
#btm .left{width: 50%; float: left;}
#btm .left dl{float: left; margin-right: 60px;}
#btm .left dl:last-child{margin-right: 0;}
#btm .left dl a{display: block; letter-spacing: .03rem;}
#btm .left dl dt{margin-bottom: 18px;}
#btm .left dl dt a{color: #2b2b2b; font-size: 2rem; font-weight: 300; transition: all .35s;}
#btm .left dl dd a{font-family: 'Microsoft Jhenghei', 'Microsoft YaHei'; font-size: 1.5rem; margin-bottom: 10px; transition: all .35s;}
#btm .left dl dt a:hover, #btm .left dl dd a:hover{color: #ec0000;}

#btm .right{width: 50%; float: right;}
#btm .right .l{width: 50%; float: left; padding-left: 100px; box-sizing: border-box;}
#btm .right .l .tit{font-size: 1.6rem; color: #2b2b2b;}
#btm .right .l .desc{font-size: 1.4rem; margin-top: 30px; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei';}
#btm .right .l .con{font-size: 1.4rem; margin-top: 13px; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei';}
#btm .right .l .con>p{margin-bottom: 10px;}
#btm .right .l .con a:hover{color: #ec0000;}

#btm .right .r{width: 50%; float: right;}
#btm .right .r .item{width: 120px; float: right; text-align: center;}
#btm .right .r .item p{font-size: 1.3rem; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei';}

@media (max-width:1440px){
  #btm{padding: 55px 60px 90px 60px;}
  #btm .left dl{margin-right: 50px;}
  #btm .left dl dt a{font-size: 1.8rem;}
  #btm .left dl dd a{font-size: 1.4rem;}
  #btm .right .l{width: 60%; padding-left: 80px;}
  #btm .right .r{width: 40%;}
}
@media (max-width:1366px){
  #btm{padding: 45px 30px 90px 30px;}
  #btm .left dl{margin-right: 40px;}
  #btm .left dl dt a{font-size: 1.7rem;}
  #btm .right .r{width: 40%;}
}
@media (max-width:1279px){
  #btm{padding: 40px 20px 40px 20px;}
  #btm .left{display: none;}
  #btm .right{width: 100%; float: none;}
  #btm .right .l{width: 100%; float: none; padding: 0;}
  #btm .right .l .tit{font-size: 2rem;}
  #btm .right .r{width: 100%; float: none; margin-top: 30px;}
  #btm .right .r .item{float: none; text-align: center;}
}


#foot{position: fixed; z-index: 99; width: 100%; height: 50px; bottom: 0; left: 0; background: #fff; padding-right: 50px; box-sizing: border-box; text-align: right; font-size: 1.3rem; font-family: 'Microsoft Jhenghei', 'Microsoft YaHei'; line-height: 50px; color: #2b2b2b; border-top: 1px solid #eee; transition: all .3s;}
#foot .copyright, #foot .advisory{margin-right: 50px; position: relative;}
#foot .copyright::after, #foot .advisory::after{content: ''; display: block; width: 1px; height: 15px; background: #666; position: absolute; right: -27px; top: 2px; transition: all .3s;}
#foot .advisory i{font-size: 2.8rem; position: relative; top: 5px; margin-right: 6px;}
#foot .advisory a, #foot .support a{color: #2b2b2b; transition: all .3s; display: inline-block;}
#foot .advisory a:hover, #foot .support a:hover{color: #ec0000;}
#foot .support a.beian{margin-left: 20px;}

#foot.black{background: #1c1c1c; color: #fff; border-top: 1px solid #1c1c1c;}
#foot.black .advisory a, #foot.black .support a{color: #fff;}
#foot.black .advisory a:hover, #foot.black .support a:hover{color: #ec0000;}
#foot.black .copyright::after, #foot.black .advisory::after{background: #ccc;}

@media (max-width:1366px){
  #foot .copyright, #foot .advisory{margin-right: 36px;}
  #foot .copyright::after, #foot .advisory::after{right: -20px;}
}
@media (max-width:1279px){
  #foot{position: relative; z-index: 1; height: auto; padding: 20px 20px 20px 20px; text-align: left;}
  #foot .copyright{display: block; font-size: 1.2rem; margin-bottom: -3px;}
  #foot .copyright, #foot .advisory{margin-right: 0;}
  #foot .copyright::after, #foot .advisory::after{display: none;}
  #foot .support{margin-left: 20px;}
  #foot .support a.beian{margin-left: 0; display: block; margin-top: -5px;}
}

/* 只显示一行 */
.ellipsis{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

/* 只显示两行 */
.ellipsis-line-2{
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* 只显示三行 */
.ellipsis-line-3{
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
}


#backbuttonstate{display: none;}

#getmore{height:47px; margin-top:10px; margin-bottom:30px; text-align:center;}

#getmore .loading-box {margin:0px 0 100px 0; height:47px; text-align:center; line-height:47px; display:none;}
#getmore .loading-box>div{width:12px; height:12px; background-color:#d90000; border-radius:100%; display:inline-block; animation:bouncedelay 1.4s infinite ease-in-out; animation-fill-mode:both; margin:0 3px;}
#getmore .loading-box .bounce1{animation-delay:-0.32s;}
#getmore .loading-box .bounce2{animation-delay:-0.16s;}
@keyframes bouncedelay{
  0%,80%,100% {transform: scale(0.0);}
  40%{transform: scale(1.0);}
}

#getmore .handle{padding:0 40px 0 50px; font-size:16px; color:#fff; background:#d90000; height:47px; line-height:45px; transition: all .2s; display:none;}
#getmore .handle>span{font-size:1rem; transform:scale(.7); display:inline-block; vertical-align:top; margin-left:.6rem;}
#getmore .handle:hover{background:#ec0000;}


