@charset "utf-8";

.mainimg { display: none; }

.pu li {
	display: inline-block;
	vertical-align: top;
	width: 505px;
	height: 500px;
	margin-right: 10px;
	margin-bottom: 10px;
	border: 1px solid #2b4971;
	position: relative;
}
.pu li:nth-child(2n) { margin-right: 0; }
.pu li .img { margin-bottom: 39px; }
.pu li .txt { display: block; margin: 0 auto; }
.pu li a {
	display: block;
	position: relative;
	width: 505px;
	height: 500px;
	padding: 20px;
}
.pu li a div.info { padding-left: 110px; position: relative; }
.pu li a div.info .mk { position: absolute; top: 0px; left: 0; }
.pu .en {
	display: inline-block;
	background-color: #ffe100;
	width: 90px;
	height: 20px;
	text-align: center;
	line-height: 21px;
	font-size: 12px;
	font-family: 'Open Sans', sans-serif;
	margin-right: 10px;
	vertical-align: middle;
}
.pu h2.ttl {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	font-size: 26px;
	vertical-align: middle;
}
.pu p.txt {
	display: block;
	margin-top: 13px;
	border-top: 1px solid #b4b5b5;
	padding-top: 12px;
}
.pu li:before {
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 30px 30px;
	border-color: transparent transparent #2b4971 transparent;
	position: absolute;
	bottom: 0px;
	right: 0px;
	-webkit-transition: 0.4s ease-in-out;
	   -moz-transition: 0.4s ease-in-out;
		 -o-transition: 0.4s ease-in-out;
			transition: 0.4s ease-in-out;
}
.pu li:hover:before {
	border-width: 0 0 50px 50px;
}
.pu li a:before, .svc li a:before {
	content: '';
	display: block;
	width: 465px;
	height: 300px;
	background-color: rgba(0,0,0,0);
	position: absolute;
	top: 20px;
	-webkit-transition: 0.2s ease-in-out;
	   -moz-transition: 0.2s ease-in-out;
		 -o-transition: 0.2s ease-in-out;
			transition: 0.2s ease-in-out;
}
.svc li a:before {
	width: 326px;
	height: 220px;
	top: 0;
	border-radius: 5px;
}
.pu li a:hover:before, .svc li a:hover:before {
	background-color: rgba(0,0,0,0.5);
}
.pu .on, .svc .on {
	position: absolute;
	top: 140px;
	left: 0;
	color: #fff;
	text-align: center;
	width: 100%;
	font-size: 16px;
	opacity: 0;
}
.svc .on { top: 80px; }
.pu .on span.box, .svc .on span.box {
	display: block;
	font-size: 14px;
	font-family: 'Open Sans', sans-serif;
	width: 165px;
	height: 40px;
	margin: 0 auto 10px auto;
	line-height: 40px;
	color: transparent;
	-webkit-transition: 0.3s ease-in-out 0.2s;
	   -moz-transition: 0.3s ease-in-out 0.2s;
		 -o-transition: 0.3s ease-in-out 0.2s;
			transition: 0.3s ease-in-out 0.2s;
}
.pu .on:before,.pu .on:after,.pu .on span.box:before,.pu .on span.box:after,
.svc .on:before,.svc .on:after,.svc .on span.box:before,.svc .on span.box:after {
	content:'';
	display: block;
	background-color: #fff;
	position: absolute;
	opacity: 0;
}
.pu .on:before, .svc .on:before {
	-webkit-transition: 0.1s ease-in-out 0.0s;
	   -moz-transition: 0.1s ease-in-out 0.0s;
		 -o-transition: 0.1s ease-in-out 0.0s;
			transition: 0.1s ease-in-out 0.0s;
}
.pu .on span.box:after, .svc .on span.box:after {
	-webkit-transition: 0.1s ease-in-out 0.05s;
	   -moz-transition: 0.1s ease-in-out 0.05s;
		 -o-transition: 0.1s ease-in-out 0.05s;
			transition: 0.1s ease-in-out 0.05s;
}
.pu .on:after, .svc .on:after {
	-webkit-transition: 0.1s ease-in-out 0.1s;
	   -moz-transition: 0.1s ease-in-out 0.1s;
		 -o-transition: 0.1s ease-in-out 0.1s;
			transition: 0.1s ease-in-out 0.1s;
}
.pu .on span.box:before, .svc .on span.box:before {
	-webkit-transition: 0.1s ease-in-out 0.15s;
	   -moz-transition: 0.1s ease-in-out 0.15s;
		 -o-transition: 0.1s ease-in-out 0.15s;
			transition: 0.1s ease-in-out 0.15s;
}
.pu .on:before { width: 0px; height: 1px; top: 0px; left: 170px; }
.pu .on:after { width: 0px; height: 1px; top: 40px; right: 170px; }
.pu .on span.box:before { width: 1px; height: 0px; bottom: 0px; left: 0px; }
.pu .on span.box:after { width: 1px; height: 0px; top: 0px; left: 164px; }

