@charset "utf-8";
@import url("base.css");/* 重置&常用样式 */
@import url("fonts/custom.css"); /* 字体 */

/* 全局变量 */
:root{
   --max-width: 1440;
   --default-color__rgb: 34,34,34; /*#222*/
   --default-color: rgba(var(--default-color__rgb), 1);
   --default-color_333__rgb: 51,51,51; /*#33*/
   --default-color_333: rgba(var(--default-color_333__rgb), 1);
   --default-color_666__rgb: 102,102,102; /*#666*/
   --default-color_666: rgba(var(--default-color_666__rgb), 1);
   --primary-color__rgb: 207, 32, 27; /*#cf201b*/
   --primary-color: rgba(var(--primary-color__rgb), 1);
   --f-family: 'hm', sans-serif;
   --f-family__en: 'Barlow','hm', sans-serif;
   --main_line_height: 1;
   --button_height: 0.4rem;
   --transition: 0.3s;
   --header-height:.9rem;
}

/* 比例要求 */
/*基于屏幕尺寸自适应字体大小*/
/*超过1920px时，继续按比例增长*/
html{font-size: calc(100 / 1920 * 100vw);}
.container {max-width: calc(var(--max-width) / 100 * 1rem);}
@media (min-width:1440px) and (max-width: 1920px) {
   html{font-size: 100px;} 
}
@media (max-width: 1440px) {
   html:not(.view){font-size: calc(100 / 1600 * 100vw);}
}
@media (max-width: 1024px) {
   html:not(.view){font-size: calc(100 / 1000 * 100vw);}
}
@media (max-width: 480px) {
   html:not(.view){font-size: calc(100 / 540 * 100vw);}
   :root{
      --header-height:0.8rem;
   }
}


/*超过1920px时，比例不变  默认
html{font-size: 100px;}
main{max-width: 1920px;margin: 0 auto;}
.container {max-width: calc(var(--max-width) * 1px);}
@media (max-width: 1600px) {
   html:not(.view){font-size: calc(100 / 1600 * 100vw);}
}*/

body{font-size: var(--font-size__16); font-family:var(--f-family); line-height:  var(--main_line_height); color: var(--black-color);}
#canvas{position: fixed;left: 0;width: 100vw;height: 100vh;top: 0; pointer-events: none;z-index: 300;}
@media (max-width: 1024px) {
   #canvas{visibility: hidden;opacity: 0;}
}

/* Start
   ========================================================================== */
header{font-weight: var(--font-weight__l);position: fixed;left: 0;top: 0;width: 100%;z-index: 100;transition: 0.5s;}
header .container{height: var(--header-height);transition: 0.5s; position: relative;z-index: 90;}
header.has-inside,
header/*.has-whitebg*/{background-color: var(--white-color);box-shadow: 0 0.04rem 0.14rem 0.02rem rgba(26, 79, 154, 0.06);}

