@font-face {
  font-family: AkzidenzGroteskBQ;
  src: url('../fonts/AkzidenzGrotesk-LightExtended_0.otf');
}

@font-face {
  font-family: Brown;
  src: url('../fonts/Brown-Regular_1.otf');
}


*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { font-size: calc(100vw * 100 / 750); /* 以750px宽度，100px字体大小为基准动态的根元素字体大小 */ }
body { min-height: 100vh; background: #141414; font-size: 0.32rem; padding-top: 1.2rem; }
a:link,
a:visited,
a:hover,
a:active { color: #FFFFFF; text-decoration: none; }
ul, li { list-style: none; }
[v-cloak] { display: none !important; }
.page-has-bg { background-image: url(../images/bg-2.png); background-position: right 0.56rem top 1.61rem; background-repeat: no-repeat; background-size: 4.14rem 4.14rem; background-color: #141414; }


/**
 * Module Wrapper
 */
.module-wrapper { padding-left: 0.44rem; padding-right: 0.42rem; }
.module-wrapper.no-padding { padding-left: 0; padding-right: 0; }


/**
 * 联系我们小方块盒子
 */
.contact-us-block-wrapper { width: 3.18rem; height: 3.18rem; display: flex; flex-direction: column; justify-content: space-between; background: #D7063A; color: #FFFFFF; font-size: 0.36rem; padding: 0.58rem 0.36rem 0.49rem 0.36rem; margin-top: 0.91rem; }
.contact-us-block-wrapper .arrow { font-size: 0.2rem; }


/**
 * Tabbar
 */
#tabbar { position: fixed; width: 100%; height: 1.45rem;  left: 0; bottom: -1.45rem; z-index: 300; transition: all 1s 0.3s; background: inherit; border-top: 1px solid rgba(255,255,255,0.15); }
#tabbar.show { bottom: 0; }
#tabbar .menus { height: 100%; line-height: 1.45rem; display: flex; align-items: center; justify-content: space-between; }
#tabbar .item { flex: 1; text-align: center; height: 100%; }
#tabbar .iconfont { font-size: 0.5rem; color: #FFFFFF; }
#tabbar .ibox { height: 100%; display: flex; align-items: center; justify-content: center; padding-top: 1.2rem; padding-bottom: 1.45rem; }


/**
 * Header
 */
#header { position: fixed; width: 100%; height: 1.2rem; left: 0; top: -1.2rem; z-index: 300; color: #FFFFFF; transition: all 1s 0.3s; background: inherit; border-bottom: 1px solid rgba(255,255,255,0.15); }
#header.show { top: 0; }
#header .logo { width: 1.8rem; position: absolute; left: 50%; top: 50%; z-index: 90; transform: translate(-50%,-50%); }
#header .iconfont.search { position: absolute; width: 1.2rem; height: 1.2rem; right: 0; top: 0; line-height: 1.2rem; text-align: center; z-index: 30; font-size: 0.46rem; }
#header .menu-icon { position: absolute; width: 1.2rem; height: 1.2rem; z-index: 30; left: 0; top: 0; }
#header .menu-icon > i { width: 0.56rem; height: 0.08rem; background: #FFFFFF; position: absolute; z-index: 30; left: 0.32rem; top: 0.4rem; transition: all 0.66s; }
#header .menu-icon > i:last-child { background: #D7063A; top: auto; bottom: 0.4rem; }
#header .menu-icon.open > i:first-child { transform: rotate(42.5deg) translate(0.05rem,0.1rem); border-radius: 0.04rem; }
#header .menu-icon.open > i:last-child { transform: rotate(-42.5deg) translate(0.12rem,-0.18rem); background: #FFFFFF; border-radius: 0.04rem; }
/* 菜单导航 */
#header .layer-wrapper-nav { position: absolute; width: 100%; height: calc(100vh - 2.65rem); background: #141414; z-index: 20; top: 1.2rem; left: 0; padding-top: 0.3rem; padding-bottom: 0.3rem; padding-left: 0.44rem; padding-right: 0.42rem; }
#header .layer-wrapper-nav .layer-wrap { display: flex; flex-direction: column; height: 100%; position: relative; }
/*#header .layer-wrapper-nav .layer-wrap::before,*/
/*#header .layer-wrapper-nav .layer-wrap::after { content: ""; position: absolute; z-index: 10; background: rgba(255,255,255,0.15); transition: all 1s 3s; }*/
/*#header .layer-wrapper-nav .layer-wrap::before { width: 1px; height: 100%; top: 0; left: 50%; }*/
/*#header .layer-wrapper-nav .layer-wrap::after { width: 100%; height: 1px; top: 50%; left: 0; }*/
#header .layer-wrapper-nav .row { flex: 1; display: flex; position: relative; border-bottom: 1px solid rgba(255,255,255,0.15); }
#header .layer-wrapper-nav .row::before { content: ""; position: absolute; z-index: 10; width: 1px; height: 100%; top: 0; left: 50%; background: rgba(255,255,255,0.15); }
#header .layer-wrapper-nav .row:last-child { border-bottom: none; }
#header .layer-wrapper-nav .item { flex: 1; height: 100%; }
#header .layer-wrapper-nav .item a { display: flex; height: 100%; flex-direction: column; justify-content: center; }
#header .layer-wrapper-nav .item:last-child .box { padding-left: 0.46rem; }
#header .layer-wrapper-nav .number { color: #D7063A; font-size: 0.3rem; font-family: AkzidenzGroteskBQ; margin-bottom: 0.8rem; }
#header .layer-wrapper-nav .name { font-size: 0.84rem; font-weight: 400; }
/* 搜索 */
#header .layer-wrapper-search { position: absolute; width: 100%; height: 100vh; background: #141414; z-index: 80; top: 0; left: 0; padding-left: 0.44rem; padding-right: 0.42rem; }
#header .layer-wrapper-search .layer-wrap { height: 100%; position: relative; display: flex; align-items: center; justify-content: center; }
#header .layer-wrapper-search .close-btn { position: absolute; z-index: 10; width: 1.2rem; height: 1.2rem; line-height: 1.2rem; text-align: center; right: -0.42rem; top: 0; }
#header .layer-wrapper-search .form { height: 1.2rem; line-height: 1.2rem; display: flex; align-items: center; color: #999999; width: 100%; border-bottom: 1px solid rgba(255,255,255,0.15); }
#header .layer-wrapper-search .form .form-search-icon { flex-shrink: 0; font-size: 0.42rem; }
#header .layer-wrapper-search .form .ipt { background: none; border: none; outline: none; font-size: 0.39rem;  width: 100%; padding: 0 0.3rem; flex: 1; }
#header .layer-wrapper-search .form .enter { font-size: 0.39rem; flex-shrink: 0; font-family: AkzidenzGroteskBQ; }


/**
 * Footer
 */
#footer { padding-bottom: 1.45rem; }
#footer .nav-wrapper { padding-left: 0.44rem; padding-right: 0.42rem; padding-top: 0.3rem; padding-bottom: 0.3rem; }
#footer .nav-wrap li { display: flex; position: relative; overflow: hidden; }
#footer .nav-wrap li::before { content: ""; position: absolute; width: 1px; height: 100%; z-index: 30; background: rgb(255,255,255,0.15); left: 50%; top: 0; transform: scaleY(0); transition: all 0.6s 1s; }
#footer .nav-wrap li.animated::before { transform: scaleY(1); }
#footer .nav-wrap li::after { content: ""; position: absolute; width: 100%; height: 1px; z-index: 30; background: rgba(255,255,255,0.15); left: 0; bottom: 0; transform: scaleX(0); transition: all 0.6s 1s; }
#footer .nav-wrap li.animated::after { transform: scaleX(1); }
#footer .nav-wrap li:last-child::after { display: none; }
#footer .nav-wrap a { display: flex; width: 50%; height: 2.45rem; flex-direction: column; justify-content: space-between; padding-top: 0.5rem; padding-bottom: 0.48rem; overflow: hidden; font-size: 0.36rem; }
#footer .nav-wrap li a:last-child { padding-left: 0.62rem; }
#footer .nav-wrap .arrow { font-size: 0.2rem; }
#footer .nav-wrap li:active { opacity: 0.9; }
#footer .bottom-wrapper { height: 3.78rem; display: flex; flex-direction: column; background: #D7063A; overflow: hidden; }
#footer .bottom-wrapper .logo-box { flex: 1; display: flex; align-items: center; justify-content: center; padding-top: 0.3rem; }
#footer .bottom-wrapper .logo { width: 2.5rem; }
#footer .bottom-wrapper .copyright { padding: 0.2rem; flex-shrink: 0; font-family: AkzidenzGroteskBQ; font-size: 0.2rem; color: #FFFFFF; width: 100%; text-align: center; line-height: 1.4; }


/**
 * 案例
 */
.module-wrapper-cases { background: #FFFFFF; padding-top: 1.2rem; padding-bottom: 0.98rem; }
.module-wrapper-cases .title { text-align: center; padding-bottom: 0.55rem; font-size: 0.72rem; color: #111111; font-weight: normal; position: relative; }
.module-wrapper-cases .title::after { content: ""; width: 100%; height: 1px; background: #EEEEEE; position: absolute; left: 0; bottom: 0; z-index: 30; transition: all 0.6s 1s; transform: scaleX(0); }
.module-wrapper-cases .title.animated::after { transform: scaleX(1); }
.module-wrapper-cases .introduce { padding-top: 0.55rem; padding-bottom: 0.55rem; color: #666666; font-size: 0.28rem; width: 4.2rem; text-align: center; line-height: 0.44rem; margin-left: auto; margin-right: auto; }
.module-wrapper-cases li { margin-bottom: 0.7rem; }
.module-wrapper-cases a { display: block; }
.module-wrapper-cases .img-box { position: relative; }
.module-wrapper-cases .arrow { width: 1.6rem; height: 1.6rem; line-height: 1.6rem; background: #D7063A; color: #FFFFFF; border-radius: 50%; position: absolute; z-index: 30; left: 50%; top: 50%; text-align: center; font-size: 0.34rem; margin-left: -0.8rem; margin-top: -0.8rem; transform: translateX(-6rem); transition: all 0.6s; }
.module-wrapper-cases img { width: 100%; }
.module-wrapper-cases .name { padding-top: 0.48rem; color: #333333; font-size: 0.36rem; line-height: 1.25; padding-bottom: 0.2rem; font-weight: normal; }
.module-wrapper-cases .brief { color: #999999; font-size: 0.28rem; line-height: 1.6; }
.module-wrapper-cases .more { font-family: AkzidenzGroteskBQ; font-size: 0.53rem; width: 2rem; text-align: center; color: #999999; display: block; margin-left: auto; margin-right: auto; }
.module-wrapper-cases a:visited .arrow { transform: translateX(0); }
.module-wrapper-cases a:active .arrow { transform: translateX(0); }


/**
 * 合作伙伴
 */
.module-wrapper-partners { padding-top: 1.2rem; padding-bottom: 0.5rem; }
.module-wrapper-partners .title { padding-bottom: 0.55rem; font-size: 0.72rem; color: #FFFFFF; line-height: 1.15; font-weight: normal; position: relative; }
.module-wrapper-partners .title::after { content: ""; width: 100%; height: 1px; background: rgba(255,255,255,0.15); position: absolute; left: 0; bottom: 0; z-index: 30; transition: all 0.6s 1s; transform: scaleX(0); }
.module-wrapper-partners .title.animated::after { transform: scaleX(1); }
.module-wrapper-partners .introduce { padding-top: 0.55rem; padding-bottom: 0.55rem; color: #999999; font-size: 0.26rem; line-height: 0.48rem; }
.module-wrapper-partners ul { display: flex; flex-wrap: wrap; }
.module-wrapper-partners li { width: 50%; }
.module-wrapper-partners a { display: flex; align-items: center; justify-content: center; height: 1.3rem; width: 100%; overflow: hidden; }
.module-wrapper-partners li:nth-child(odd) a { justify-content: flex-start; }
.module-wrapper-partners img { max-width: 80%; max-height: 78%; }
.module-wrapper-partners .more { font-family: AkzidenzGroteskBQ; font-size: 0.53rem; width: 2rem; text-align: center; color: #999999; display: block; margin-left: auto; margin-right: auto; margin-top: 0.5rem; }


/**
 * 资质证书
 */
.module-wrapper-certs { background: #FFFFFF; padding-top: 1.2rem; padding-bottom: 1.3rem; }
.module-wrapper-certs .title { padding-bottom: 0.55rem; font-size: 0.72rem; color: #383838; line-height: 1.15; font-weight: normal; position: relative; }
.module-wrapper-certs .title::after { content: ""; width: 100%; height: 1px; background: #EEEEEE; position: absolute; left: 0; bottom: 0; z-index: 30; transition: all 0.6s 1s; transform: scaleX(0); }
.module-wrapper-certs .title.animated::after { transform: scaleX(1); }
.module-wrapper-certs .introduce { padding-top: 0.55rem; padding-bottom: 0.55rem; color: #999999; font-size: 0.26rem; line-height: 0.48rem; }
.module-wrapper-certs ul { display: flex; flex-wrap: wrap; }
.module-wrapper-certs li { width: 50%; margin-bottom: 0.37rem; }
.module-wrapper-certs li:nth-child(odd) { padding-right: 0.32rem; }
.module-wrapper-certs li:nth-child(even) { padding-left: 0.32rem; }
.module-wrapper-certs a { display: block; }
.module-wrapper-certs .img-box { width: 100%; height: 3rem; background: #F9F9F9; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.module-wrapper-certs img { max-width: 70%; max-height: 70%; }
.module-wrapper-certs .name { color: #666666; font-size: 0.28rem; font-weight: 500; line-height: 0.34rem; padding-top: 0.27rem; padding-bottom: 0.27rem; }
.module-wrapper-certs .more { font-family: AkzidenzGroteskBQ; font-size: 0.53rem; width: 2rem; text-align: center; color: #999999; display: block; margin-left: auto; margin-right: auto; margin-top: 0.5rem; }


/**
 * 面包屑
 */
.module-wrapper-crumbs { padding-top: 0.6rem; padding-bottom: 0.6rem; }
.module-wrapper-crumbs .module-wrap { display: flex; align-items: center; color: #FFFFFF; line-height: 1; font-size: 0.28rem; }


/**
 * 内页标题
 */
.module-wrapper-inside-title .title { color: #FFFFFF; padding-bottom: 0.62rem; font-size: 0.72rem; font-weight: 400; line-height: 0.91rem; position: relative; }
.module-wrapper-inside-title .title::after { content: ""; width: 100%; height: 1px; background: rgba(255,255,255,0.15); bottom: 0; left: 0; z-index: 30; position: absolute; transition: all 0.6s 2s; transform: scaleX(0); }
.module-wrapper-inside-title .title.animated::after { transform: scaleX(1); }


/**
 * 内页介绍
 */
.module-wrapper-inside-introduce .introduce { position: relative; padding-top: 0.6rem; padding-bottom: 0.9rem; font-size: 0.28rem; color: #999999; line-height: 0.5rem; }
.module-wrapper-inside-introduce .introduce::after { content: ""; width: 100%; height: 1px; background: rgba(255,255,255,0.15); bottom: 0; left: 0; z-index: 30; position: absolute; transition: all 0.6s 2.4s; transform: scaleX(0); }
.module-wrapper-inside-introduce .introduce.animated::after { transform: scaleX(1); }