@charset "utf-8";
/* CSS Document */

body{ background:#fff;}
.left{ float:left;}
.right{ float:right;}
.wrap{ width:100%; min-width:1300px; background:#fff; position:relative; overflow:hidden; margin:0 auto;}
.content{ overflow:hidden;}
.clear{ height:0; clear:both;}

/*头部*/
.header{ width:100%; background:rgba(0,0,0,0.4); position:fixed; left:0; top:0; z-index:99;}
.header .head{ width:83.2vw; min-width:1200px; height:96px; position:relative; margin:0 auto;}
.header h1.logo{ display:block; overflow:hidden; float:left;}
.header h1.logo a{ display:block; position:relative;}
.header h1.logo a::after{ content:''; display:block; width:100%; height:100%; background:url(../images/common/logo_fix.png) no-repeat; position:absolute; left:0; top:0; opacity:0;}
.header h1.logo a img{ display:block; height:96px; box-sizing:border-box;}
.header p.slogan{ display:block; line-height:22px; color:#fff; font-size:18px; text-shadow:0 2px 3px rgba(6,25,59,0.6); float:left; margin-left:1em; padding-left:1em; border-left:1px solid #fff; margin-top:37px;}

/*导航*/
ul.nav{ display:block; font-size:16px; height:52px; float:right; padding:23px 0 0;}
ul.nav li{ display:block; float:left; position:relative; margin-left:4vw;}
ul.nav li a{ display:block; line-height:50px; color:#fff; font-weight:bold; text-align:center; overflow:hidden; border-bottom:2px solid transparent;}
ul.nav li a:hover,
ul.nav li.on a,
ul.nav li.cur a{ color:#e71f19; font-weight:bold; border-bottom:2px solid #e71f19;}

.header,
.header h1.logo a::after,
.header h1.logo a img,
.header p.slogan,
.header ul.nav li a{ transition:all ease 0.4s;}
.header.fixed{ background:rgba(255,255,255,1); box-shadow:0 0 6px rgba(0,0,0,0.2);}
.header.fixed h1.logo a::after{ opacity:1;}
.header.fixed h1.logo a img{ opacity:0;}
.header.fixed p.slogan{ color:#333; border-left-color:#333; text-shadow:none;}
.header.fixed ul.nav li a{ color:#333;}
.header.fixed ul.nav li a:hover,
.header.fixed ul.nav li.on a,
.header.fixed ul.nav li.cur a{ color:#e71f19;}

/*banner*/
.banner{ width:100vw; height:502px; overflow:hidden; position:relative;}
.banner .bg{ width:100%; height:100%; background-size:cover !important; position:absolute; left:0; top:0; z-index:1; transform:scale(1.05); animation:banner 1.75s ease;
	-moz-animation-iteration-count:1;
    -webkit-animation-iteration-count:1;
    -o-animation-iteration-count:1;
    animation-fill-mode:forwards; /*让动画停留在最后一帧 */
    -moz-animation-fill-mode:forwards; 
    -webkit-animation-fill-mode:forwards; 
    -o-animation-fill-mode:forwards;
}
@keyframes banner{
	0%{ transform:scale(1.05);}
	100%{ transform:scale(1);}
}

/*底部*/
.footer{ background:url(../images/common/foot_bg.jpg) center no-repeat; background-size:cover; overflow:hidden; position:relative;}
.footer .foot{ display:flex; justify-content:space-between; flex-wrap:wrap; flex-direction:row; width:83.2vw; min-width:1200px; padding:60px 0; margin:0 auto; position:relative; z-index:3;}
.footer .foot::before,
.footer .foot::after{ content:''; display:block; width:100%; height:0; overflow:hidden; clear:both;}
.footer dl{ display:block; font-size:16px; position:relative; box-sizing:border-box; padding-left:2em; background:url(../images/common/f_addr.png) no-repeat;}
.footer .line{ display:block; width:1px; height:6em; background:#999; margin-top:4em;}
.footer dl dt{ display:block; line-height:2.5; color:#fff; font-size:1.125em; font-weight:bold; position:relative;}
.footer dl dd{ display:block; line-height:1.75; color:#fff; padding:0.125em 0;}
.footer .copyright{ display:block; line-height:2; color:#fff; font-size:16px; text-align:center; overflow:hidden; padding:1.5em 0; background:#141414;}
.footer .copyright a{ margin:0 4px;}
.footer .copyright a:hover{ color:#fff; text-decoration:underline;}

/*返回顶部*/
.backToTop{ display:block; width:50px; height:50px; background:url(../images/common/top.png) center no-repeat; background-size:contain; position:fixed; right:20px; bottom:58px; cursor:pointer; text-indent:-9999px; opacity:0.7; z-index:999;}
.backToTop:hover{ opacity:0.9;}

/*主体样式*/
.main{ margin:0 auto; position:relative; z-index:2;}
.main::before,
.main::after{ content:''; display:block; width:100%; height:0; overflow:hidden; clear:both;}

/*左侧样式*/
.main ul.menu{ display:block; line-height:4.5em; font-size:18px; text-align:center; overflow:hidden; background:rgba(255,255,255,0.85); transform:translateY(-100%); margin-bottom:-4.5em;}
.main ul.menu li{ display:inline-block; vertical-align:top;}
.main ul.menu li a{ display:block; color:#333; padding:0 2.7em; position:relative;}
.main ul.menu li a:hover,
.main ul.menu li.cur a{ color:#6eb92b; font-weight:bold;}
.main ul.menu li a:hover::after,
.main ul.menu li.cur a::after{ content:''; display:block; width:100%; height:3px; background:#6eb92b; position:absolute; left:0; bottom:0;}

.caseMenu{ background:#fff; border-bottom:2px solid #ccc;}
.caseMenu ul{ display:flex; justify-content:center; width:1200px; font-size:16px; overflow:hidden; padding:30px 0 0; margin:0 auto;}
.caseMenu ul li{ display:block; margin:0 9%;}
.caseMenu ul li a{ display:block; line-height:1.5; color:#333; font-weight:bold; text-align:center; padding:0 0 0.75em; position:relative; overflow:hidden;}
.caseMenu ul li a em{ display:block; width:90px; height:90px; overflow:hidden; margin:0 auto;}
.caseMenu ul li a em i{ display:block; width:260px; height:90px; overflow:hidden; transition:all ease 0.4s; margin:0 0 0 -20px;}
.caseMenu ul li a em i img{ display:block; width:90px; height:90px; float:left; margin:0 20px;}
.caseMenu ul li a:hover,
.caseMenu ul li.cur a{ color:#e71f19;}
.caseMenu ul li a:hover::after,
.caseMenu ul li.cur a::after{ content:''; display:none; width:90px; height:2px; background:#e71f19; position:absolute; left:0; bottom:0;}
.caseMenu ul li a:hover em i,
.caseMenu ul li.cur a em i{ transform:translateX(-50%);}

.newsMenu ul{ display:block; font-size:16px; overflow:hidden; text-align:center; padding:60px 0 60px;}
.newsMenu ul li{ display:inline-block; vertical-align:top; transition:all ease 0.4s; user-select:none;}
.newsMenu ul li a{ display:block; width:10em; line-height:2.5; color:#333; text-align:center; padding:3px 0; background:#f2f2f2; transition:all ease 0.4s; margin:0 12px; cursor:pointer; user-select:none;}
.newsMenu ul li a img{ display:inline-block; vertical-align:top; height:2.5em; margin-right:0.375em; transition:all ease 0.4s;}
.newsMenu ul li a:hover,
.newsMenu ul li.cur a{ color:#fff; background:#e71f19;}
.newsMenu ul li a:hover img,
.newsMenu ul li.cur a img{ filter:brightness(0) invert(1);}

/*内容样式*/
.main .attr{ width:83.2vw; min-width:1200px; margin:0 auto;}
.main .attr::before,
.main .attr::after{ content:''; display:block; overflow:hidden; clear:both;}
.main .attr h2.title{ display:block; font-size:16px; font-weight:normal; text-align:center; padding:3.5em 0 2.75em; position:relative;}
.main .attr h2.title b{ display:block; line-height:1.285; color:#000; font-size:2.625em; text-transform:uppercase; opacity:0.1; position:relative; z-index:1;}
.main .attr h2.title em{ display:block; line-height:1.5; color:#333; font-size:2.25em; position:relative; z-index:3; margin:-1.5em 0 0;}
.main .attr h2.title em:only-child{ margin-top:0;}
.main .attr h2.title span{ display:block; line-height:2; color:#333;}

.main .attr p.subMenu{ display:block; font-size:16px; text-align:center; padding:60px 0;}
.main .attr p.subMenu a{ display:inline-block; vertical-align:top; width:10.5em; line-height:3; color:#666; background:#f1f4f5; text-align:center; margin:0 0.8em;}
.main .attr p.subMenu a:hover,
.main .attr p.subMenu a.cur{ color:#fff; background:#e71f19;}

.main p.position{ display:block; line-height:5em; color:#999; font-size:15px; overflow:hidden;}
.main p.position a{ margin:0 2px;}
.main p.position a:hover{ color:#e71f19;}

.main .attr h3.title{ display:block; line-height:1.5; color:#333; font-size:30px; font-weight:normal; text-align:center; padding:0.9em 0; margin:1.1em 0 0;}
.main .attr p.mark{ display:block; line-height:2; color:#999; font-size:14px; text-align:center; padding:1em 0; background:#f8f8f8;}
.main .attr p.mark font{ margin:0 0.5em;}
.main .article{ min-height:10em; line-height:2.25; color:#444; font-size:16px; text-align:justify; padding:1.5em 0;}
.main .article *{ line-height:inherit; color:inherit; font-size:inherit;}
.main .article img{ max-width:100%; height:auto;}

/*文章切换*/
.main .change{ font-size:14px; overflow:hidden; padding:1.785em 0; border-top:1px solid #ddd; margin:30px 0;}
.main .change p{ display:block; line-height:2.5; color:#999; overflow:hidden;}
.main .change p a{ display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; float:left; max-width:100%; transition:all ease 0.4s;}
.main .change p a:hover{ color:#e71f19;}

/*页码样式*/
.pages{ text-align:center; font-size:16px; padding:0 0 80px;}
.pages li{ display:inline-block; vertical-align:top;}
.pages span,
.pages a{ display:inline-block; *display:inline; *zoom:1; min-width:14px; color:#999; height:24px; line-height:24px; text-align:center; padding:6px 12px; border:1px solid #d2d2d2; margin:0 5px;}
.pages a:hover,
.pages span{ color:#fff; background:#e71f19; border-color:#e71f19;}

/*案例列表*/
.main ul.caseList{ display:block; font-size:16px; overflow:hidden; margin:0 -14px 80px;}
.main ul.caseList li{ display:block; width:25%; float:left;}
.main ul.caseList li a{ display:block; background:#fff; overflow:hidden; box-shadow:0 0 8px 2px rgba(202,202,202,0.3); border-radius:20px; margin:52px 14px 0;}
.main ul.caseList li a em{ display:block; overflow:hidden;}
.main ul.caseList li a em img{ display:block; width:100%; transition:all ease 0.4s;}
.main ul.caseList li span{ display:block; line-height:4; color:#333; font-size:1.125em; text-align:center; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; border-bottom:1px solid #eee; margin:0 6px; transition:all ease 0.4s;}
.main ul.caseList li p{ display:block; line-height:3.85; color:#999; font-size:0.875em; text-align:right; overflow:hidden; padding:0 24px;}
.main ul.caseList li p i.view{ display:block; background:url(../images/common/view.png) left center no-repeat; padding-left:2em; float:left;}
.main ul.caseList li:hover a em img{ transform:scale(1.1);}
.main ul.caseList li:hover a span{ color:#e71f19;}
.main ul.caseList li a.title:hover,
.main ul.caseList li a.more:hover{ color:#6eb92b;}

/*新闻列表*/
.main ul.newsList{ display:block; font-size:16px; overflow:hidden; margin:0 0 80px;}
.main ul.newsList li{ display:block; overflow:hidden; padding:60px 0; border-bottom:2px solid #ddd; transition:all ease 0.4s;}
.main ul.newsList li a.pic{ display:block; overflow:hidden; float:right; margin:-20px 0; margin-left:4.375%;}
.main ul.newsList li a.pic img{ display:block; width:302px; height:240px; object-fit:cover; transition:all ease 0.4s;}
.main ul.newsList li a.title{ display:block; line-height:2; color:#333; font-size:1.5em; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; transition:all ease 0.4s;}
.main ul.newsList li span{ display:flex; flex-direction:column; justify-content:center; width:12%; height:194px; line-height:1; color:#545454; font-size:1.125em; text-align:center; overflow:hidden; border-right:1px solid #ddd; float:left; margin-right:3.75%;}
.main ul.newsList li span b{ display:block; color:#e71f19; font-size:2.6em; overflow:hidden; margin-bottom:0.54em;}
.main ul.newsList li .txt{ height:3.6em; line-height:1.8; color:#666; padding:0.75em 0 0;
	display:-webkit-box;
	display:-moz-box;
	overflow:hidden;
	text-overflow:ellipsis;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
}
.main ul.newsList li a.more{ display:block; width:6em; line-height:2; color:#e71f19; font-size:0.875em; text-align:center; border:1px solid #e71f19; border-radius:1.1em; float:left; transition:all ease 0.4s; margin:2.25em 0 0;}
.main ul.newsList li:hover{ background:#f8f8f8;}
.main ul.newsList li:hover a.pic img{ transform:scale(1.12);}
.main ul.newsList li:hover a.title{ color:#e71f19;}
.main ul.newsList li a.more:hover{ color:#fff; background:#e71f19;}


/**/

@media only screen and (max-width:1600px){
.header .head{ width:1200px;}
.header h1.logo{ padding:4px 0;}
.header h1.logo a img{ height:88px;}
.header h1.logo a::after{ background-size:contain;}
.header p.slogan{ font-size:14px;}
ul.nav li{ margin-left:40px;}
ul.nav li a{ font-size:15px;}

.footer .foot{ width:1200px;}
.footer dl{ font-size:13px; background-size:auto 36px;}
.footer .copyright{ font-size:13px;}

.backToTop{ width:40px; height:40px;}

.main ul.caseList li{ width:33.33%;}
.main ul.caseList li span{ font-size/:1em;}

.main ul.newsList li{ padding:32px 0;}
.main ul.newsList li a.pic{ margin-top:0; margin-bottom:0;}
.main ul.newsList li a.pic img{ width:246px; height:194px;}
}















/**/