.svc .on:before { width: 0px; height: 1px; top: 0px; left: 80px; }
.svc .on:after { width: 0px; height: 1px; top: 40px; right: 81px; }
.svc .on span.box:before { width: 1px; height: 0px; bottom: 0px; left: 0px; }
.svc .on span.box:after { width: 1px; height: 0px; top: 0px; left: 164px; }

.pu .on span.txt, .svc .on span.txt {
	opacity: 0;
	-webkit-transition: 0.2s ease-in-out 0.4s;
	   -moz-transition: 0.2s ease-in-out 0.4s;
		 -o-transition: 0.2s ease-in-out 0.4s;
			transition: 0.2s ease-in-out 0.4s;
}
.pu a:hover .on span.txt, .svc a:hover .on span.txt { opacity: 1; }
.pu a:hover .on, .svc a:hover .on { opacity: 1; }
.pu a:hover .on span, .svc a:hover .on span { color: #fff; }
.pu a:hover .on:before, .svc a:hover .on:before { width: 165px; opacity: 1; }
.pu a:hover .on:after, .svc a:hover .on:after { width: 165px; opacity: 1; }
.pu a:hover .on span.box:before, .svc a:hover .on span.box:before { height: 40px; opacity: 1; }
.pu a:hover .on span.box:after, .svc a:hover .on span.box:after { height: 40px; opacity: 1; }



.news_box { position: relative; }
.news {
	width: 663px;
	height: 250px;
	border-top: 1px solid #b4b5b5;
	border-bottom: 1px solid #b4b5b5;
	padding: 10px 0;
}
.news li {
	height: 18px;
	line-height: 18px;
	margin: 23px 0;
}
.ihh {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	vertical-align: top;
	width: 306px;
	height: 250px;
	overflow: hidden;
}
.ihh img {
	position: absolute;
	top: 0;
	left: 0;
	width: 306px;
	-webkit-transition: 1s ease-in-out;
	   -moz-transition: 1s ease-in-out;
		 -o-transition: 1s ease-in-out;
			transition: 1s ease-in-out;
}
.ihh:after {
	content: '';
	width: 306px;
	height: 158px;
	display: block;
	background: url(../images/ihh_a3.png) no-repeat 0 0;
	position: absolute;
	bottom: 0;
}
.ihh:hover img {
-moz-transform: scale(1.13);
-webkit-transform: scale(1.13);
-o-transform: scale(1.13);
-ms-transform: scale(1.13);
}

.svc li {
	display: inline-block;
	width: 326px;
	vertical-align: top;
	margin-right: 21px;
	position: relative;
}
.svc li:last-child { margin-right: 0; }
.svc li img { margin-bottom: 20px; }
.svc li span.en {
	display: block;
	background-color: #ffe100;
	width: 126px;
	height: 20px;
	text-align: center;
	line-height: 21px;
	font-size: 12px;
	font-family: 'Open Sans', sans-serif;
	vertical-align: middle;
	margin: 0 auto 20px auto;
}
.svc li h2 {
	color: #2a466e;
	font-size: 21px;
	text-align: center;
	margin-bottom: 20px;
}
.svc li p.txt {
	border-top: 1px solid #b4b5b5;
	padding-top: 18px;
}


#hero,
#slide-container,
#slide-container .item,
#slide-container .background{ width:1020px; height: 400px; margin: 0 auto; padding: 0 0; }
#hero{ overflow:hidden; margin-bottom: 80px; }
#slide-container{ position:relative; }
#slide-container .item{ position:absolute; top:0; left:0; display:none; overflow:hidden; }
#slide-container .background { position:absolute; background-position:center center; background-repeat:no-repeat; overflow:hidden; }
#slide-container .foreground{ position:absolute; top: 0; left: 60px; }
#slide-container .first .background{ background-image:url(../images/slide1.jpg); }
#slide-container .second .background{ background-image:url(../images/slide2.jpg); }
#slide-container .third .background{ background-image:url(../images/slide3.jpg); }
#slide-container .fourth .background{ background-image:url(../images/slide4.jpg); }
#group{
margin:15px;
font-size:25px;
color:#2a466e;
margin-left:430px;
margin-top :150px;
margin-bottom :30px;
font-family:Ÿà–¾’©;

}