html, body{margin: 0; padding: 0; font-size: 12px; background: #fff; font-family: "Microsoft YaHei", arial}
ul{list-style: none}
ul, li ,ol{margin: 0; padding: 0}
h1,h2,h3,h4,h5,h6{margin: 0; font-weight: normal}
p{margin: 0;}
a{text-decoration: none; display: block; color: #333; outline: none}
img{border: 0; float: left}
div{box-sizing: border-box}
.clearfix:after{content: ""; display: block; height: 0; clear: both; visibility: hidden; font-size: 0}
ul:after {clear:both;content:'.';display:block;width: 0;height: 0;visibility:hidden;}
.w1200{width: 1200px; margin: 0 auto; position: relative;overflow: hidden;}
.w1366{width: 1366px; margin: 0 auto; position: relative;overflow: hidden;}
.left{float: left}
.right{float: right}
::-webkit-scrollbar
{
width: 6px;
background-color: rgba(255,255,255,.1);
}
::-webkit-scrollbar-thumb {
border-radius: 5px;
background-color: rgba(0,0,0,.4);
}
@font-face {
font-family: 'novecentowide-book';
src: url('../font/novecentowide-book-webfont.eot');
src: url('../font/novecentowide-book-webfont.eot?#iefix') format('embedded-opentype'),
url('../font/novecentowide-book-webfont.woff2') format('woff2'),
url('../font/novecentowide-book-webfont.woff') format('woff'),
url('../font/novecentowide-book-webfont.ttf') format('truetype'),
url('../font/novecentowide-book-webfont.svg#dincond-mediumalternateRg') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Montserrat-Light';
src: url('../font/Montserrat-Light.eot');
src: url('../font/Montserrat-Light.eot?#iefix') format('embedded-opentype'),
url('../font/Montserrat-Light.woff2') format('woff2'),
url('../font/Montserrat-Light.woff') format('woff'),
url('../font/Montserrat-Light.ttf') format('truetype'),
url('../font/Montserrat-Light.svg#dincond-mediumalternateRg') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'DisneyEnglish-Bold';
src: url('../font/DisneyEnglish-Bold.otf');
src: url('../font/DisneyEnglish-Bold.ttf');
font-weight: normal;
font-style: normal;
}
/*----header----*/
header{position:fixed;width:100%;background: #fff;z-index: 99; }
.header{ height: 80px;margin-left: auto;margin-right: auto; transition: all .5s; -webkit-transition: all .5s}
.header .logo{float: left; width: 176px; height: 60px; margin: 10px 0 0 0; background: url("../image/logo.png") no-repeat; background-size: cover; position: relative; z-index: 9; transition: all .4s; -webkit-transition: all .4s}
.h{height: 80px;}
.header .lan{float: right; margin: 0; position: relative; transition: all .4s; -webkit-transition: all .4s; z-index: 4}
.header .lan:before{content: ""; display: block; width: 1px; height: 14px; background: #999; position: absolute; left: -15px; top: 50%; margin: -7px 0 0 -20px; transition: all .4s; -webkit-transition: all .4s;}
.header .lan a{display: inline-block; font-size: 16px; color: #333; padding: 0 4px; line-height: 80px; margin: 0 4px; font-family: 'Montserrat-Light'; transition: all .4s; -webkit-transition: all .4s}
.header .lan span{display: inline-block; color: #333;font-size: 16px;}
.header .lan span i{font-size: 16px;}
.header .lan a:hover{color: #c82631}
#banner.swiper-container-horizontal > .swiper-pagination-bullets {
top: auto;
bottom: 30px;
left: auto;
right:auto;
text-align: center;
margin:0 auto;
width: 100%;
z-index: 6;
}
#banner .swiper-pagination-bullet{width:30px; height: 8px; opacity: 1; background: #fff; border-radius: 0px; margin: 0 4px;border-radius: 4px;transition: all .5s;}
#banner .swiper-pagination-bullet-active{ width:40px;background: #c82631 }
.nav{float: right; margin: 0 40px 0 0; transition: all .4s; -webkit-transition: all .4s; position: relative; z-index: 4}
.nav .nav_bar{list-style: none;}
.nav .nav_bar li{float: left; margin: 0 10px;}
.nav .nav_bar li a{font-size: 16px; color: #333; padding: 0 10px; margin: 0 10px; line-height: 80px; box-sizing: border-box; position: relative; transition: all .4s; -webkit-transition: all .4s}
.nav .nav_bar li a::after {
width: 0%;
content: '';
position: absolute;
bottom: 1px;
height: 2px;
background: #c82631;
left: 50%;
transform: translateX(-50%);
opacity: 0;
transition: all 0.36s ease;
}
.nav .nav_bar li a:hover::after,.nav .nav_bar li.on a::after {
width: 100%;
opacity: 1;
}
.nav .nav_bar li.on a{color: #c82631;}
.nav .nav_bar li:hover a{color: #c82631;}
.nav_w{width: 100%; background: #fff; position: absolute; top: 0; left: 0; margin-top: 80px; padding: 10px 0; z-index: 2; box-shadow: 0 -1px 0 0 #dedede; display: none;}
.nav_w .w_left{width: 25%; margin-right: 5%;}
.nav_w .w_left .img{width: 100%; overflow: hidden}
.nav_w .w_left .img img{width: 100%;}
.nav_w .nav_bar{list-style: none;}
.nav_w .nav_bar li{float: left; margin: 0 20px;}
.nav_w .nav_bar li a{font-size: 17px; color: #333; font-weight: bold; padding: 0 20px; line-height: 60px; box-sizing: border-box; position: relative;}
.nav_w .nav_bar li .nav_son{}
.nav_w .nav_bar li .nav_son a{font-size: 14px; color: #666; line-height: 40px; font-weight: normal; text-align: center; transition: all .4s; -webkit-transition: all .4s}
.nav_w .nav_bar li .nav_son a:hover{color: #c82631}
.nav_w.n_on{display: block}
.header .button1{position: absolute; right: 0; top: 0; width: 80px; height: 80px; padding: 5px; background: none; border: none; cursor: pointer; background: #c82631; z-index: 4;display: none;}
.header button{outline: none}
.header .button1 span{width: 30px; height: 2px; position: absolute; top: 0; left: 25px; display: block; background: #fff; transition: all .5s; -webkit-transition: all .5s}
.header .button1 span:nth-child(1){top: 30px}
.header .button1 span:nth-child(2){top: 40px}
.header .button1 span:nth-child(3){top: 50px}
#button1 .span1{top: 40px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg)}
#button1 .span2{opacity: 0}
#button1 .span3{top: 40px; transform: rotate(45deg); -webkit-transform: rotate(45deg)}
.header_mark{width: 100%; height: 80px; position: absolute; top: 0; left: 0; background: #fff; z-index: 3}
header.mini .header_mark{ box-shadow: 0 0 10px 3px rgba(0,0,0,.2);}
.list01 .list01_left .list01_data .li i {
font-size: 18px;
padding-left: 8px;
font-weight: bold;
font-style: normal;
color: #c82631;
}
.pic {
width: 100%;
overflow: hidden;
}
.list01 .list01_right .img a.pic {
display: block;
}
.list01 .list01_right .img a.pic img{transition:1s;
-webkit-transition:1s;
-moz-transition:1s; object-fit: cover;}
.list01 .list01_right .img a.pic:hover img {-webkit-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); -moz-transform: scale(1.1); transform: scale(1.1);}
.ovh {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/*----footer----*/
.footer{position: relative; background: #42474b; padding: 40px 0 0 0; overflow: hidden; z-index: 9}
.footer .footer_con{}
.footer .footer_con .footer_left{width: 16%;}
.footer .footer_con .footer_left h1{font-size: 16px; color: #f0f0f0; font-weight: bold; margin-bottom: 20px;}
.footer .footer_con .footer_left .footer_nav{font-size: 0;}
.footer .footer_con .footer_left .footer_nav a{display: inline-block; width: 49%; font-size: 13px; color: #dedede; margin-bottom: 10px;}
.footer .footer_con .footer_center{width: 44%; padding-left: 60px;}
.footer .footer_con .footer_center h1{font-size: 16px; color: #f0f0f0; font-weight: bold; margin-bottom: 20px;}
.footer .footer_con .footer_center span{width: 48%; display: inline-block; font-size: 13px; color: #dedede; margin-bottom: 10px;}
.footer .footer_con .footer_center span:last-child{ width: 100%;}
.footer .footer_con .footer_right{width: 40%; padding-top: 40px;}
.footer .footer_con .footer_right .footer_site{margin-bottom: 12px;}
.footer .footer_con .footer_right .footer_site a{display: inline-block; font-size: 13px; color: #dedede; margin-right: 10px;}
.footer .footer_con .footer_right .footer_ying{margin-bottom: 12px;}
.footer .footer_con .footer_right .footer_ying a{display: inline-block; padding: 0 6px; margin-right: 2px; font-size: 13px; color: #dedede;}
.footer .footer_con .footer_right .footer_ying .ying{font-size: 13px; color: #dedede; padding: 0 6px 0 0; margin-right: 4px;}
.footer .footer_con .footer_right .footer_link{margin-bottom: 10px;}
.footer .footer_con .footer_right .footer_link a{display: inline-block; padding: 0 6px; margin-right: 2px; font-size: 13px; color: #dedede;}
.footer .footer_con .footer_right .footer_link .link{font-size: 13px; color: #dedede; padding: 0 6px 0 0; margin-right: 4px;}
.footer .footer_end{margin-top: 30px; padding: 14px 0; border-top: 1px solid #666; text-align: center}
.footer .footer_end a{display: inline-block; font-size: 13px; color: #dedede; margin: 0 10px;}
footer{border-top:4px solid #c82631; background-color: #f2f2f2; }
.ft_top p{text-align: center;line-height: 75px;}
.ft_top p a{display: inline-block;padding: 0 40px;font-size: 16px; color: #555;}
.ft_top p a:hover{color: #c82631;}
.ft_cen{text-align: center;padding: 55px 0;}
.ft_cen img{float: none;vertical-align: middle;}
.ft_cen h3{font-size: 30px; padding-top: 40px; font-weight: bold;}
.ft_cen h4{font-size: 16px; padding:25px 0 ;}
.ft_cen h5 {font-size:30px; font-weight: bold;margin-bottom: 35px;}
.ft_cen h5 a{color: #c82631;display: inline-block;}
.ft_cen h5 a:hover{color: #dc3545;}
.ft_cen h6 a{line-height: 50px;width: 240px;background: #c82631;text-align: center;margin: auto;color: #fff; display: block; font-size: 18px; }
.ft_cen h6 a:hover{ background-color:#dc3545 ;}
.ft_bott{padding: 30px 0; text-align: center; font-size: 15px;background-color: #e6e6e6;}
.ft_bott a{ display: inline-block;color: #5f5d5e;}
.ft_bott a:hover{ color:#c82631;}
hr {
margin-top: 20px;
margin-bottom: 20px;
border: 0;
border-top: 1px solid #e2e2e2;
height: 0;
}
.banner .swiper-slide .ind_ban_tex {
position: absolute;
text-align: left;
width: 80%;
top: 35%;
left: 50%;
transform: translate(-50%,-50%);
z-index: 5;
}
.banner .swiper-slide .ind_ban_tex .ind_ban_con {
width: 100%;
display: block;
}
.banner .swiper-slide .ind_ban_tex .ind_ban_tex_title {
flex-basis: 75%;
max-width: 55%;
max-height: 400px;
overflow: visible;
position: relative;
padding-bottom: 10px;
margin-bottom: 20px;
}
.banner .swiper-slide .ind_ban_tex .ind_ban_tex_title:before {
content: '';
width: 0%;
height: 40px;
background: rgba(255,255,255,0.2);
position: absolute;
bottom: 0px;
left: -30%;
transform: translateX(80px);
opacity: 0;
}
.banner .swiper-slide.swiper-slide-active .ind_ban_tex .ind_ban_tex_title:before {
transition: all 1.5s ease 0s;
transform: translateX(0);
opacity: 1;
width: 115%;
}
.banner .swiper-slide .ind_ban_tex .ind_ban_tex_title .t_big {
color: #fff;
font-size: 3vw;
font-weight: bold;
text-transform: capitalize;
line-height: 1.2;
margin-bottom: 10px;
text-shadow: 3px 0 10px rgb(22 78 145 / 40%);
transform: translateX(80px);
opacity: 0;
}
.banner .swiper-slide.swiper-slide-active .ind_ban_tex_title .t_big {
transition: all 2s ease 1.2s;
transform: translateX(0);
opacity: 1;
}
.banner .swiper-slide .ind_ban_tex .ind_ban_tex_info {
width: 40%;
flex-basis: 25%;
margin-bottom: 20px;
}
.banner .swiper-slide .ind_ban_tex .ind_ban_tex_info .t_small {
color: #ffffff;
line-height: 1.8;
font-size: 20px;
text-shadow: 3px 0 10px rgb(22 78 145 / 40%);
transform: translateX(80px);
opacity: 0;
}
.banner .swiper-slide.swiper-slide-active .ind_ban_tex_info .t_small {
transition: all 2s ease 1.4s;
transform: translateX(0);
opacity: 1;
}
/*----right_list----*/
.right_list{width: 48px; position: fixed; right: 20px; bottom: 0; margin-bottom: 16%; z-index: 99;}
.right_list .li{position: relative; width: 50px; height: 50px; margin-bottom: 4px; text-align: center; line-height: 50px; background: #dedede; cursor: pointer; transition: all ease .3s; -webkit-transition: all ease .3s}
.right_list .li i{font-size: 32px; color: #333; vertical-align: middle; transition: all ease .3s; -webkit-transition: all ease .3s}
.right_list .li.top{height: 38px; line-height: 32px}
.right_list .li .img{width: 120px; height: 150px; position: absolute; top: 0; right: 0; margin: 40px 60px 0 0; background: #fcfcfc; box-shadow: 0 0 10px 3px rgba(0,0,0,.2); visibility: hidden; opacity: 0; transition: all ease .3s .1s; -webkit-transition: all ease .3s .1s}
.right_list .li .img img{width: 100%; display: block; float: none; margin: 0 auto 5px auto;}
.right_list .li .img p{line-height: 10px; font-size: 13px; color: #333}
.right_list .li .tel{width: 190px; height: 50px; position: absolute; top: 0; right: 0; margin: 0 0 0 0; background: #fff; box-shadow: 0 0 10px 3px rgba(0,0,0,.2); visibility: hidden; opacity: 0; transition: all ease .3s; -webkit-transition: all ease .3s}
.right_list .li .tel h3{font-size: 18px; color: #26324a; line-height: 50px; font-family: 'novecentowide-book'}
.right_list .li .tel h3 i{font-size: 20px; color: #26324a; padding-right: 6px; vertical-align: middle; padding-bottom: 2px}
.right_list .li .tel h3 a{display: inline-block}
.right_list .li:hover{background: #000}
.right_list .li:hover i{color: #fff;}
.right_list .li:hover .img{visibility: visible; opacity: 1; margin: 0 60px 0 0}
.right_list .li:hover .tel{margin: 0 60px 0 0; visibility: visible; opacity: 1}
/*--ServiceBar--*/
.ServiceBar{ right:0; bottom:100px; position:fixed; text-align:left;overflow: hidden;z-index:999;}
.ServiceBar li{background:rgba(0,0,0,0.5);margin:4px 0;padding: 10px;border-top-left-radius: 4px;border-bottom-left-radius: 4px;cursor:pointer;position:relative; right: -70px;}
.ServiceBar li .iconBox{text-align: center;overflow: hidden;display: flex;align-items: center;justify-content: space-between}
.ServiceBar li img{width: 30px;height:30px;}
.ServiceBar li h4{color: #fff;font-size:14px;margin:2px 0;margin-left: 15px;}
.ServiceBar li:hover{background:#c82631;}
.ServiceBar li .hideBox{display: none;position: absolute;right:120px;padding:10px;padding-right: 15px; top:-10px;z-index: 999;}
.ServiceBar li .hideBox .hb{border: 1px solid #ccc;background-color: #fff; padding: 10px 20px;border-top: 2px solid #c82631;border-bottom-left-radius: 4px;border-bottom-right-radius: 4px;}
.ServiceBar li .hideBox .hb h5{padding: 5px 0;border-bottom: 2px solid #ccc;color: #c82631;font-size: 16px;font-weight: 400;display: block;white-space: nowrap;}
.ServiceBar li .hideBox .hb p a{margin-top: 5px;font-size: 18px;font-weight: 700; white-space: nowrap; color: #333;}
.ServiceBar li .hideBox .hb .qqtalk{margin-top: 10px;}
.ServiceBar li .hideBox .hb .qqtalk a{display: flex;align-items: center}
.ServiceBar li .hideBox .hb .qqtalk img{width: 25px;height:25px;}
.ServiceBar li .hideBox .hb .qqtalk p{font-size: 14px;font-weight: 400;white-space: nowrap;margin-top: -5px;margin-left: 5px;}
.ServiceBar li:nth-child(3) .hideBox img{width:140px;height: 140px;margin-top: 10px;}
/*--end ServiceBar-- */