header .logo{ height: var(--header-height);}
header .logo img{max-height: 0.8rem;}
@media (min-width: 1025px) {
header.fixed{box-shadow: 0 0.04rem 0.14rem 0.02rem rgba(172, 172, 172, 0.06);background-color: var(--white-color);}
}
@media (max-width: 1024px) {
header .logo img{}
header{box-shadow: 0 0.04rem 0.14rem 0.02rem rgba(172, 172, 172, 0.06);background-color: var(--white-color); padding:.1rem 0;}
}

 .nav-sub{ border-radius: 0 0 0.06rem 0.06rem;transition: 0.5s;opacity: 0; clip-path: polygon(0 0,100% 0,100% 0,0 0); }
 .nav-sub::before{position: absolute; content: '';width: 100%;height: 0.09rem;top: 0;left: 0; background: linear-gradient(to bottom, rgba(26, 79, 154, 0.06), rgba(26, 79, 154, 0));}
 .nav-sub h3{margin: 0; font-size: var(--font-size__20); font-weight: var(--font-weight__m);border-bottom: 1px solid rgba(var(--black-color__rgb), 0.06); position: relative;padding-bottom: 0.1rem;}
 .nav-sub h3::after{position: absolute; content: ''; bottom: -1px;height: 1px;width: 0.3rem;background-color: var(--primary-color); left: 0; transition:transform 0.3s; transform-origin: 0 0;}
 .nav-sub .item:hover h3:after{transform: scaleX(2);}
 .nav-sub p{font-weight: var(--font-weight__l); margin: 0.1rem 0 0 0; line-height: calc(30 / 16);color: var(--default-color);}
 @media (min-width: 1025px) {
 .nav-sub .item{--lin:4;--limr:1rem;}
 .nav-sub .item:not(:nth-child(4n)){margin-right: var(--limr);}
 .nav-sub .item:nth-child(4) ~ .item{margin-top: var(--pm__30);}
 }

 .main-nav li span,
 .main-nav li span a{display: block;}
 .main-nav li span{position: relative;}
 .main-nav li span a{ transition: 0.5s;}
 .main-nav li span a:not(:hover){color: var(--default-color);}
 .main-nav li.aon span a{color: var(--primary-color);}
 @media (min-width: 1025px) {
 .main-nav li:not(:last-child){margin-right:3em;}
 .main-nav li span a{line-height: var(--header-height); }
 .nav-sub{position: absolute; width: 100%;top: 100%;left: 0;background-color: var(--white-color); padding: var(--pm__60) var(--pm__60) var(--pm__40);}
 .show .nav-sub{opacity: 1;clip-path: polygon(0 0,100% 0,100% 100%,0 100%);}
 }
 @media (min-width: 1025px) and  (max-width: 1600px){
   .main-nav{margin-right: var(--pm__100);}
   .main-nav li:not(:last-child){margin-right: var(--pm__50);}
 }
 @media (max-width: 1024px) {
   .main-nav{position: fixed;top: var(--header-height); bottom: 0; width: 3rem; background-color: var(--white-color); box-shadow: 0 0.14rem 0.14rem rgba(26, 79, 154, 0.06); left: -100%;opacity: 0;transition: 0.5s ease-in-out;}
   .menu-show .main-nav{left: 0;opacity: 1;}
   .main-nav ul{height: 100%; overflow: auto; flex-wrap:wrap; align-items:flex-start; align-content:flex-start;}
   .main-nav li:not(:last-child){border-bottom: 1px solid rgba(var(--black-color__rgb), 0.06);}
   .main-nav li{width:100%;}
   .main-nav li span a{padding: 1em 1em 1em 3em; font-size: var(--font-size__20);}
   .open-menu{display: flex;flex-direction: column;align-items: center;justify-content: space-between; width: 0.4rem; height: 0.32rem;padding: 0.06rem 0; margin-left: 0.2rem;}
   .open-menu i{display: block; width: 100%; height: 2px;background-color: var(--primary-color);}
   .wap-op{position: absolute;z-index: 10;right: 0;top: 0;width: 0.4rem;height: 100%;display: flex;align-items: center;justify-content: center;}
   .wap-op:after{display: block;content: ''; width: 0.1rem;height: 0.1rem;background: url(../images/select.svg) var(--bg-contain); transition: 0.3s;}
   .wap-show .wap-op:after{transform: rotate(180deg);}
   .nav-sub{visibility: hidden; height: 0;overflow: hidden; padding:0 0 0 3em;border-top: 1px solid rgba(var(--black-color__rgb), 0.06);}
   .nav-sub .item{padding: 1em 0;}
   .wap-show .nav-sub{opacity: 1;clip-path: polygon(0 0,100% 0,100% 100%,0 100%);visibility: visible; height: auto;}
 }

