@charset "utf-8";
body,html{ overflow-x:hidden;}
body{ color:#3e3a39;  height:auto; box-sizing:border-box; /*background-color:#f2f2f2;*/ font-size:14px;}
.course{-moz-user-select: none; /*火狐*/
-webkit-user-select: none;  /*webkit浏览器*/
-ms-user-select: none;   /*IE10*/
-khtml-user-select: none; /*早期浏览器*/
user-select: none;}
a{ color:#323235; text-decoration:none;}
a:hover{ text-decoration:none; color:#e50112;}
i,em{ font-style:normal;}
.img_max{ display:block !important;}
.img_min{ display:none !important;}



.brand_service .pd:hover .img i{
-webkit-animation-iteration-count: 1;
-webkit-animation: hover_btn_four 0.5s linear 0s;
animation-iteration-count: 1;
animation: hover_btn_four 0.5s linear 0s;
}
@keyframes hover_btn_four {
from, 20%, 40%, 60%, 80%, to {animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);}
0% {opacity: 0.8;transform: skew(0deg,0deg);}
20% {transform: skew(5deg,0deg);}
40% {transform: scale3d(1.2, .9, .9);}
60% {opacity: 1;transform: scale3d(0.95, 1.05, 1.03);}
80% {transform: scale3d(1.05, 0.97, .97);}
to {opacity: 1;transform: scale3d(1, 1, 1);}
}


.top_tel span,
.about_con2 .img .h3,
.number_lsit .h3,
.quick_fw .p,
.app_list .img span,
.about_con1 .text .em,
.standard .i,
.banner_contact .text .c,
.tit2 a{font-family:'DIN-Medium';}


.slick-dots{ position:absolute; left:50%; bottom:0;}
.slick-dots li{ float:left; margin:0 6px;}
.slick-dots li button{ display:block; border:none; padding:0px; width:12px; height:12px; border-radius:50%; text-indent:-99px; overflow:hidden; background:#fff; box-sizing:border-box; border:none; box-shadow:0 0 3px rgba(0,0,0,0.3);}
.slick-dots li.slick-active button{ background:#e50112; }

.slick-arrow{font-size:24px; position:absolute; top:50%; z-index:2; height:32px; margin-top:-22px; line-height:32px; width:32px; text-align:center; padding:0px; border:none; color:#000; background:none;}
.slick-prev{ left:0px;}
.slick-prev:before{ content: "\e701"; }
.slick-next{ right:0px;}
.slick-next:before{ content: "\e704"; }



.btn{color:#fff;background:#000;position: relative;overflow: hidden; display:block;}
.btn:before{content:attr(data-text);position: absolute;top: 0;left: 0;width: 100%;height: 100%;-webkit-transform: translate3d(-100%, 0, 0);transform: translate3d(-100%, 0, 0);}
.btn:before,
.btn span{display: block;-webkit-transition: -webkit-transform 0.3s;transition: transform 0.3s;-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1); box-sizing:border-box;}
.btn:hover:before {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}
.btn:hover span {-webkit-transform: translate3d(0, 100%, 0);transform: translate3d(0, 100%, 0);}

.btn2{-webkit-transition: background-color 0.3s, color 0.3s;transition: background-color 0.3s, color 0.3s; position:relative;}
.btn2:before{content: '';position: absolute;top: -20px;left: -20px;bottom: -20px;right: -20px;background: inherit;border-radius: 50px;z-index: -1;
opacity: 0.4;-webkit-transform: scale3d(0.8, 0.5, 1);transform: scale3d(0.8, 0.5, 1);}
.btn2:hover {-webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s;transition: background-color 0.1s 0.3s, color 0.1s 0.3s;color: #ECEFF1;
background-color: #3f51b5;-webkit-animation: anim-moema-1 0.3s forwards;animation: anim-moema-1 0.3s forwards;}
.btn2:hover:before {-webkit-animation: anim-moema-2 0.3s 0.3s forwards;animation: anim-moema-2 0.3s 0.3s forwards;}

@-webkit-keyframes anim-moema-1 {
60% {-webkit-transform: scale3d(0.8, 0.8, 1);transform: scale3d(0.8, 0.8, 1);}
85% {-webkit-transform: scale3d(1.1, 1.1, 1);transform: scale3d(1.1, 1.1, 1);}
100% {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
}
@keyframes anim-moema-1 {
60% {-webkit-transform: scale3d(0.8, 0.8, 1);transform: scale3d(0.8, 0.8, 1);}
85% {-webkit-transform: scale3d(1.1, 1.1, 1);transform: scale3d(1.1, 1.1, 1);}
100% {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
}
@-webkit-keyframes anim-moema-2 {
to {opacity: 0;-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
}
@keyframes anim-moema-2 {
to {opacity: 0;-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}
}

.slick-arrow,
.brand_text .m em,
.btext .m a,
.btext .h3,
.btext .p,
.btext .m,
.iservice_1 .text,
.case_ul .tag,
.case_ul .text,
.case_ul .img img,
.icase_m a,
.header,
.header .wp,
.menu .h3 a,
.logo,
body,
.iservice_2 .pd,
.iservice_2 .img img,
.inews_con .img img,
.iservice_2 .pd .m i,
.iservice_1 .pd,
.case_list .text,
.case_list .b,
.case_m a,
.brand_service .img i,
.btn,
.news_list .img img,
.news_list .pd,
.about_con2 .img .m a,
.tjnews_list .pd,
.news_flip a,
.tj_tag_list a,
.quick_nav2 li,
.quick_nav1 a,
.case_nav,
.logo img,
.case_tj .img img,
.tj_service_list .img img,
.tj_case_list .img img,
.menu .h3 a:after,
.business .img img,
.business .m{
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
transition: all 0.3s linear;
}


.fa_right,
.btext_2 .h3,
.btext_2 .p,
.btext_2 .m,
.btext_4 .h3,
.btext_4 .p,
.btext_4 .m{ transform:translate(-100px,0); opacity: 0;transition: all 1s linear;}
.fa_left,
.btext_1 .h3,
.btext_1 .p,
.btext_1 .m{ transform:translate(100px,0); opacity: 0;transition: all 1s linear;}
.fa_bottom{ transform:translate(0,-100%); opacity: 0;transition: all 1s linear;}
.fa_top,
.btext_3 .h3,
.btext_3 .p,
.btext_3 .m{ transform:translate(0,100%); opacity: 0;transition: all 1s linear;}

.btext .h3{ transition-delay:0.7s;}
.btext .p{ transition-delay:0.9s;}
.btext .m{ transition-delay:1.1s;}

.slick-active .btext .h3,
.slick-active .btext .p,
.slick-active .btext .m{
transform:translate(0,0); opacity: 1;
}
.case_ul .img,
.iservice_2 .img,
.inews_con .img,
.news_list .img,
.business .img{ overflow:hidden;}
.case_ul .pd:hover .img img,
.iservice_2 .pd:hover .img img,
.inews_con .pd:hover .img img,
.news_list .pd:hover .img img,
.case_tj .pd:hover .img img,
.tj_service_list .pd:hover .img img,
.tj_case_list .pd:hover .img img,
.business .pd:hover .img img{transform: scale(1.1);}

.business .pd:hover .m{transform:translate(10px,0);}



.iservice_1 .pd:hover,
.news_list .pd:hover{transform:translate3d(0,-10px ,0);box-shadow:0 15px 20px rgba(0,0,0,.2);}
.tjnews_list .pd:hover{transform:translate3d(0,-5px ,0);box-shadow:0 5px 15px rgba(0,0,0,.2);}

.menu-link{
-webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
.menu-link *{box-sizing: border-box;}
.menu-link { display:none; border-radius:5px; box-sizing: border-box; position: fixed; top:10px;right:22px;font-size: 11px;z-index: 10;width:40px;height:40px; padding:8px;}
.menu-link:hover,
.menu-link:focus {}
.menu-link span {position: relative;display: block;margin-top:10px;}
.menu-link span,
.menu-link span:before,
.menu-link span:after {background-color: #d1000b;width: 100%;height:3px;-webkit-transition: all 0.4s;-moz-transition: all 0.4s;-ms-transition: all 0.4s;-o-transition: all 0.4s;transition: all 0.4s;}
.menu-link span:before,
.menu-link span:after {position: absolute;top: -.55em;content: " ";}
.menu-link span:after {top: .55em;}
.menu-link.active span {background: transparent;}
.menu-link.active span:before {
-webkit-transform: rotate(45deg) translate(.5em, .4em);
-moz-transform: rotate(45deg) translate(.5em, .4em);
-ms-transform: rotate(45deg) translate(.5em, .4em);
-o-transform: rotate(45deg) translate(.5em, .4em);
transform: rotate(45deg) translate(.5em, .4em);
}
.menu-link.active span:after {
-webkit-transform: rotate(-45deg) translate(.4em, -.3em);
-moz-transform: rotate(-45deg) translate(.4em, -.3em);
-ms-transform: rotate(-45deg) translate(.4em, -.3em);
-o-transform: rotate(-45deg) translate(.4em, -.3em);
transform: rotate(-45deg) translate(.4em, -.3em);
}

.menu .h3 em,
.menu .h3 span,
.slick-arrow,
.img_box:before{
font-family:"iconfont" !important;font-size:16px;font-style:normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;
text-shadow:0 0 3px rgba(255,255,255,0.3);
}

.wp{ width:90%; margin:0 auto; position:relative;}

.header{ position:relative; background:#fff; z-index:15; box-shadow:0 0 3px rgba(0,0,0,0.3);-webkit-transform: translateZ(0);}
.header .wp{ width:auto; margin:0 40px; height:100px;}
.logo{ width:190px; display:block; position:absolute; margin-top:-38px; top:50%;}
.logo img{ width:100%; height:auto; display:block;}

.menu{ text-align:center;}
.menu ul{ display:inline-block; vertical-align:bottom;}
.menu li{ float:left; position:relative;}
.menu .h3 a{ display:block; padding:0 20px; margin:0 13px; height:100px; line-height:100px; font-size:16px; color:#323235; position:relative;}
.menu .h3 a:after{ content:'\20'; bottom:20px; position:absolute; height:2px; background:#e50112; left:0px; width:0%;}
.menu .h3 i{ display:none;}
.menu .h3 a:hover,.menu .curr .h3 a{ color:#e50112;}
.menu .h3 a:hover:after{ width:100%;}
.menu .box{ position:absolute; display:none; left:-10px; top:100px; background:#323235; right:-10px; padding:10px 0}
.menu .box a{ display:block; color:#fff; height:36px; line-height:36px; text-align:center;}
.menu .box a:hover{ background:#e50112;}
.menu li:hover .box{ display:block;}

.fixed-nav .box{ top:60px;}

.fixed-nav .header{ position:fixed; left:0px; top:-60px; right:0px;}
.fixed-nav .header .wp{ height:60px;}
.fixed-nav .logo{ width:150px; margin-top:-27px;}
.fixed-nav .menu .h3 a{ height:60px; line-height:60px;}
.fixed-nav .menu .h3 a:after{ bottom:10px;}

.fixed-nav-appear .header,.fix_sec .header{ top:0px;}

.top_tel{ position:absolute; right:0px; top:50%; padding-left:40px; margin-top:-16px;}
.top_tel .icon-dianhua{ left:0px; top:0px; font-size:32px; width:32px; height:32px; line-height:32px; text-align:center; position:absolute; color:#e50112;}
.top_tel span{ line-height:32px; height:32px; display:block; color:#e50112; font-size:28px;}

.slick-slide{ position:relative; display:block;}
.slick-slide a{ display:block;}
.slick-slide img{ width:100%; height:auto; display:block;}
.ibanner{ position:relative;}
.ibanner .slick-arrow{font-size:22px; position:absolute; top:50%; z-index:2; height:58px; margin-top:-29px; line-height:58px; width:58px; text-align:center; padding:0px; border:none; color:rgba(255,255,255,1); background:rgba(0,0,0,0); opacity:0; border-radius:50%;}
.ibanner .slick-prev{ left:120px;}
.ibanner .slick-prev:before{ content: "\e701"; }
.ibanner .slick-next{ right:120px;}
.ibanner .slick-next:before{ content: "\e704"; }
.ibanner .single-item:hover .slick-arrow{ opacity:1; background:rgba(0,0,0,0.5);}

.ibanner .slick-dots{ position:absolute; margin-left:-15px; left:50%; bottom:110px;}
.ibanner .slick-dots li{ float:left; margin:0 6px;}
.ibanner .slick-dots li button{ display:block; border:none; padding:0px; width:12px; height:12px; border-radius:50%; text-indent:-99px; overflow:hidden; background:rgba(255,255,255,1); box-sizing:border-box; border:none;}
.ibanner .slick-dots li.slick-active button{ background:rgba(255,255,255,0); box-shadow:0 0 0 1px rgba(255,255,255,1); }
.ibanner .pd{ background:#000;}
.ibanner video{ position:absolute; left:0px; top:0px; right:0px; bottom:0px; width:100%;}

.btext{ position:absolute; z-index:2; color:#fff;}
.btext .h3{ font-size:72px; line-height:1; margin-bottom:36px;letter-spacing: 10px}
.btext .p{ font-size:40px; font-weight:700; line-height:1.2444;}
.btext .m{ padding-top:80px;}
.btext .m a{ width:200px; color:#fff; height:52px; border:1px solid #fff; text-align:center; line-height:52px; font-size:16px; display:block; border-radius:26px;}
.btext .m a:hover{ background:#e50112; border-color:#e50112;}

.btext_1{ left:50%; top:26%;}
.btext_2{ left:11%; top:26%;}
.btext_3{ left:40px; right:40px; top:26%; text-align:center;}
.btext_3 .m a{ display:block; margin:0 auto;}
.btext_4{ left:11%; top:22%;}
.btext_4 .p{ color:#e5b581;}

@media(max-width:1445px){
.btext .h3{ font-size:52px; line-height:1; margin-bottom:36px;letter-spacing: 10px}	
.btext .p {font-size: 35px;}	
}
@media(max-width:1024px){
.ibanner .slick-dots{ position:absolute; margin-left:-15px; left:50%; bottom:52px;}
	
}
@media(max-width:991px){
.ibanner { margin-top: 22%;}
	
}



