﻿@charset "utf-8";blockquote,body,button,caption,dd,div,dl,dt,fieldset,figure,form,h1,h2,h3,h4,h5,h6,hr,html,input,legend,li,menu,ol,p,pre,table,td,textarea,th,ul{margin:0;padding:0}
address,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
table{border-collapse:collapse;border-spacing:0}
caption,th{text-align:left;}
abbr,body,fieldset,html,iframe,img{border:0}
address,cite,dfn,em,i,var{font-style:normal}
[hidefocus],summary{outline:0}
li{list-style:none}
h1,h2,h3,h4,h5,h6,small{font-size:100%;font-weight:lighter}
sub,sup{font-size:83%}
code,kbd,pre,samp{font-family:inherit}
q:after,q:before{content:none}
textarea{overflow:auto;resize:none}
label,summary{cursor:default}
a,button{cursor:pointer}
b,em,h1,h2,h3,h4,h5,h6,strong{font-weight:700}
a,a:hover,del,ins,s,u{text-decoration:none}
body,button,input,keygen,legend,select,textarea{font:12px/1.14 'Microsoft YaHei',\5b8b\4f53;color:#333;outline:0}
body{font-family:-apple-system,BlinkMacSystemFont,'Microsoft YaHei',sans-serif;line-height:1.75;font-size:1.6rem;color:#333;line-height:1.75}
a,a:active,a:focus,a:hover,a:visited{color:#333;text-decoration:none}
body,html{width:100%;height:auto;position:relative}
/*公共样式*/
.container{width:100%;max-width:1600px;margin:auto;}
@media (max-width:1600px){
   .container{max-width:1200px;}
}
.img-cover{ position: relative; padding-bottom: 75%;}
.img-cover img{ position: absolute; display: block; width: 100%; height: 100%; object-fit: cover;}
.img-contain{ position: relative; padding-bottom: 75%;}
.img-contain img{ position: absolute; display: block; width: 100%; height: 100%; object-fit: contain;}
.flex{display: flex; display: -webkit-flex;  -webkit-justify-content: space-between; justify-content: space-between;  -webkit-align-items: center;align-items: center;}
.flwrap{  -webkit-flex-wrap: wrap; flex-wrap: wrap;}
.fixed{ position: fixed;}
/*头部样式*/
.header{ width: 100%; padding: 0.5rem 1.5rem; box-sizing:border-box; z-index: 999; transition: all 0.5s; background: rgba(0,0,0,0.5);}
.header.hbbg{ box-shadow: 0 0 1rem rgba(0,0,0,.1); background: #fff;}
.header .box.flex{ justify-content: space-between;}
.header .logo{ position: relative; z-index: 1002; padding: 1rem;}
.header .logo img{ max-height: 6rem;}
.header .lang{ position: relative; z-index: 1002; margin-left: 5%;}
.navbox{position: relative; z-index: 1001; width: 100%; -webkit-justify-content:flex-end; justify-content:flex-end}
.nav{width: auto; min-width: 80rem; height: 8rem; line-height: 8rem; padding:0 3rem}
.nav > ul > li{ position: relative; width:auto;}
.nav > ul > li>a{ position: relative; z-index: 1; display: block; width: 100%; padding: 0 2rem;  text-align: center; font-size: 1.6rem; font-weight: bold; transition: all 0.5s; color: #fff;}
.nav ul li:hover > a,.nav ul li.active > a{ color:#fff}
.nav ul li .subnav{ position: absolute; left: -30%; top: 8.5rem; min-width: 160%; height:auto; max-height: 0; overflow: hidden; transition: all 0.5s; background:#f5f5f5;}
.nav ul li:nth-child(3) .subnav{ left: -50%; min-width: 200%;}
.nav ul li:nth-child(4) .subnav{ left: -40%; min-width: 180%;}
.nav ul li:hover .subnav{max-height: 100rem;}
.nav .subnav > a{ display: block; line-height:1.5; padding: 1rem 3rem; color:#333; font-size: 1.5rem; border-left: 3px solid #f5f5f5; text-align: center; transition: all 0.5s; background: center;white-space: nowrap;}
.nav .subnav > a:hover{ color: #da0000; border-left: 3px solid #da0000; background:url(../images/arrow-drop-right-line.png) no-repeat 95% center #fff;}
.nav > ul > li > a::before,.nav > ul > li.active > a::before {position: absolute;bottom: -0.5rem;left: 50%;display: block;width: 0;height: 4px;background-color: #da0000;content: '';transition: all .2s ease;-webkit-transition: all .2s ease;-moz-transition: all .2s ease;-ms-transition: all .2s ease;-o-transition: all .2s ease;transform: translateX(-50%);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-ms-transform: translateX(-50%);-o-transform: translateX(-50%);}
.nav > ul > li > a:hover::before,.nav > ul > li.active > a::before {width: 100%;}
.header .tel{ width: auto;padding: 1rem;}
.header .tel a{ position: relative; display: block; width: 4rem; height: 4rem; background: url(../images/tel.png) no-repeat center #da0000; background-size: 2rem; border-radius: 50%; }
.header .tel span{ display: block; position: absolute; z-index: 1001; height: 4rem; line-height: 4rem; width: 0; white-space: nowrap; overflow: hidden; padding: 0; right: -0.1rem; top:0; background: url(../images/tel.png) no-repeat 1.5rem center #da0000; color: #fff; border-radius: 4rem; transition: all 0.5s; opacity: 0;}
.header .tel a:hover span{ width: auto; padding-right: 2.5rem; padding-left: 5rem; opacity: 1;}
.mhbg .tel{ position: relative; z-index: 1001;}
.hbbg .nav > ul > li>a{ color: #333;}
.hbbg .nav ul li:hover > a,.hbbg .nav ul li.active > a{ color:#da0000}
/*移动端导航样式*/
.menu-handler{position: relative;z-index:1012;left:0;top:0;width:auto; width: 7rem; height:7rem; padding: 1.5rem; overflow:hidden;cursor:pointer;}
.menu-handler .icon-menu{ position: relative; width: 4rem; height: 4rem; background: #da0000;}
.menu-handler .burger{position:absolute;z-index:5;top:1rem;left:0.8rem;display:block;width:3rem;height:2px;margin:0;background:#fff;transform-origin:center;-webkit-transform-origin:center;-moz-transform-origin:center;-o-transform-origin:center;-ms-transform-origin:center}
.menu-handler .burger-1{ width: 2.4rem;}
.menu-handler .burger-2{ width: 2.4rem; top:1.9rem}
.menu-handler .burger-3{ width: 2.4rem; left: auto; right: 0.8rem; top:2.8rem}
.menu-handler.active .burger-1{ width: 2.4rem; top:2rem;-webkit-transform:rotate(225deg);transform:rotate(225deg);}
.menu-handler.active .burger-2{opacity:0;-moz-opacity:0;-khtml-opacity:0;-webkit-opacity:0;left:-100%}
.menu-handler.active .burger-3{width: 2.4rem; top:2rem;-webkit-transform:rotate(-225deg);transform:rotate(-225deg);}
.menuBlack{position:fixed;z-index:999;top:0;bottom:0;right:0;left:0;background:#fff;display:none}
.menuBox{position:fixed;width:100%;top:0;left:-100%;height:100%; z-index:1001;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;display:none;background:url(../images/hbg.jpg) no-repeat center #fff; background-size: cover;}
.navMobile{margin-top:10rem;padding:3rem 0; display: flex; justify-content: center; flex-wrap: wrap;}
.navMobile dd{ width: 16%;}
.navMobile dd a{display:block;line-height:1;color:#333;font-weight:400;font-size:2.4rem;text-align:center;}
.navMobile dd p{ border-right: 1px solid rgba(0,0,0,0.1);}
.navMobile dd:last-child p{ border-right:0;}
.navMobile dd p a.act{color:#da0000}
.navMobile dd a:hover{color: #da0000;}
.navMobile .mtnav{ margin-top: 3rem; max-height: 50rem; overflow-y: hidden;}
.navMobile .mtnav a{ line-height: 4rem; font-size:1.6rem}
.navMobile .mtnav a:hover{ color: #da0000;}
.menuBox .hfoot{ justify-content: flex-end; margin-top: 3rem;}
.menuBox .hfoot a{ display: block; padding: 0 3rem; font-size: 1.4rem; font-weight: bold; border-right: 1px solid rgba(0,0,0,.1);}
.menuBox .hfoot a:hover{ color: #da0000;}
/*幻灯大图*/
.home{width:100%;height:auto; overflow:hidden; position:relative;}
.home .swiper-container{width:100%;height:100%}
.home .swiper-slide{position:relative;background:#fff;overflow:hidden}
.home .swiper-slide .vbox{position:absolute;left:0;top:0;width:100%;height:100%}
.home .swiper-slide video{width:100%;}
.home .swiper-slide .vbg{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5)}
.home .swiper-slide .vidbg{position:relative;z-index:9}
.home .swiper-slide-img{ width: 100%; height: auto; background: #000;}
.home .swiper-slide img{width:100%;height:auto;transition:1s ease 2s;transform:scale(1.1,1.1); opacity:1;}
.home .swiper-slide-active img,.home .swiper-slide-duplicate-active img{transition:5s ease;transform:scale(1,1)}
.home .swiper-pagination{ right:0; left: auto; bottom: 0; width: 10rem; height: 100%; border-left: 1px solid rgba(255,255,255,0.2); -webkit-flex-flow: column; flex-flow: column; justify-content: center;}
.home .swiper-pagination-bullet{width:1.2rem;height:1.2rem; border-radius: 1.2rem; opacity:1;background:rgba(255,255,255,.5);transition:all .5s}
.home .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{ margin: 0.5rem;}
.home .swiper-pagination-bullet-active{ background:#da0000; height: 3rem;}
.home .swiper-button-next,.home .swiper-button-prev{ right: 2.85rem; left: auto; top: 50%; width:4rem ;height:4rem; border-radius: 4rem; border: 2px solid #fff; }
.home .swiper-button-next{ background: url(../images/l.png) no-repeat center;background-size: 2rem; margin-top: -10rem; }
.home .swiper-button-prev{ background: url(../images/r.png) no-repeat center;background-size: 2rem; margin-top: 6rem; }
.home .swiper-button-next:hover,.home .swiper-button-prev:hover{ background-color: #da0000; border-color: #da0000;}
.mouse_icon{ position: absolute; left: 50%; bottom:5rem; cursor:pointer; margin-left: -8rem; width: 16rem; padding: 1rem; height: auto;color: rgba(255, 255, 255, .75); text-align: center; z-index: 1002;}
.mouse_icon p{ font-size: 1.4rem; display: block; margin-top: 0.5rem;  padding: 0 1rem;}
.mouse_icon .mouse{ width: 2.5rem; height: auto; margin:auto; position: relative;}
.mouse_icon .mouse img{ -webkit-animation: upAnimate 2s ease infinite; width: 100%;}
@-webkit-keyframes upAnimate{
    0%,100%{
        -webkit-transform: translateY(-4px);
    }
    50%{
        -webkit-transform: translateY(4px);
    }
}
.mouse_icon .icon{ width: 12px; margin: 0px auto;}
.mouse_icon .icon img{ -webkit-animation: upAnimate2 2s ease infinite;} 
@-webkit-keyframes upAnimate2{
    0%,100%{
        -webkit-transform: translateY(-1px);
    }
    50%{
        -webkit-transform: translateY(3px);
    }
}
/*底部*/
.footer{position: relative; width: 100%; height: auto; padding: 5rem 0; background: url(../images/fbg.jpg) no-repeat center #000; background-size: cover; overflow: hidden; border-top: 5px solid #da0000;}
.flink{width:100%; height:60px; line-height:60px; overflow:hidden; border-bottom:1px solid rgba(255,255,255,.2);}
.flink-box{width:100%;width:100%;margin:auto;display:flex;justify-content:start;align-items:center}
.flink-box h3{padding: 0 50px; background: url(../images/link.png) no-repeat left center; line-height:60px;color:#fff;font-size:24px;font-weight:400}
.flink-box h3 small{font-size:14px;color:#fff}
.flink-box p{line-height:60px}
.flink-box p a{color:#fff;font-size:1.6rem;display:inline-block;padding:0 1rem; opacity: 0.7;}
.flink-box p a:hover{ opacity: 1;}
.footer .lbox,.footer .rbox{ width: 50%;}
.footer .lbox h1{ margin-top: 8rem; font-size: 3rem; font-weight: normal; color: #fff;}
.footer .lbox .txt{ padding: 2rem 0 3rem 0; color: #fff; font-size: 1.6rem; line-height: 2;}
.footer .lbox .txt a{ color: #fff;}
.footer .lbox .contact p{ justify-content: flex-start; font-size: 1.6rem; font-weight: bold; color: #fff;}
.footer .lbox .contact p span{ padding:0.5rem; display: block;}
.footer .rbox ul{ justify-content: flex-end;}
.footer .rbox ul li{ margin-left: 1.5rem;}
.footer .rbox ul li img{ max-width: 15rem;}
.footer .rbox ul li span{display: block; text-align: center; line-height: 3; font-weight: bold; color: #fff;}
.footer .copyright{ padding-top: 3rem; font-size: 1.4rem; line-height: 2; color: #aaa;}
.footer .copyright a{ color: #666;}
.footer .copyright a:hover{ color: #fff;}
/*侧边栏客服代码*/
.return {position: fixed;z-index: 998;width: 5rem;height: 5rem;bottom: 2rem;right: 2.5rem;opacity: 0;background-color: #da0000;border-radius: 50%;background-repeat: no-repeat;background-position: center;cursor: pointer;background-image: url(../images/fanhui.png);transition: all 0.5s;}
.return.on{ opacity: 1;}

/*首页*/
.wrapper{position: relative; width: 100%; height: auto; overflow: hidden; background: #fff;}
.l_title{ position: relative; width: 100%; height: auto; line-height: 4rem; font-size: 3.5rem; font-weight: bold; display: flex; justify-content: flex-start; margin-bottom: 1rem; color: #333;}
.l_title span.dot{ display: block; width: 2rem; height: 4rem; position: relative;}
.l_title span:not(.dot){ padding: 0 2rem;}
.l_title span.dot::before{ content: ""; position: absolute; left: 0; top: 0; width: 1rem; height: 4rem; background: #da0000;}
.l_title span.dot::after{ content: ""; position: absolute; right: 0; top: 0; width: 1rem; height: 4rem; background: #ddd;}
@media (max-width: 768px) {
    .l_title{ line-height: 3rem; font-size: 2.5rem; }
    .l_title span.dot{ height: 3rem;}
    .l_title span.dot::before{ height: 3rem; }
    .l_title span.dot::after{height: 3rem; }
}
.moduleA{ width: 100%; height: auto; padding: 10rem 0; overflow: hidden; background: url(../images/moduleA_bg.jpg) no-repeat center; background-size: cover;}
.moduleA .moduleA_box{ width: 130%; margin-left: -15%;}
.moduleA .moduleA_box .swiper-container{ padding: 5rem 0;}
.moduleA .slide_box{ display: block; position: relative; border-radius: 3rem; overflow: hidden;}
.moduleA .slide_box .img{ position: relative;}
.moduleA .swiper-slide img{ transition: all 0.5s;}
.moduleA .slide_box .img-cover{ padding-bottom: 65%;}
.moduleA .slide_box .txt{ position: absolute; width: 100%; padding: 3rem; bottom: 0; background-image: linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0));}
.moduleA .slide_box .txt h3{ color: #fff; font-size: 2.5rem; line-height: 1.5;}
.moduleA .slide_box .txt p{ color: #fff; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.moduleA .swiper-slide:hover img{ transform: scale(1.05);}
.moduleA .swiper-slide:hover .slide_box{ box-shadow: 0 0 3rem rgba(0,0,0,.2);}
.moduleA .swiper-pagination-bullet-active{ background: #da0000;}
.moduleB{ width: 100%; height: auto; padding: 10rem 0; overflow: hidden;}
.moduleB .box{ margin-top: 5rem;}
.moduleB ul li{ position: relative; width:30%; border-radius: 3rem; overflow: hidden; background: #000; cursor: pointer;}
.moduleB ul li .img{ position: relative; z-index: 1; opacity: 1; transition: all 0.5s;}
.moduleB ul li .img-cover{ padding-bottom: 100%;}
.moduleB ul li .txt{ position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; padding: 5rem; text-align: center;}
.moduleB ul li .txt .flex{ flex-direction: column; align-items: center;}
.moduleB ul li .txt .icon{ width: 10rem; height: 10rem; box-sizing: border-box; padding: 2.5rem; margin-top: 1rem; border-radius: 50%; background: #fff;}
.moduleB ul li .txt .icon img{ max-width: 100%;}
.moduleB ul li .txt h3{ font-size: 2.5rem; color: #fff; margin: 3rem 0;}
.moduleB ul li .txt p{ color: #fff; font-size: 1.4rem; line-height: 1.5; }
.moduleB ul li:hover .img{ opacity: 0.5;}
@media (max-width: 1600px) {
    .moduleA .slide_box .txt h3{ font-size: 2rem;}
    .moduleA .slide_box .txt p{ font-size: 1.4rem;}
    .moduleB ul li .img{ opacity: 0.5;}
    .moduleB ul li .txt{ padding: 3rem;}
    .moduleB ul li .txt p{ font-size: 1.4rem; line-height: 1.5; }
}
@media (max-width: 1199px) {
    .moduleA .slide_box .txt{ padding: 1.5rem;}
    .moduleA .slide_box .txt h3,.moduleA .slide_box .txt p{ font-size: 1.8rem; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
    .moduleA,.moduleB{ padding: 5rem 0;}
    .moduleB ul li{ display: flex; justify-content: space-between; align-items: stretch; width: 100%; max-width: 100%; margin-bottom: 2rem; background: #f5f5f5;}
    .moduleB ul li .txt .icon{ margin-top: 1rem;}
    .moduleB ul li .img{ width: 40%; opacity: 1;}
    .moduleB ul li .img .img-cover{ height: 100%; padding: 0;}
    .moduleB ul li .txt{ position: relative; width: 60%; text-align: left;}
    .moduleB ul li .txt h3{ color: #da0000;  width: 100%;}
    .moduleB ul li .txt p{ font-size: 1.6rem; color: #333;}
}
@media (max-width: 768px) {
    .moduleB ul li .txt .icon{ display: none;}
    .moduleB ul li .txt h3{font-size: 2.4rem; margin: 0; margin-bottom: 2rem;}
    .menuBox .hfoot a{ width: 100%; font-size: 2rem;}
}