.open-search{width: 0.16rem; height: 0.16rem;display: block;background: url(../images/search.svg) var(--bg-contain);cursor: pointer; margin-right: var(--pm__60);}
.search-show .open-search{background-image: url(../images/close.svg);}
.top-search{position: fixed; width: 100%;top: var(--header-height);left: 0;transition: 0.5s;opacity: 0; clip-path: polygon(0 0,100% 0,100% 0,0 0);z-index: 99; padding-bottom: 0.28rem;}
.top-search .container{ border-radius: 0 0 0.06rem 0.06rem;background-color: var(--white-color); padding: var(--pm__60); box-shadow: 0 0.04rem 0.14rem 0.02rem rgba(26, 79, 154, 0.06);}
.search-show .top-search{opacity: 1;clip-path: polygon(0 0,100% 0,100% 100%,0 100%);}
.top-search .tips{text-align: center; font-size: var(--font-size__20);font-weight: var(--font-weight__m); margin-bottom: 0.5em;}
.top-search .inner{margin: 0 auto; max-width: 6rem;width: 90%;position: relative;}
.top-search .form-input{line-height: 2; padding-left: 0.2rem;padding-right: 0.8rem;}
.top-search .btn{position: absolute;right: 0;top: 0;width: 0.7rem;height: 100%; background: url(../images/search.svg) var(--bg-contain); background-size: auto 50%;cursor: pointer;}

footer{background-color: var(--black-color); padding-top: var(--pm__100);padding-bottom: var(--pm__60);font-weight: var(--font-weight__l);}
footer,
footer a:not(:hover){color: var(--white-color);}
footer .logo .img{width: 2.8rem;flex-shrink: 0;margin: 0 0.38rem; text-align: center;}
footer .logo .img img{ max-width: 1.55rem;}
footer .logo::before,
footer .logo:after{display: block; content: '';height: 1px;flex: 1;background-color: rgba(var(--white-color__rgb), 0.3);}
footer .tit{font-weight: var(--font-weight__m);font-size: var(--font-size__20); margin-bottom: var(--pm__30);}
.f-contact{margin: var(--pm__80) 0 var(--pm__140) 0;}
.f-other,
.f-other a:not(:hover){color: rgba(var(--white-color__rgb), 1);}
.f-nav{margin-bottom: var(--pm__30);}
.f-copyright .copyright,
.f-copyright .copyright a:not(:hover){color: rgba(var(--white-color__rgb), 0.6);}
.f-copyright .other-nav a{display: inline-flex;align-items: center;}
.f-copyright .other-nav a:not(:last-child):after{display: block;content: '';width: 0.01rem;height: 0.1rem;background-color: rgba(var(--white-color__rgb), 0.3);margin: 0 1em;}
.f-other .other-nav img{ width: .8rem;}
.f-contact .info .pic{width: 1.24rem;flex-shrink: 0;}
.f-contact .info .dl_list{flex: 1; display:flex;  }
.f-contact .info dl{ margin-left: var(--pm__40);}
.f-contact .info dd{line-height: calc(22 / 16); padding-left: 0.33rem;background: no-repeat left center;}
.f-contact .info dd.tel{background-image: url(../images/tel.svg);background-size: auto 0.2rem;}
.f-contact .info dd.wx{background-image: url(../images/wx.svg);background-size: auto 0.16rem;}
.f-contact .info dd.email{background-image: url(../images/email.svg);background-size: auto 0.15rem;}
.f-contact .info dd:not(:last-child){margin-bottom: var(--pm__20);}
.f-contact .code li{max-width: 1.24rem;}
.f-contact .code li p{font-size: var(--font-size__18);font-weight: var(--font-weight__m);}
.f-contact .links li img{opacity: 0.8; transition: 0.3s; max-width: 1.2rem;}
.f-contact .links li a:hover img{opacity: 1;}
@media (min-width:1025px) {
.f-contact .code{width: calc(460 / var(--max-width) * 100%);flex-shrink: 0;}
.f-contact .links{width: calc(368 / var(--max-width) * 100%);flex-shrink: 0;}
.f-nav a:not(:last-child){margin-right: 3em;}
}
@media (max-width:1024px) {
   .f-contact .links ul{align-items: center;flex-wrap: wrap;justify-content: space-around;}
   .f-contact .links li img{max-height: 0.6rem;}
   .f-nav{justify-content: center;}
   .f-nav a{margin: 0 1em;}
   .f-copyright{text-align: center; line-height: 1.5;}
   .f-copyright .other-nav{justify-content: center; display:none;}
   .f-copyright .copyright a{display: inline-block;}
}
@media (max-width:640px) {
.f-contact .info{ margin-bottom:.3rem;}
.f-contact .code{ margin-bottom:.3rem;}
.f-contact .code li p{ margin-bottom:.1rem;}
.f-contact .info .fcon{ align-items: flex-start;}
.f-contact .info .dl_list{flex-wrap: wrap; gap: .25rem;}
}

