@charset "utf-8";
/* CSS Document */
/* index */
body{}
.op0{filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;}

.bg-enc{ position:absolute; left:0; top:0; width:100%; height:100%; background:no-repeat center center; background-size:cover;}
.bg-enc:after{ content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(38,34,25,0.4);}
.flex-logo{ position: fixed; left:2%; top:5%; z-index:90;}
.sloct{ position:fixed; right:3%; top:5%; z-index:90;}
.search span{ display:block; width:50px; height:50px; background:url(../images/sc.png) no-repeat center center;}
.menu-calt{ width:50px; height:50px; cursor:pointer; margin-left:10px; position:relative; background:#7d58bf; position:relative; border-radius:50%;transition:all 0.5s ease;}
.menu-calt:before{ content:''; position:absolute; left:50%; top:50%; height:2px; width:20px; margin-left:-10px; margin-top:-6px; background:#fff; transition:all 0.5s ease;}
.menu-calt:after{ content:''; position:absolute; left:50%; top:50%; height:2px; width:20px; margin-left:-10px; margin-top:4px; background:#fff; transition:all 0.5s ease;}
.menu-calt.on{ background:#fff;transition:all 0.5s ease;}
.menu-calt.on:before{ background:#7d58bf; margin-top:-1px; transform:rotate(45deg); transition:all 0.5s ease;}
.menu-calt.on:after{ background:#7d58bf; margin-top:-1px; transform:rotate(-45deg); transition:all 0.5s ease;}
.benla:after{ content:''; position:absolute; left:0; top:0; width:100%; height:100%; background: url(/home/bg.png);}


.alocc{ position:relative; z-index:5; color:#fff; padding:0 10%;}
.alocc .p1{ font-weight:bold; font-size:58px;}
.alocc .p2{ font-size:16px; margin-top:20px;}
.alocc .p3{ margin-top:65px;}
.alocc .p3 a{ display:inline-block; width:260px; line-height:60px; color:#fff; border:2px solid #fff; text-align:center; font-weight:bold; position:relative;}
.alocc .p3 a span{ position:relative; z-index:2;}
.alocc .p3 a:after{ content:''; position:absolute; left:0; top:0; width:0; height:100%; background:#00507d; transition:all 0.5s ease; z-index:1;}
.alocc .p3 a:hover:after{ width:100%; transition:all 0.5s ease;}



.top-locls{ position:fixed; left:0; top:3%; width:100%; z-index:10; padding-right:3%;}
.roale{ padding-top:20px;}
.menuc{ width:60px; height:60px;  margin-right:20px; position:relative;}
.menuc span{ height:2px; width:30px; position:absolute; left:15px; top:29px; background:#fff; display:block; transition:all 0.5s ease;}
.menuc:before{ content:''; position:absolute; left:15px; top:50%; margin-top:-12px; width:30px; background:#fff; height:2px; transition:all 0.5s ease;}
.menuc:after{ content:''; position:absolute; left:15px; top:50%; margin-top:10px; width:30px; background:#fff; height:2px; transition:all 0.5s ease;}
.menuc.on span{ width:0; transition:all 0.5s ease;}
.menuc.on:before{ margin-top:-1px; transform:rotate(45deg); transition:all 0.5s ease;}
.menuc.on:after{ margin-top:-1px; transform:rotate(-45deg); transition:all 0.5s ease;}

.search{ padding:0 20px; border-right:1px solid rgba(255,255,255,0.3);}
.roale a{ float:left; margin-left:20px; color:rgba(255,255,255,0.3);}
.roale a.cur{ font-weight:bold; color:#fff;}


.sc-neca{ position:fixed; z-index:9; left:0; top:0; width:100%; height:100%; background:#002035; opacity:0; visibility:hidden;transition:all 0.6s ease;}
.sc-neca.on{ opacity:1; visibility: visible; transition:all 0.6s ease;}
.tabce{ position:absolute; left:0; top:0; width:100%; height:100%; display:table; padding:0 10%;}
.tabce dl{ float:left; width:14%; color:#fff; transform:translateY(50px); opacity:0; transition:all 0.5s ease 0s;}
.sc-neca.on dl{ transform:translateY(0); opacity:1; transition:all 0.5s ease 0s;}
.sc-neca.on dl:nth-child(2){ transition-delay:0.2s;}
.sc-neca.on dl:nth-child(3){ transition-delay:0.4s;}
.sc-neca.on dl:nth-child(4){ transition-delay:0.6s;}
.sc-neca.on dl:nth-child(5){ transition-delay:0.8s;}
.sc-neca.on dl:nth-child(6){ transition-delay:1.0s;}
.sc-neca.on dl:nth-child(7){ transition-delay:1.2s;}
.tabce dl dt{ font-weight:bold; font-size:22px; margin-bottom:20px;}
.tabce dl dd{ line-height:30px;}
.tabce dl dd a{ color:rgba(255,255,255,0.5);}

.gdloc{ position:fixed; z-index:6; left:0; width:100%; bottom:3%;}


.os-posc{ position:absolute; left:0; top:0; width:100%; height:100%;}
.pad-solc{ padding:0 10%; position:absolute; left:0; top:13%; width:100%;}
.pad-solc .title{ font-size:42px; font-weight:bold; color:#fff; opacity:0; transform:translateY(-80px); transition:all 0.5s ease;}
.active .pad-solc .title{ opacity:1; transform:translateY(0px); transition:all 0.5s ease 0.3s;}


.cs-list{ margin-top:5%;}
.cs-list li{ width:18.2%; float:left; margin-right:2%; opacity:0; transform:translateY(80px); transition:all 0.5s ease;}
.active .cs-list li{ opacity:1; transform:translateY(0px); transition:all 0.5s ease 0.3s;}
.cs-list li:nth-child(2){ transition-delay:0.6s;}
.cs-list li:nth-child(3){ transition-delay:0.9s;}
.cs-list li:nth-child(4){ transition-delay:1.2s;}
.cs-list li:nth-child(5){ transition-delay:1.5s;}

.cs-list li:nth-child(5n){ margin-right:0;}
.cs-list li a{ display:block; transition:all 0.5s ease;}
.cs-list li a .pic{ overflow:hidden;}
.cs-list li a .pic img{ transition:all 0.5s ease;}
.cs-list li a .pic span{ display:block; position:absolute; left:0; top:0; width:100%; height:100%; border:8px solid #00507d; background:rgba(0,80,125,0.35); visibility:hidden; opacity:0; transition:all 0.5s ease;}
.cs-list li a .pic span i{ width:30px; height:30px; display:block; background:url(/home/js.png) no-repeat; transition:all 0.5s ease; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.cs-list li a .tit{ font-size:20px; color:#fff; font-weight:bold; overflow:hidden; line-height:40px; height:0px; transition:all 0.5s ease;}
.cs-list li a .con{ line-height:20px; height:0px; overflow:hidden; color:rgba(255,255,255,0.5); transition:all 0.5s ease;}
.cs-list li a .bq{ margin-top:15px;visibility:hidden; opacity:0; transition:all 0.5s ease;}


.cs-list li a:hover{ transform:translateY(-30px);transition:all 0.5s ease;}
.cs-list li a:hover .pic img{ transition:all 0.5s ease; transform:scale(1.1);}
.cs-list li a:hover .pic span{visibility: visible; opacity:1; transition:all 0.5s ease;}
.cs-list li a:hover .tit,.cs-list li a:hover .con{ height:80px; transition:all 0.5s ease;}
.cs-list li a:hover .bq{visibility: visible; opacity:1; transition:all 0.5s ease;}















.roslm{ position:fixed; right:3%; bottom:5%; z-index:10;}
.ewmc{ margin-right:30px;}
.bg-oalc{ position:fixed; left:0; top:0; width:100%; height:100%; z-index:99; background:rgba(0,0,0,0.6) url(../testimg/ewm.png) no-repeat center center; display:none;}
.mid-loac{ position:relative; margin-bottom:0px; z-index:5; height:359px; background:url(../images/mid-logo02.png) no-repeat center center; background-size:auto 100%;}
.mid-loac.on{ margin-bottom:300px; background:url(../images/mid-logo01.png) no-repeat center center; background-size:auto 100%; transition:all 1s ease;}
.benla{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:4; opacity:0; overflow:hidden; visibility:hidden;}
.benla.on{ opacity:1; visibility: visible; transition:all 0.5s ease;}

.dh-ovrea{ background: url(../testimg/t2.jpg) no-repeat center center; background-size:cover; position:fixed; left:0; top:0; width:100%; height:100%; z-index:50; visibility:hidden; opacity:0; transition:all 1s ease;}
.dh-ovrea.on{ visibility: visible; opacity:1; transition:all 1s ease;}
.min-logo{ position:absolute; left:0; width:100%; top:5%;}
.dis-tab{ position:absolute; left:0; top:0; width:100%; height:100%;/* display:table;*/ padding:280px 12.5% 0;}
.tab-cell{ display:table-cell; vertical-align:middle;}
.bealm{ font-size:0;}
.bealm li{ width:23.5%; float:left; padding-top:110px; transition:all 0.5s ease; margin-right:2%; border-bottom:1px solid rgba(255,255,255,0.5); color:#fff; opacity:0; transform:scale(0.5);}
.dh-ovrea.on .bealm li,.dh-ovrea.on .nav-botc li{ opacity:1; transform:scale(1);transition:all 0.5s ease;}

.bealm li:nth-child(4n){ margin-right:0;}
.bealm li a{ text-align:center; color:#fff; display:block;}
.bealm li .tit{ padding-bottom:12px; font-size:24px; position:relative;}
.bealm li .pic{ height:0px; transition:all 0.5s ease; overflow:hidden; background:no-repeat center center; background-size:cover;}
.bealm li:hover{ padding-top:0px; border-bottom:1px solid #fff; transition:all 0.5s ease;}
.bealm li:hover .pic{ height:110px; transition:all 0.5s ease;}

.nav-botc{ margin-top:6%;}
.nav-botc li{ width:25%; text-align:center; float:left; opacity:0; transform:scale(0.5);}
.nav-botc li a{ margin:0 auto; display:inline-block; color:#fff;}
.nav-botc li a .tit{ font-size:24px; line-height:40px; width:30px; text-align:center;}
.nav-botc li a .con{ margin-left:15px; padding-top:40px; text-align:left; font-size:16px;}
.nav-botc li a .con .p2{ margin-top:12px;}

.annct{ position:absolute; width:100px; left:50%; margin-left:-50px; text-align:center; bottom:3%; z-index:5;}
.annct a{ display:block;}
.annct .yd span{ display:inline-block; width:9px; height:9px; border-radius:50%; background:#fff; transition:all 0.6s ease;}
.annct .line span{ display:inline-block; width:1px; background:#fff; height:44px; transition:all 0.6s ease;}
.annct .yqsc span{ cursor:pointer; display:inline-block; border-radius:50%; border:2px solid #fff; width:23px; height:23px; position:relative;transition:all 0.6s ease;}
.annct .yqsc span i{ width:0; height:0; background:#fff; border-radius:50%; position:absolute; left:50%; top:50%; margin:0;}
.annct.on .yd span{ width:0; height:0; transition:all 0.6s ease;}
.annct.on .line span{ height:0; transition:all 0.6s ease;}
.annct.on .yqsc span{width:40px; height:40px;transition:all 0.6s ease;}
.annct.on .yqsc span i{ width:8px; height:8px; margin:-4px 0 0 -4px;}


.lboal{ padding:0 10%;}
.arenc{ width:26%; background:#00507d; padding:30px; color:#fff; opacity:0; transform:translateX(-80px);transition:all 0.5s ease;}
.arenc .p2{ margin-top:40px; line-height:40px; height:120px; overflow:hidden; font-size:26px;}
.arenc .p3{ line-height:25px; height:175px; overflow:hidden; margin-top:40px;}
.arenc .p4{ margin-top:40px;}
.arenc .p4 a{ display:inline-block; width:200px; line-height:50px; color:#fff; border:2px solid #fff; text-align:center; font-weight:bold; position:relative;}
.arenc .p4 a span{ position:relative; z-index:2;}
.arenc .p4 a span img{ margin-left:30px;}
.arenc .p4 a:after{ content:''; position:absolute; left:0; top:0; width:0; height:100%; background:#003c5e; transition:all 0.5s ease; z-index:1;}
.arenc .p4 a:hover:after{ width:100%; transition:all 0.5s ease;}

.active .arenc{ opacity:1; transform:translateX(0px); transition:all 0.5s ease 0.5s;}
.active .olapc{ opacity:1; transform:translateX(0px); transition:all 0.5s ease 0.3s;}


.olapc{ width:44%; margin:0 2%; background:url(/home/t9.jpg) no-repeat center center; background-size:cover;}

.sloac{ width:26%;}
.cdst{ height:255px; background:#00507d; padding:30px; color:#fff; opacity:0; transform:translateY(-80px);transition:all 0.5s ease;}
.amlo{ transform:translateY(80px);}
.active .cdst{ opacity:1; transform:translateX(0px);transition:all 0.5s ease 0.3s;}


.cdst .p2{ font-size:26px; margin-top:40px;}
.amlo{ margin-top:40px; background:url(/home/t10.jpg) no-repeat center center; background-size:cover;}
.omfdl{ color:#fff;}
.omfdl .p1{ font-size:58px; font-weight:bold; opacity:0; transform:translateY(80px); transition:all 0.5s ease;}
.omfdl .p2{ line-height:25px; margin-top:20px; opacity:0; transform:translateY(80px); transition:all 0.5s ease;}
.omfdl .p3{ margin-top:60px; opacity:0; transform:translateY(80px); transition:all 0.5s ease;}
.omfdl .p3 a{ display:inline-block; width:200px; line-height:50px; color:#fff; border:2px solid #fff; text-align:center; font-weight:bold; position:relative;}
.omfdl .p3 a img{ margin-right:15px;}
.omfdl .p3 a span{ position:relative; z-index:2;}
.omfdl .p3 a:after{ content:''; position:absolute; left:0; top:0; width:0; height:100%; background:#003c5e; transition:all 0.5s ease; z-index:1;}
.omfdl .p3 a:hover:after{ width:100%; transition:all 0.5s ease;}

.active .omfdl .p1{ opacity:1; transform:translateY(0px); transition:all 0.5s ease 0.3s;}
.active .omfdl .p2{ opacity:1; transform:translateY(0px); transition:all 0.5s ease 0.6s;}
.active .omfdl .p3{ opacity:1; transform:translateY(0px); transition:all 0.5s ease 0.9s;}


.foot{ background:#fff; padding:0 10%; position:relative; z-index:7;}
.foot .sonla{ padding:40px 0;}
.foot dl{ width:12.5%;}
.lsdoc{ width:12.5%; text-align:right;}
.foot dl dt{ font-size:22px; font-weight:bold; padding-bottom:15px; position:relative; margin-bottom:12px;}
.foot dl dt:after{ content:''; position:absolute; left:0; bottom:0; width:60%; height:1px; background:#eee;}
.foot dl dd{ line-height:30px;}
.foot dl dd a{ color:#898989;}
.foot dl dd a:hover{ color:rgb(0,80,125);}
.olspc{ padding:20px 0; color:#898989; border-top:1px solid #eee;}

.section{ background:no-repeat center center; background-size:cover;}
.hdc-abs{ position:absolute; right:10%; bottom:20%; transform:rotateY(180deg); z-index:5;}
.med-onc{ position:relative; z-index:5; padding-bottom:15%;}
.med-onc .p1{ visibility:hidden; opacity:0; transform:translateY(80px); transition:all 0.5s ease;}

.med-onc .p2{ margin-top:1%; visibility:hidden; opacity:0; transform:translateY(80px); transition:all 0.5s ease;}
.med-onc .p3{ height:90px; margin-top:1%; visibility:hidden; opacity:0; transform:translateY(80px); transition:all 0.5s ease;}
.med-onc .p3 span{ height:90px; width:90px; position:relative; background:url(../testimg/p3.png) no-repeat center center; display:inline-block;}
.med-onc .p3 span i{ display:block; position:absolute; left:50%; top:50%; width:43px; height:43px; transform:translate(-50%,-50%); border-radius:50%; border:2px solid #efd195;animation: mouse 1.6s linear 0s infinite;}

.med-onc .ps3 span{ background:url(../testimg/ps3.png) no-repeat center center;}
.med-onc .ps3 span i{border:2px solid #fff;}



.active .med-onc .p1,.active .med-onc .p2,.active .med-onc .p3{ visibility: visible; opacity:1; transform:translateY(0px); transition:all 0.5s ease 0.3s;}
.active .med-onc .p2{ transition-delay:0.6s;}
.active .med-onc .p3{ transition-delay:0.9s;}


.zc-onc{ position:absolute; left:0; bottom:0; background:#7d58bf; padding:40px 3%; z-index:5; width:25%; transform:translateX(-100%); transition:all 0.5s ease;}
.active .zc-onc{ transform:translateX(0); transition:all 0.5s ease 0.8s;}
.pacla a{ margin-left:30px; transform:translateX(0%); transition:all 0.5s ease 0.3s;}

.snow-container{position: absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1;}

.boxc{ position:absolute; left:0; top:0; width:100%; height:100%; overflow:hidden; opacity:0; visibility:hidden; transition:all 3s ease;}
.active .boxc{ opacity:1; visibility: visible; transition:all 3s ease;}

.pic1{ position:absolute; right:0; bottom:0;}
.pic1 img{ position:absolute; right:-200px; bottom:-200px; max-width:999px;}
.pic2{ position:absolute; right:0; top:0;}
.pic2 img{ position:absolute; right:-50px; top:-50px; max-width:999px;}

.pic3{ position:absolute; left:0; bottom:0; width:100%;}
.pic3 img{ position:absolute; left:18%; bottom:-120px; max-width:999px;}
.pic4{ position:absolute; left:0px; top:0px;}
.pic4 img{ position:absolute; left:-50px; top:-50px; max-width:999px;}
.pic5{ position:absolute; left:0; top:0;}
.pic5 img{ position:absolute; left:310px; top:-40px; max-width:999px;}





@-moz-keyframes mouse {
  0% {
    width:45px;
	height:45px;
	opacity:0.7;
  }
  80% {
    width:80px;
	height:80px;
	opacity:0.2;
  }
  95% {
    width:88px;
	height:88px;
	opacity:0;
  }
  100% {
    width:45px;
	height:45px;
	opacity:0;
  }
}
@-webkit-keyframes mouse {
  0% {
    width:45px;
	height:45px;
	opacity:0.7;
  }
  80% {
    width:80px;
	height:80px;
	opacity:0.2;
  }
  95% {
    width:88px;
	height:88px;
	opacity:0;
  }
  100% {
    width:45px;
	height:45px;
	opacity:0;
  }
}
@keyframes mouse {
  0% {
    width:45px;
	height:45px;
	opacity:0.7;
  }
  80% {
    width:80px;
	height:80px;
	opacity:0.2;
  }
  95% {
    width:88px;
	height:88px;
	opacity:0;
  }
  100% {
    width:45px;
	height:45px;
	opacity:0;
  }
}