﻿.inner { width: 1280px; margin: 0px auto; }
.pinner { width: 1100px; margin: 0px auto; }
.head { width: 100%; position: fixed; left: 0px; top: 0px; z-index: 1000; box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.5); }
.gropBox { background: url(../images/tbg.gif) repeat; text-align: right; color: #fff; height: 22px; overflow: hidden; padding: 4px 0px; transition: 300ms; -webkit-transition: 300ms; -ms-transition: 300ms; }
.g-tel i { font-size: 18px; line-height: 1.4; font-family: "zaproman"; }
.searchBox { float: right; display: block; border: 1px solid #80b0af; height: 18px; border-radius: 10px; padding: 0px 8px; margin: 0px 0px 0px 10px; }
.searchTxt, .searchBtn { float: left; display: block; margin: 0px; padding: 0px; border: 0px none; line-height: 18px; height: 18px; background-color: transparent; color: #fff; }
.searchTxt { border: 0px none; width: 100px; font-size: 12px; font-family: "microsoft yahei"; }
input.searchTxt::-webkit-input-placeholder { color: #9dbab9; }
input.searchTxt:-moz-placeholder { color: #9dbab9; }
input.searchTxt::-moz-placeholder { color: #9dbab9; }
input.searchTxt:-ms-input-placeholder { color: #9dbab9; }
.searchBtn { background: url(../images/search_btn.png) no-repeat scroll center center; width: 18px; }
.gropBox2 { float: right; display: none; margin-top: 44px; margin-right: 88px; }
.gropBox2 a.g-tel { color: #006766; font-size: 14px; display: block; }
.gropBox2 a.g-tel i { font-style: inherit; }
.gropBox2 .searchBox { background-color: #087b7a; border: 0px none; width: auto; margin-left: 0px; padding: 0px 0px 0px 12px; height: 24px; border-radius: 12px; }
.gropBox2 .searchBox .searchTxt, .gropBox2 .searchBox .searchBtn { height: 24px; line-height: 24px; }
.gropBox2 .searchBox .searchTxt { width: 88px; color: #fff; }
.gropBox2 .searchBox .searchBtn { width: 30px; background: url(../images/search_btn2.png) no-repeat scroll center center; background-size: cover; }
.top { height: 100px; background-color: #fff; }
.top .inner { position: relative; }
.logo { position: absolute; left: 0px; font: bold 26px/88px "microsoft yahei"; color: #777777; transition: 300ms; -webkit-transition: 300ms; -ms-transition: 300ms; }
.logo img { display: block; margin-right: 15px; float: left; transition: 300ms; -webkit-transition: 300ms; -ms-transition: 300ms; }
.logo .txt { margin-top: 22px; float: left; display: block; color:#006835; }
.nav { float: right; display: block; transition: 300ms; -webkit-transition: 300ms; -ms-transition: 300ms; }
.nav a:link, .nav a:visited { color: #505050; }
.nav a:active, .nav a:hover { color: #DEAA35; }
.nav li { float: left; display: block; padding-left: 30px; margin-left: 6px; height: 88px; text-align: center; position: relative; }
.nav .n_a { display: block; height: 88px; line-height: 88px; font-size: 18px; position: relative; }
.nav .n_a::before { backface-visibility: hidden; bottom: 0; content: ""; display: block; height: 4px; left: 50%; position: absolute; width: 0; transition: 300ms; -webkit-transition: 300ms; -ms-transition: 300ms; }
.nav .n_a::after { backface-visibility: hidden; background: #7b6846 none repeat scroll 0 0; bottom: 0; content: ""; display: block; height: 4px; position: absolute; left: 50%; width: 0; transition: 300ms; -webkit-transition: 300ms; -ms-transition: 300ms; }
.nav .n_a:hover::before { backface-visibility: hidden; background: #DEAA35 none repeat scroll 0 0; width: 100%; left: 0px; }
.nav .n_a:hover::after { backface-visibility: hidden; background: #DEAA35 none repeat scroll 0 0; width: 100%; left: 0px; }
.nav .n_a.active::before { backface-visibility: hidden; background: #006766 none repeat scroll 0 0; bottom: 0; content: ""; display: block; height: 4px; left: 0; position: absolute; width: 100%; left: 0px; }
.nav .n_a.active::after { backface-visibility: hidden; background: #006766 none repeat scroll 0 0; bottom: 0; content: ""; display: block; height: 4px; position: absolute; right: 0; transition: all 0.5s ease 0s; width: 100%; left: 0px; }
.nav .n_a.active:hover::before { backface-visibility: hidden; background: #7b6846 none repeat scroll 0 0; width: 100%; }
.nav .n_a.active:hover::after { backface-visibility: hidden; background: #7b6846 none repeat scroll 0 0; width: 100%; }
.no-csstransitions .nav .n_a { height: 84px; }
.no-csstransitions .nav .n_a::after, .no-csstransitions .nav .n_a::after, .no-csstransitions .nav a:hover::before, .no-csstransitions .nav a:hover::after, .nav .n_a.hov::after, .nav .n_a.hov::after, .nav a:hover.hov::before, .nav a:hover.hov::after { display: none; }
.no-csstransitions .nav .n_a.active, .no-csstransitions .nav .n_a:hover { border-bottom: 4px solid #DF014E; }
.nav .subnav { display: none; position: absolute; width: 132px; border-top: 4px solid #7b6846; background-color: #076f66; left: 0px; top: 92px; padding: 8px 0px 17px; }
.nav .subnav a { display: block; text-align: center; height: auto; line-height: 1.5; font-size: 16px; color: #fee2bb; padding: 5px 0px; margin-bottom: 2px; }
.nav .subnav a:hover { background-color: #055b54; }
.nav .subnav .bot { background: url(../images/nbot.png) no-repeat scroll center bottom; width: 69px; height: 22px; margin: 0px auto; }
.menu-handler { width: 68px; height: 78px; cursor: pointer; display: none; float: right; position: fixed; right: 0px; top: 0px; z-index: 1006; background-color: #087b7a; }
.menu-handler .burger { width: 36px; height: 5px; background: #fff; display: block; position: absolute; z-index: 5; top: 24px; left: 50%; margin: 0 0 0 -18px; transform-origin: center; -webkit-transform-origin: center; -moz-transform-origin: center; -o-transform-origin: center; -ms-transform-origin: center; border-radius: 3px; }
.menu-handler .burger-2 { top: 36px; }
.menu-handler .burger-3 { top: 48px; }
.menu-handler.active .burger-1 { top: 36px; -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
.menu-handler.active .burger-2 { -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); filter: alpha(opacity=0); opacity: 0; -moz-opacity: 0; -khtml-opacity: 0; -webkit-opacity: 0; }
.menu-handler.active .burger-3 { top: 36px; -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
.trans, .trans:hover { -webkit-transition: all 277ms ease-in-out; -moz-transition: all 277ms ease-in-out; -o-transition: all 277ms ease-in-out; transition: all 277ms ease-in-out; -ms-transition: all 277ms ease-in-out; }
.trans-fast, .trans-fast:hover { -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; }
#menu-holder { position: fixed; right: -350px; top: 0px; width: 270px; padding: 0px 25px; height: 100%; overflow-x: hidden; overflow-y: auto; background-color: #087b7a; color: #fff; z-index: 1005; -webkit-overflow-scrolling: touch; -webkit-transition: 400ms; -moz-transition: 400ms; -o-transition: 400ms; transition: 400ms; }
#menu-holder a:link, #menu-holder a:visited { color: #fff; }
#menu-holder a:active, #menu-holder a:hover { color: #8de0df; }
#menu-holder .msubnav a:link, #menu-holder .msubnav a:visited { color: #8de0df; }
#menu-holder .msubnav a:active, #menu-holder .msubnav a:hover { color: #fff; }
.navMobile { padding: 0px 0px 15%; margin-top: 86px; display: block; }
.navMobile dd { padding-bottom: 20px; position: relative; width: 100%; }
.navMobile p a { font: bold 25px/1.2 "microsoft yahei"; display: block; }
.navMobile .msubnav { width: 238px; padding-top: 16px; display: none; }
.navMobile .msubnav a { font-size: 16px; margin: 0px 12px 10px 0px; display: inline-block; }
.mfoot { position: relative; transition: 600ms 700ms; left: 100px; opacity: 0; }
.sharp { padding: 18px 0px; position: relative; }
.sharp a { display: block; float: left; margin-right: 20px; width: 40px; height: 35px; background: url(../images/sharp.png) no-repeat; }
.sharp a.s1 { background-position: 0px 0px; }
.sharp a.s2 { background-position: -62px 0px; }
.sharp a.s3 { background-position: -124px 0px; }
#menu-holder .g-tel { font-size: 14px; }
#bg-menu { background-color: rgba(0,0,0,0.8); position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; cursor: url("../images/close-icon.ico") 16 16, default; z-index: 1004; display: none; }
.open #menu-holder { right: 0px; }
.mtop { height: 89px; }
.foot { position: relative; z-index: 5; }
.foot a:link, .foot a:visited { color: #646464; }
.foot a:active, .foot a:hover { color: #006766; }
.linkDL { border-top: 1px solid #787878; border-bottom: 1px solid #787878; padding: 44px 0px; color: #969696; font-size: 14px; }
.linkDL dd { float: left; display: block; margin-left: 55px; }
.linkDL .lt { font-weight: bold; color: #646464; font-size: 16px; }
.linkDL dd.item1 { float: left; margin-left: 0px; }
.linkDL .sharp a { background-image: url(../images/sharp2.png); }
.linkDL .sharp a:hover { background-image: url(../images/sharp3.png); }
.finner { padding: 12px 0px; }
.foot .finner .l { width: 70%; }
.pbanner { width: 100%; position: relative; overflow: hidden; }
.pbanner .pimg { display: block; width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; background-repeat: no-repeat; background-position: top center; background-size: cover; }
.pbanner .pbox { position: relative; z-index: 2; }
.pbanner.trans-1 .pbox1, .pbanner.trans-1 .pbox7 { -webkit-transition: all 1s cubic-bezier(.165, .74, .44, 1); -moz-transition: all 1s cubic-bezier(.165, .74, .44, 1); -o-transition: all 1s cubic-bezier(.165, .74, .44, 1); -ms-transition: all 1s cubic-bezier(.165, .74, .44, 1); transition: all 1s cubic-bezier(.165, .74, .44, 1); -webkit-animation: flipInX .7s ease-in-out both; -moz-animation: flipInX .7s ease-in-out both; -ms-animation: flipInX .7s ease-in-out both; animation: flipInX .7s ease-in-out both; -webkit-animation-delay: .4s; -moz-animation-delay: .4s; -ms-animation-delay: .4s; animation-delay: .4s; }
.pbanner.trans-1 .pbox2, .pbanner.trans-1 .pbox5 { -webkit-transition: all 1s cubic-bezier(.165, .74, .44, 1); -moz-transition: all 1s cubic-bezier(.165, .74, .44, 1); -o-transition: all 1s cubic-bezier(.165, .74, .44, 1); -ms-transition: all 1s cubic-bezier(.165, .74, .44, 1); transition: all 1s cubic-bezier(.165, .74, .44, 1); -webkit-animation: fadeInLeft .7s ease-in-out both; -moz-animation: fadeInLeft .7s ease-in-out both; -ms-animation: fadeInLeft .7s ease-in-out both; animation: fadeInLeft .7s ease-in-out both; -webkit-animation-delay: .4s; -moz-animation-delay: .4s; -ms-animation-delay: .4s; animation-delay: .4s; }

@-webkit-keyframes flipInX {
    0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; }
    40% { -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); }
    70% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); }
    100% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; }
}

@keyframes flipInX {
    0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; }
    40% { -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); }
    70% { -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); }
    100% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; }
}

.flipInX { -webkit-backface-visibility: visible!important; -ms-backface-visibility: visible!important; backface-visibility: visible!important; -webkit-animation-name: flipInX; animation-name: flipInX; }

@-webkit-keyframes fadeInLeft {
    0% { opacity: 0; -webkit-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); }
    100% { opacity: 1; -webkit-transform: none; transform: none; }
}

@keyframes fadeInLeft {
    0% { opacity: 0; -webkit-transform: translate3d(-100%,0,0); -ms-transform: translate3d(-100%,0,0); transform: translate3d(-100%,0,0); }
    100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; }
}

.fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; }
.page { padding: 65px 0px 85px; margin: 0px auto; }
.footPage { width: 1100px; margin: 0px auto; }
.tool a:link, .tool a:visited { color: #fff; }
.tool a:active, .tool a:hover { color: #fff; }
.tool { width: 51px; position: fixed; right: 0px; top: 45%; z-index: 600; color: #fff; }
.tool a { transition: 200ms; width: 51px; height: 51px; line-height: 51px; float: left; margin: 0 0 1px 0; background: #b4b4b4 url(../images/sharp5.png) no-repeat 0px 0px; display: inline-block; position: relative; border-radius: 5px 0 0 5px; position: relative; }
.tool .blacKTop { background-image: none; text-align: center; }
.tool .a2 { background-position: 16px 0px; }
.tool .a3 { background-position: 16px -52px; }
.tool .a3 .con { background-position: 16px -52px; border-radius: 5px 0 0 5px; background-color: #b4b4b4; padding-left: 51px; display: block; background-image: url(../images/sharp5.png); background-repeat: no-repeat; overflow: hidden; font-size: 18px; font-style: italic; font-family: Arial, Helvetica, sans-serif; position: absolute; width: 126px; right: -126px; top: 0px; }
.tool .a3:hover .con { background-color: #E48F52; }
.tool .a4 { background-position: 16px -104px; margin-bottom: 0px; }
.tool a:hover { background-color: #E48F52; }
.popUpblack { background: url(../images/black_bg.png) repeat; width: 100%; height: 100%; position: fixed; left: 0px; top: 0px; z-index: 1010; display: none; }
.popUp { width: 220px; height: 242px; border: 5px solid #999; background: #fff; position: fixed; left: 50%; top: 50%; margin: -87px 0 0 -115px; z-index: 1004; }
.popUp .t { padding: 0 0 0 10px; height: 26px; line-height: 26px; color: #666; font-weight: bold; border-bottom: 1px solid #e8e8e8; background: #f2f2f2; }
.popUp .t .close { padding: 0 10px 0 0; float: right; cursor: pointer; color: #666; font-weight: normal; }
.popUp .img { padding: 20px; }
.popUp .img img { width: 100%; height: 100%; display: block; }


@media screen and (max-width:1281px){
	.inner,.footPage,.pinner{ width: 1000px;}
	.banner .binbox{ width: 1000px; margin-left: -500px;}
	.binbox .bcon .bt{ font-size: 22px; width: 52px; padding-top: 2px; height: 52px;}
	.nav .n_a{ font-size: 16px;}
	.nav .subnav{ width: 128px;}
	.nav .subnav a{ font-size: 14px;}
	.ibox .inner{ width: 100%;}
	.ibox dd .ico{ margin: 0px 10px 0px 18px;}
	.ibox dd .zh{ font-size: 18px;}
	.ibox dd .en{ font-size: 11px;}
	.linkDL dd{ width: 26.33%; margin-left: 4%;}
	.linkDL dd.item1{ width: 35.33%;}
	.tankList dd{ width: 246px;}
	.tankList .name{ font-size: 18px;}
	.tankList .name2{ font-size: 20px;}
	.inewImg{ width: 500px; height: 265px;}
	.inewIcon{ width: 450px; height: 265px; margin-right: 0px;}
	.inewIcon .list li{ margin-bottom: 9px;}
	.inewIcon .list li a.t{ font-size: 18px;}
	.teamIbox{ margin: 80px 0px;}
	.team-info{ font-size: 12px;}
	.team-info .zh{ font-size: 22px;}
	.team-info .en{ font-size: 14px;}
	.team-info .c{ height: 40px;}
	.teamIbox dd.item1 .team-info .t{ padding: 12% 0px 10%;}
	.teamIbox dd.item1 .team-info .zh{ font-size: 28px;}
	.teamIbox dd.item1 .team-info .en{ font-size: 16px;}
	.teamIbox dd.item1 .team-info .c{ height: 126px;}
	.teamIbox dd.item15 .more{ margin:18% auto 10%;}
	.pbox1 .t,.pbox5 .t,.pbox6 .zh{ font-size: 50px;}
	.branchIpage{ width: 654px; margin-right: 70px;}
	.siderCase{ width: 224px;}
	.pageW{ width: 1000px;}
	.thinkOneList,.thinkforList{ width: 1000px;}
	.thinkOneList .item .txt,.thinkforList .item .txt{ height: 72px;}
	.thinkTwoList ul{ margin-left: -42px;}
	.thinkTwoList li{ width: 305px; margin:0px 0px 42px 42px;}
	.thinkforList .item .t{ margin-bottom: 0px;}
	.thinkforList .item .bot .time{ font-size: 12px; width: 120px;}
	.pbox3 .c{ font-size: 58px; line-height: 1.4;}
	.newsList ul{ width: 1022px;}
	.newsList li{ width: 318px;}
	.newsList .img{ height: 149px;}
	.cmenu a{ padding: 0px 16px; font-size: 19px;}
	.cmenu-sub a{ font-size: 13px;}
	.caseList ul{ width: 1026px;}
	.caseList li{ width: 317px; margin: 0px 25px 25px 0px;}
	.caseList .item .con{ font-size: 18px; line-height: 1.6;}
	.caseList .bcon .t{ font-size: 22px; line-height: 1.6;}
	.caseList .bcon .c{ font-size: 14px; height: 96px; margin-bottom: 40px;}
	.caseIcon{ width: 612px; padding: 25px 50px;}
	.pbanner5{ padding: 100px 0px 80px;}
	.urbanBox .con .c{ height: 64px;}
	.teamType ul{ padding-left: 3%;}
	.teamList{ width: 1030px;}
	.pbanner6{ padding:80px 0px 0px; height: 260px;}
	.pbanner7{ padding: 80px 0px 100px;}
	.pbox7 .zh{ font-size: 45px;}
	.businessPcon{ width: 704px;}
	.businessItem .img{ width: 50%;}
	.businessItem .con{ width: 44%;}
	.pbanner8{ padding: 80px 0px 90px;}
	.theorBox{ width: 1040px;}
	.pbanner9{ padding: 90px 0px;}
	.pbox9 .zh{ font-size: 55px;}
	.stylePCon li,.stylePCon .fistItem{ height: 403px;}
	.stylePCon .fistItem .con{  height: 331px; margin-left: 25px;padding: 0 110px 0 50px; width: 288px; font-size: 14px;}
	.stylePCon .fistItem .con .c{ height: 124px;}
	.mapBox{ height: 400px;}
	.aboutMenuBox2 dd{ width: 137px;}
	.aboutMenuBox2 dd a{ font-size: 18px;}
	.proMenu{ text-align: left;}
	.newMenu.fixed .newType-nav{ width: 1000px;}
}

.2vm1, .2vm2 { float:left;}
.2vm2 { margin-left:7px;}










