.h-lang{margin: 0 var(--pm__50) 0 0;}
.h-lang a{display:flex;align-items: center;}
.h-lang a:not(:last-child):after{width: 0.01rem;height: 0.12rem;background-color: rgba(var(--black-color__rgb), 0.4);margin:0 0.5em;display: block; content: '';}

@media (min-width: 1025px) {
header:not(.fixed).lighter .h-lang a,
header:not(.fixed).lighter .main-nav li span a,
/*header:not(.has-whitebg).lighter .main-nav li span a{color: var(--white-color);}*/
header:not(.fixed).lighter a:not(:last-child):after{background-color: rgba(var(--white-color__rgb), 0.4);}
header.has-whitebg .main-nav li span a{color: var(--default-color);}
header.has-whitebg .main-nav li span a:hover{color: var(--primary-color);}
}
header/*:not(.fixed).has-whitebg*/ .main-nav li span a{color: var(--default-color);}
header/*:not(.fixed).has-whitebg*/ .main-nav li span a:hover{color: var(--primary-color);}
.home-secitons .section{
   height: 100%;
   width: 100%;
   top: 0;
   position: fixed;
   visibility: hidden;}
.home-secitons .section .container{height: 100%; padding-top: var(--header-height);}

 
   .home-secitons .section .sec-outer,
   .home-secitons .section .sec-inside {
     width: 100%;
     height: 100%;
     overflow: hidden;
   }
   .home-secitons .section .bg{ position: absolute; height: 100%; width: 100%; top: 0; background-color: var(--white-color);}

.home-tit{text-align: center; margin-bottom:calc(50 / 960 * 100vh);}
.home-tit .en{font-family: var(--f-family__en);font-size: var(--font-size__56); font-weight: var(--font-weight__m);}
.home-tit .en span{color: var(--primary-color);}
.home-tit .cn{font-weight: var(--font-weight__l);font-size: var(--font-size__32); margin-top: 0.09rem; line-height: 1.2;}
@media (max-width:750px) {
   .home-tit{--font-size__56:0.4rem;--font-size__32:0.24rem}
}

a[data-more]{ display:inline-flex; align-items: center; padding: 0 var(--pm__30); line-height: calc(40 / 16); background: var(--primary-color); color: var(--white-color); font-weight: var(--font-weight__l); position: relative; transition: all 0.5s; z-index: 1; min-width: 1.9rem; justify-content: center;}
[data-more] + [data-more]{margin-left:0.14rem;}
[data-more='lighter']{background-color: #df1614;} 
[data-more]::after,
[data-more]::before { content: "";position: absolute;border: 2px solid var(--primary-color); width: calc(100% + 10px);height:  calc(100% + 10px);border-radius: 0.04rem; inset: -5px;animation: pathRotate 3s infinite linear; opacity: 0; transition: all 0.5s;}
/*[data-more]:hover::after,
[data-more]:hover::before{opacity: 1;}*/
[data-more]::after {animation-delay: -1.5s;}
/*[data-more]:hover {border-radius: 0.04rem;}*/
@keyframes pathRotate {
  0%,
  100% {
    clip-path: inset(0 0 98% 0);
  }
  25% {
    clip-path: inset(0 98% 0 0);
  }
  50% {
    clip-path: inset(98% 0 0 0);
  }
  75% {
    clip-path: inset(0 0 0 98%);
  }
}
[data-more='ico'] span{display: flex;align-items: center;}
[data-more='ico'] span:after{display: block;content: '';width: 0.11rem; height: 0.05rem; transform: rotate(90deg); background: url(../images/gettop.svg) var(--bg-contain); margin-left: 0.22rem;}

.home-body .right-fixed,
.home-body .fixed-nav,
.home-body header{animation: hh 2s 2s linear both; opacity: 0;}
@keyframes hh {
   0%{opacity: 0;}
   100%{opacity: 1;}
}


#footer .bg{background-color: var(--black-color);}