/* ================================
Imports
================================= */
@import url('font-awesome.min.css');
@import url('simpletextrotator.css');
@import url('overwrite.css');
@import url('animate.css');

/* ================================
General
================================= */

body{
	text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	line-height: 1.6em;
}

body, ul, ol, dl, dt, dd, h1, h2, h3, h4, h5, h6 {
	list-style:none;
	text-decoration:none;
	margin: 0;
}

h1 {
	font-size: 36px;
}
h2 {
	font-size: 32px;
}
h3 {
	font-size: 28px;
}
h4 {
	font-size: 24px;
}
h5 {
	font-size: 20px;
}
h6 {
	font-size: 18px;
}

h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{
	color: #3a3a3a;
	font-weight: 700;
	margin-bottom: 20px;
	font-family: 'Montserrat', sans-serif;
}


.lead{
	font-weight: 400;
}

button {
	display: inline-block;
	margin-bottom: 0;
	margin-bottom: 10px;
	padding: 6px 12px;
	border: 1px solid transparent;
	vertical-align: middle;
	text-align: center;
	white-space: nowrap;
	font-weight: normal;
	font-size: 14px;
	line-height: 1.428571429;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
button.navbar-toggle {
	background: #2b2b2b;
	border: none;
	color: #fff;
}

.btn-theme,.btn-theme:hover,.btn-theme:focus{
	color: #FCCC00;
}

.btn-theme{

	 background-color:#002657;
}

.btn-theme:hover{
	background: transparent !important;
	border-color: #999;
	color: #999;
}

/* ================================
margin, padding
================================= */
.mar-top0 {
	margin-top: 0;
}
.mar-top10 {
	margin-top: 10px;
}
.mar-top20 {
	margin-top: 20px;
}
.mar-top30 {
	margin-top: 30px;
}
.mar-top40 {
	margin-top: 40px;
}
 #youkuplayer{ width:100%; height:550px;}

/* Back to top button */
.back-to-top {
  position: fixed;
  display: none;
  padding: 6px 12px 9px 12px;
  font-size: 16px;
  border-radius: 2px;
  right: 15px;
  bottom: 15px;
  transition: background 0.5s;
  z-index:1000;
}

@media (max-width: 1000px) {
  .back-to-top {
    bottom: 15px;
  }
  .navbar-default .navbar-nav>li>a {
	 font-size:12px;

}
    #youkuplayer{ width:100%; height:400px;}
  
}



.back-to-top:focus {
  outline: none;
}

/* ================================
Navbar
================================= */


nav.navbar{
	/* position: fixed;*/
	top: 0px;
	margin-bottom: 0px;
	width: 100%;
	border-radius: 0px;
	transition: all 0.2s;
	height: 100px;
}


.navbar-nav{
	float: right;
	 margin-top:20PX;
}

nav.navbar.fixed-to-top{
	top: 0px;
}

.navbar-default{
	border: none;
	border-bottom: none;
	opacity: 1;
	display:block;
	z-index: 9999;
	margin: 0;float: right;min-height: inherit;font-size: 16px;
	 background-color: #002657 !important;
}

.navbar-default .navbar-nav>li>a {
	color: #FCCC00;
	text-transform: uppercase;
}

.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus{
	color: #fff;
	cursor: pointer;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
	outline: 0;
	 border-bottom:2px solid #c61626;
}


.navbar-default .navbar-nav>li>a p {
    font-family: arial;
    margin: 5px 0px 0px 0px;
    padding: 0px;
    font-size: 8px !important;
    color: #8b8b8b;
}


/* brand / logo */
.navbar-default .navbar-brand{
	color: #fff;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 2em;
}

.navbar-brand img
{
     width:200px;
    }










 .wbg>li>a {
	color: #fff;
	text-transform: uppercase;
}

.wbg>li>a:hover, wbg>li>a:focus{
	color: #ff0000;
	cursor: pointer;

	
}


.navbar-defaultw .navbar-navw>li>a p {
    font-family: arial;
    margin: 5px 0px 0px 0px;
    padding: 0px;
    font-size: 8px !important;
    color: #fff;
}


/* ================================
Home sections
================================= */

.home-section {
	width: 100%;
	padding: 80px 0px 80px 0px;
}

/* --- heading --- */
.section-heading {
	margin-bottom: 50px;
}

.section-heading h2 {
	font-size: 38px;
	text-transform: uppercase;
}

.section-heading .heading-line {
	margin:0 auto;
	display: block;
	height: 1px;
	width: 80px;
	background: #333;
	margin-top: 10px;
	margin-bottom: 20px;
}


/* --- section bg var --- */

.bg-white {
	background: #fff;
}
.bg-hong {
	background: #F2685A;
}

.bg-qing {
	background: #45C1A4;
}
.bg-gray {
	background: #f8f8f8;
}

.bg-dark {
	background: #575757;
}


/* --- section content general color --- */

.color-light h1,.color-light h2,.color-light h3,.color-light h4,.color-light h5,.color-light h6 {
	color: #fff;
}


.color-light p {
	color: #eee;
}


/* ==========================
Parallax
============================= */

#parallax1{
	background-image: url(../images/1.jpg);
}
#parallax2{
	background-image: url(../images/2.jpg);
}


/* ================================
Intro
================================= */

#intro {
	position: relative;
	margin: 0 auto;
	width: 100%;
	overflow-x: hidden;
	height:100vh;
	z-index:2;
	background-size:cover;
    top: 0px;
    left: 0px;
}

.intro-text {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
	z-index:999;
}

.intro-text h1 {
	color:#fff;
	text-align:center;
	font-weight: 700;
	font-size: 40px;
	line-height:1.1em;
	padding-top:30px;
	text-transform: uppercase;

}

.line-spacer {
	width: 20%;
	margin:0 auto;
	margin-top: 20px;
	margin-bottom: 25px;
	border-bottom:1px solid #fff;
}

.intro-text p span {
	color:#fff;
	font-size: 24px;
	text-align:center;
	font-weight: 300;
}

/* ================================
About
================================= */

#about .about-img {
  height: 350px;
  overflow: hidden;
}

#about .about-img img {
  margin-left: -15px;
  max-width: 100%;
}

@media (max-width: 768px) {
  #about .about-img {
    height: auto;
  }
  #about .about-img img {
    margin-left: 0;
    padding-bottom: 30px;
  }
}

#about .content h2 {
  color: #333;
  font-weight: 300;
  font-size: 24px;
  text-align: left;
}

#about .content h3 {
  color: #777;
  font-weight: 300;
  font-size: 18px;
  line-height: 26px;
  font-style: italic;
  text-align: left;
}

#about .content p {
  line-height: 26px;
  text-align: left;
}

#about .content p:last-child {
  margin-bottom: 0;
}

/* ================================
Team
================================= */
.box-team img {
	margin-bottom: 30px;
}



/* ================================
Services
================================= */
.service.carousel h4,.service.carousel p {
	text-align: left;
}


.service .carousel-control{
	background: none;
}

.service .screenshot{
	overflow: hidden;
	overflow: hidden;
	margin-right: auto;
	margin-left: auto;
}

.service .screenshot img{
	margin-right: auto;
	margin-left: auto;
	padding-left: 4px;
	width: 400px;
}

.service .carousel-indicators {
	position: relative;
	bottom: 0;
	left: 0;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding: 5px;
	padding-bottom: 8px;
	width: 100%;
	background: #ffffff;
}

.service .carousel-indicators .active {
	width: 45px;
	height: 5px;
	border: none;
	border-radius: 0px;
}

.service .carousel-indicators li {
	display: inline-block;
	margin: 1px;
	width: 45px;
	height: 5px;
	border: none;
	border-radius: 0px;
	background: #eeeeee;
	text-indent: -999px;
	cursor: pointer;
}


/* ================================
Works
================================= */
.og-grid {
	list-style: none;
	padding: 20px 0;
	margin: 0 auto;
	text-align: center;
	width: 100%;
}

.og-grid li {
	display: inline-block;
	margin: 10px 5px 0 5px;
	vertical-align: top;
	height: 250px;
}

.og-grid li > a,
.og-grid li > a img {
	border: none;
	outline: none;
	display: block;
	position: relative;
}

.og-grid li.og-expanded > a::after {
	top: auto;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-bottom-color: none;
	border-width: 15px;
	left: 50%;
	margin: -20px 0 0 -15px;
}

.og-expander {
	position: absolute;
	background: #FFF;
	top: auto;
	left: 0;
	width: 100%;
	margin-top: 10px;
	text-align: left;
	height: 0;
	overflow: hidden;
}

.og-expander-inner {
	padding: 50px 0;
	height: 100%;
}

.og-close {
	position: absolute;
	width: 40px;
	height: 40px;
	top: 20px;
	right: 20px;
	cursor: pointer;
}

.og-close::before,
.og-close::after {
	content: '';
	position: absolute;
	width: 100%;
	top: 50%;
	height: 1px;
	background: #888;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
}

.og-close::after {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.og-close:hover::before,
.og-close:hover::after {
	background: #333;
}

.og-fullimg,
.og-details {
	width: 50%;
	float: left;
	height: 100%;
	overflow: hidden;
	position: relative;
}

.og-details {
	padding: 0 40px 0 0;
}

.og-fullimg {
	text-align: center;
}

.og-fullimg img {
	display: inline-block;
	max-height: 100%;
	max-width: 100%;
}

.og-details h4 {
	font-weight: 300;
	margin-bottom: 10px;
}

.og-details p {
	font-weight: 300;
	font-size: 16px;
	line-height: 1.6em;
	color: #555;
}

.og-details a {
	font-weight: 700;
	display: inline-block;
	margin: 30px 0 0;
	outline: none;
}


.og-details a:hover {
	border-color: #999;
	color: #999;
}

.og-loading {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #ddd;
	box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ccc;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -25px 0 0 -25px;
	-webkit-animation: loader 0.5s infinite ease-in-out both;
	-moz-animation: loader 0.5s infinite ease-in-out both;
	animation: loader 0.5s infinite ease-in-out both;
}

@-webkit-keyframes loader {
	0% { background: #ddd; }
	33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
	66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

@-moz-keyframes loader {
	0% { background: #ddd; }
	33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
	66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

@keyframes loader {
	0% { background: #ddd; }
	33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
	66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

@media screen and (max-width: 830px) {

	.og-expander h3 { font-size: 32px; }
	.og-expander p { font-size: 13px; }
	.og-expander a { font-size: 12px; }

}

@media screen and (max-width: 650px) {

	.og-fullimg { display: none; }
	.og-details { float: none; width: 100%; }

}

/* ================================
Contact
================================= */

.validation {
  color: red;
  display:none;
  margin: 0;
  font-weight:400;
  font-size:13px;
}

#sendmessage {
  color: green;
  border:1px solid green;
  display:none;
  text-align:center;
  padding:15px;
  font-weight:600;
  margin-bottom:15px;
}

#errormessage {
  color: red;
  display:none;
  border:1px solid red;
  text-align:center;
  padding:15px;
  font-weight:600;
  margin-bottom:15px;
}

#sendmessage.show, #errormessage.show, .show {
	display:block;
}

/* ================================
Clients
================================= */
ul.clients {
	list-style: none;
}
ul.clients li {
	display: inline;
}


/* ================================
Bottom widget
================================= */
#bottom-widget {
  overflow: hidden;
}
ul.social-network {
	margin: 0;
	margin-left:0;
	padding-left: 0;
	list-style: none;
}
ul.social-network li {
	display: inline;
	margin: 5px 5px;
}


ul.social-network li a:hover span .fa-circle {
	color: #2b2b2b;
}

ul.social-network li a i{
  transition: 0.3s
}
/* ================================
Footer
================================= */
footer {
	background: #002657;
	color: #FCCC00;
	padding: 50px 0 30px;
}

footer a {
	color: #FCCC00;
}

footer a:hover {
	color: #fff;
	text-decoration: underline;
}

/* ================================
more media queries
================================= */

@media (max-width:768px) {

	

	.navbar-nav {
		float:right;
		text-align: left;
	}

	.box-team, .box-team img {
		text-align: center;
	}
	.box-team img {
		float: none;
		margin:0 auto;
	}
	.box-team {
		margin-bottom: 30px;
	}

	.og-fullimg { display: none; }
	.og-details { float: none; width: 100%; padding: 0 40px; }
	.navbar-collapse.collapse{max-height: none;overflow: hidden;}

}



@media (max-width:992px) {

	.service.carousel .item h4, .service.carousel .item p{
		text-align: center;
	}

	.service p{
			margin-bottom: 60px;
	}
	.og-expander {
		background: transparent;

	}
	.og-details {
		padding: 0 20px;
	}
	 #youkuplayer{ width:100%; height:450px;}
}

@media (max-width:480px){

	header .carousel-iphone, .detail .screenshot{
		width: 280px;
	}

	header .carousel, .detail .screenshot img{
		padding-top: 85px;
		width: 245px;
	}

	.service .screenshot img{
		margin-top: -12px;
		padding-top: 0px;
	}

	header{
		padding-top: 30px;
		padding-bottom: 0px;
	}

	header h1{
		font-size: 70px;
	}
		 #youkuplayer{ width:100%; height:200px;}

}


.index_sec{ padding: 100px 0; background-color: #fff; overflow: hidden; background-repeat: no-repeat; background-position: center top; background-size: cover; background-attachment: fixed;}

.works{ padding-bottom: 0;}
.sec_overview{ font-size: 14px; padding:10px 15px 0; font-style: italic;}
.works_tab{ text-align: center; margin-bottom: 30px;}
.works_tab a{ display: inline-block; vertical-align: bottom; cursor: pointer; font-size: 12px; border: 1px solid #a1a0a0; padding: 3px 20px; margin: 4px;}
.works_tab a:hover,.works_tab a.works_cur{ background-color: #df0010; border-color: #df0010; color: #fff;}
.works_tab a.tab_style1{ font-size: 18px;}
.works_tab a.tab_style2{ font-size: 20px;}
.works_tab a.tab_style3{ font-size: 22px;}
.works_tab a.tab_style4{ font-size: 24px;}
.works_tab a.tab_style5{ font-size: 14px;}
.works_rec{ padding: 0 12px;}
.works_area{ height: auto; padding: 12px; filter: Alpha(Opacity=100); opacity: 1; }
.works_area a{ display:block; overflow: hidden; max-width: 452px; margin: 0 auto;}
.works_img{ overflow: hidden; position: relative;}
.works_info{ position: absolute; top:0; left:0; z-index: 10; width: 100%; height: 100%; padding: 15px; background: rgba(0,0,0,.50); color: #fff; font-size: 14px; text-align: center; opacity: 0;}
.info_box{  width: 100%; height: 100%; display: table; vertical-align: middle;}
.info_des{ display: table-cell; vertical-align: middle;}
.works_caption{ background: #efeff1; padding: 10px 20px;text-align: center;}
.works_caption em{ display: block; text-transform: uppercase; font-size: 12px; color: #666;}
.works_tit{ font-size: 16px; line-height: 24px; height: 48px; overflow: hidden;}
.works_dis{ height: 0; overflow: hidden; filter: Alpha(Opacity=0); opacity: 0;}


.works img {
    display: block;
	border:none;
	max-width: 100%;
	width: auto\9;
	height: auto;
	-ms-interpolation-mode: bicubic;
	_width:auto;
}


.focus_bot{ position:absolute; left:0;  margin:aotu; margin-top:460px; width:100%;margin-left:42%; color: #007bff; z-index:100 }

.focus_des{ position:absolute; width:120px; height:115px;   background-color:#002657 ; display:none; z-index:101 }
.focus_des a{  width:120px; display:block; height:80px; margin-top:20px; }

.focus_des1{ position:absolute; width:120px; height:115px;   background-color:#002657 ;  }
.focus_des1 a{  width:120px; display:block; height:80px; margin-top:20px;  border-right: 1px #646b9e solid !important;   }

.focus_des2{ position:absolute; width:120px; height:115px;   margin-left:120px;  background-color:#002657 ;   }

.focus_des2 a{  width:120px; display:block; height:80px; margin-top:20px;  border-right: 1px #646b9e solid !important;   }
.focus_des3 a{  width:120px; display:block; height:80px; margin-top:20px;   }
.focus_des3{ position:absolute; width:120px; height:115px;  margin-left:240px;  background-color:#002657 ;   }
.do_tit{ text-align: center; font-size: 28px; padding-bottom: 30px; border-bottom: 1px solid #858585; margin-bottom: 40px;}
.do_tit img{width: 266px;margin: 0 auto 10px;}
.do_tit em{ display: block;}
.do_box{ margin: 0 -30px;}
#do_scr{ /*width:80%; max-width: 1600px;*/ margin: 0 auto;}
#do_scr .item{ padding: 0 30px;}
#do_scr .item a{ display: block; text-align: center;}
.do_ico{ width: 200px; height: 200px; overflow: hidden; border: 1px solid #c8c8c8; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; margin: 0 auto;}
.do_ico span{ display: block; font-size: 0; width: 100px; height: 100px; overflow: hidden; margin:50px; background-position: right center; background-repeat: no-repeat; background-size: cover;}
#do_scr .item a:hover .do_ico{ background-color: #002657; border-color: #002657;}
#do_scr .item a:hover .do_ico span{ background-position: left center;}

#do_scr .item a h4{ font-size: 18px; margin: 20px 0;}
.do_des{ color: #9fa0a0;}


.customers{ }
.customers_list{ /*width:80%; max-width: 1600px;*/ margin: 0 auto; margin-top: -30px;}
.customers_list li{ width: 25%; padding: 0 3px; font-size: 14px; text-align: center; float: left; margin-top: 30px; position: relative;}
.customers_list li:before{ content: ""; position: absolute; top:0; left:0; height: 100%; width: 3px; background: url("../images/customers_ico1.jpg") left center no-repeat; background-size: 90%;}
.customers_list li img{ margin: 0 auto; max-width: 50%;}
.customers_list li:nth-of-type(1):before,.customers_list li:nth-of-type(8):before,.customers_list li:nth-of-type(15):before{ display: none;}
.customers_list li:hover{ color: #df0010;}
/*.customers_list li:hover img{
    -webkit-filter:grayscale(100%);
    -o-filter:grayscale(100%);
    -moz-filter:grayscale(100%);
    -ms-filter:grayscale(100%);
    filter:grayscale(100%);
    filter:gray;
}*/
.customers_name{ padding: 0 15px; height: 25px; overflow: hidden;}



#index_focus{ position: relative; width: 100%; height:575PX; overflow: hidden; z-index: 1;background: url(../images/bx_loader.gif) center center no-repeat }
.focus_phone{ display: none;}
/*focus_scr*/
.focus_scr{ position: absolute; top:0; left:0; width: 100%; height:100%; overflow: hidden; z-index: 0;}
.focus_scr .owl-wrapper-outer{ width:100%; height:100%;}
.focus_scr .owl-wrapper,.focus_scr .owl-item,.focus_scr .item{ width:100%; height:100%; /*display:table; vertical-align:middle;*/}
.focus_scr .owl-item{ }
.focus_scr .item{/* background-size: cover; background-position: center center; background-repeat: no-repeat;*/}
.focus_scr .item a{ display: block;
    width: 100%;
    height: 100%;
    z-index: 10;
    background-color: #000;
    background-repeat: no-repeat;
    background-position: center center; background-size: cover;}
.focus_txt{ max-height: 50%; max-width: 40%; position: absolute; top:50%; left:11%; margin-top: -16%; display: none;}
.focus_scr .owl-controls { margin: 0;}
.focus_scr .owl-controls .owl-pagination{ position: absolute; top:50%; left:50px; z-index:100;}
.focus_scr .owl-controls .owl-page{ display: block; width: 25px; margin: 10px 0;}
.focus_scr .owl-controls .owl-page span{ border-radius: 0; filter: Alpha(Opacity=100); opacity: 1; margin:0; background: none; width: 100%; height: 25px; position: relative;}
.focus_scr .owl-controls .owl-page span:before{ content: ""; position: absolute; top:50%; margin-top: -1px; left:0; width: 100%; height: 2px; background: #696869;}
.focus_scr .owl-controls .active span:before{ height: 5px; margin-top: -3px; margin-left: -45px; background-color: #2ebaee;}
.focus_scr .owl-controls .owl-buttons{ }
.focus_scr .owl-controls .owl-buttons div{ margin: 0; padding: 0; border-radius:0; filter: Alpha(Opacity=100); opacity: 1; width: 47px; height: 94px; font-size: 0; position: absolute; top:50%; margin-top: -47px;}
.focus_scr .owl-controls .owl-buttons div.owl-prev{ left:20px; background: url(../images/zuoa_07.png) repeat-x; background-size: cover; }
.focus_scr .owl-controls .owl-buttons div.owl-prev:hover{ background-position: -48px center;}
.focus_scr .owl-controls .owl-buttons div.owl-next{ right:20px; background: url(../images/youa_10.png) repeat-x; background-size: cover;}
.focus_scr .owl-controls .owl-buttons div.owl-next:hover{ background-position: 48px center;}
.focus_scr .owl-controls .owl-controls .owl-page span{ background:#fff;}
/*=====focus_top=====*/
.focus_top{ position: fixed; color: #fff; width: 100%; padding: 30px 50px;}




.trends{ background: #f3f3f3;}
.trends_dec,.trends_rec{ width: 90%; max-width: 1000px; margin: 0 auto; position: relative;}
.trends_dec:before{ content: ""; position: absolute; top:50%; left:0; width: 100%; height: 2px; background: #666;}
.trends_dec span{ display: block; width: 84px; background: #f3f3f3; margin: 0 auto; position: relative;}
.trends_dec span img{ margin: 0 auto;}
.trends_rec li{}
.trends_rec li a{ display: block; overflow: hidden; padding: 30px 0;}
.trends_date{ display: block; float: left; padding-right: 20px; margin-right: 20px; font-size: 90px; max-height: 110px; color: #666; font-family: Myriad Pro; line-height: normal; position: relative;}
.trends_date:before{ content: ""; position: absolute; top:0; right:0; width: 1px; height: 100%; background: #666;}
.trends_date b{ display: inline-block; vertical-align: top; font-weight: normal; line-height: 110px; margin-right: 10px;}
.trends_date em{ display: inline-block; vertical-align: top; font-size: 18px;}
.trends_date em i{ display: block; width: 60px; height: 60px; line-height: 60px; margin: 0 auto; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background: #df0010; color: #fff; font-size: 30px;}
.trends_info{ padding-right: 20px; overflow: hidden;}
.trends_tit{ font-size: 16px;}
.trends_des{ line-height: 24px; max-height: 96px; overflow: hidden; color: #666; margin: 5px 0 10px;}
.trends_from{ color: #666; font-size: 12px;}
.trends_from span{ font-size: 14px; color: #df0010; margin-right: 10px;}
.trends_rec li.trends_dif{ padding-left: 10%; width: 110%;}



.floatrightdiv .linkbox .imgtb {
	background-image: url(../images/ico.png);
	background-repeat: no-repeat;
}

/*�ұ߸���*/
.floatrightdiv {
	width: 76px;
	height: auto;
	z-index: 9999;
	float: right;
	display: block;
	position: fixed;
	top:200px;
	right:10px;
}
.floatrightdiv .lrbox{
	padding:5px 0;
	position:relative;
	}
.floatrightdiv .linkbox{
	width: 76px;
	height:76px;
	text-align:center;
	color:#FFF;
	line-height:21px;
	font-size:12px;
	background-color: rgba(0,0,0,.5) !important;
/*	background-color:#363636;
*/	
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f363636,endColorstr=#7f363636);

	
	
	text-shadow: 0 1px 1px #000000;
	border-radius:5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	box-shadow: 5px;
	display: block;
	}
.floatrightdiv .linkbox:hover{
	background-color: rgba(0,0,0,1) !important;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f000000,endColorstr=#7f000000);
	}
.floatrightdiv .linkbox .imgtb{
	width: 76px;
	height:45px;
	display:block;
	}
.floatrightdiv .linkbox .sy{
	background-position:22px -915px;
}
.floatrightdiv .linkbox .kf{
	background-position:22px -1015px;
}
.floatrightdiv .linkbox .lx{
	background-position:22px -1115px;
}
.floatrightdiv .linkbox .erwm{
	background-position:22px -1215px;
}

.floatrightdiv .lrbox .floatlrdiv{
	position:absolute;
	right:80px;
	margin-top:-76px;
	padding:15px;
	min-height:46px;
	_height:46px;
	color:#FFF;
	background-color: rgba(0,0,0,.5) !important;	
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f000000,endColorstr=#7f000000);
	border-radius:5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	box-shadow: 5px;
	display: none;
	}

.floatrightdiv .lrbox:hover .floatlrdiv,.floatrightdiv a.lrbox:hover .floatlrdiv {
	display: block;
}
.floatrightdiv .lrbox .floatlrdiv .lxfs{
	width:300px;
	line-height:25px;
	font-size:14px;
	
	}
.floatrightdiv .lrbox .floatlrdiv .erwm{
	width:200px;
	height:auto;	
	}
.floatrightdiv .lrbox .floatlrdiv .erwm .one{
	width:150px;
	display:block;
	line-height:30px;
	text-align:center;
	margin-left:auto;
	margin-right:auto;
	}
	
.floatrightdiv .lrbox .floatlrdiv .erwm li{
	width:200px;
	height:180px;
	float:left;
	}
.floatrightdiv .lrbox .floatlrdiv .erwm li img{
	width:150px;
	height:150px;
	display:block;
	margin-left:auto;
	margin-right:auto;
	}
.floatrightdiv .lrbox .floatlrdiv .erwm li p{
	font-size:14px;
	line-height:30px;
	text-align:center;	
	}

@media (max-width: 767px) {
#New ,.floatrightdiv
{
   display:none
    }
    
        #youkuplayer{ width:100%; height:350px;}
}

.contact:before{ content: ""; position: absolute; top:0; left:0; z-index: 0; width: 100%; height: 100%; background: rgba(0,0,0,.40);}
.contact_box{ /*width: 80%; max-width: 1230px;*/ margin: 0 auto; position: relative;}
.contact_l{ float: left;}
.contact_tit{ font-size: 36px; color: #000; line-height: normal;}
.contact_tit a{ color: #000;}
.lines{ padding: 50px 0;   }
.lines li{  text-align:left; padding-top:20px; ; font-size: 18px; color: #000;}
.lines li em{ color: #df0010;}
.contact_links{ }
.contact_links a{ display: block; float: left; margin-right: 5%;}
.contact_links a:hover img{ filter: Alpha(Opacity=80); opacity: 0.80;}
.contact_form{ overflow: hidden;}
.contact_line{ margin-bottom: 20px;}
.input_box{ width: 50%; float: left; padding: 0 4px;}
.contact_txt,.contact_yu,.h_sel{ width: 100%; height: 44px; padding: 10px 0 10px 14px; border: 1px solid #4b4b4a; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; font-size: 14px; color: #fff;}
.contact_txt::-webkit-input-placeholder,.contact_yu::-webkit-input-placeholder { color:#fff; }


.contact_txt:hover,.contact_txt:focus,.contact_yu:hover,.contact_yu:focus,.h_sel:hover{ border-color: #9b9b9b;}
.input_dif{ width: 100%;}
.contact_yu{ height:140px; resize: none; }
.contact_submit{ display: block; margin: 0 auto; cursor: pointer; font-size: 14px; color: #fff; background: #df0010; width: 146px; height: 42px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;}
.contact_submit:hover{ background: #a5000d;}


.daohang  .item
{
    
    position: absolute;
    left: 50%;
    margin-left: -67px;
    z-index: 11;
    width: 133px;
    top: 78px;
    background-color: #002657 ;
    }
.daohang  .item i { width:12px; height:7px; position:absolute; left:50%; margin-left:-6px; top:-10px; z-index:9999;  background:url(../images/sjx.png) no-repeat;}
.daohang  .item dd { float: left; width: 133px; overflow: hidden; color:#fff; text-align:center; border-bottom:1px solid rgba(255,255,255,.6)}
.daohang  .item dd a {    display: inline-block;
    padding: 0 ;

    height: 39px;
	line-height:39px;
    font-size: 12px;
    overflow: hidden;
	background:none;
	color:#fff;
}
#daohang .item dd a:hover {background:none; color:#ff0000; text-decoration:none;}
@media (min-width: 1440px){
    .container { width: 1360px; }
    #youkuplayer{ width:100%; height:600px;}
  
    
}  


@media (min-width: 1200px){
  
    #youkuplayer{ width:100%; height:600px;}
    
}

@media (min-width: 1600px){
    .container { width: 1470px; }
     #youkuplayer{ width:100%; height:600px;}
  
}
@media (min-width: 1680px){
    .sub_works .container { width: 1560px; }
     #youkuplayer{ width:100%; height:600px;}
}

.works_top{ margin-bottom: 20px;}
.works_item{ float:left;     margin-right: 30px; text-transform: uppercase; color: #000; font-size: 18px;}
.works_item em{    position: relative; display: inline-block; font-family: arial; font-weight: bold; color: #333; font-size: 48px; line-height:normal; padding:0 20px 10px 0;}
.works_item em:before{ content: ""; position: absolute; bottom: 0; left:0; width: 100%; height: 10px; background: #333;}
.works_item span{ display: block; margin-top: 5px;}


.neirong_item{      text-transform: uppercase; color: #000; font-size: 18px;}
.neirong_item em{  display: inline-block; font-family: arial; font-weight: bold; color: #333; font-size: 48px; line-height:normal; padding:0 20px 10px 0;}
.neirong_item em:before{ content: ""; position: absolute; bottom: 0; left:0; width: 100%; height: 10px; background: #333;}
.neirong_item span{ display: block; margin-top: 5px;}

.hotline2{ display: inline-block; color: #df0010;}
.hotline2 b{ font-weight: normal; font-family: Impact;}
.works_des{ overflow: hidden; text-align: center; background:#df0010; font-size: 20px; line-height: 32px; /*font-weight: bold;*/ color: #fff; padding: 26px 0;}
.works_sort{}
.works_sort dl{ margin: 0 -5px; overflow: hidden;}
.works_sort dl dt{ float: left;}
.works_sort dl dd{ overflow: hidden;}
.works_sort dl a{ display: block; float: left; width:80px; padding: 0 5px; height: 40px; line-height: 40px; text-align: center; margin: 5px 4px; font-weight: normal; color: #000; border: 1px solid #c0bfbf;}
.works_sort dl a:hover,.works_sort dl a.sort_cur{ border-color: #df0010; background: #df0010; color: #fff;}
.works_list{margin: 0 -12px;}
img.works_ico{ margin: 0 auto;}


.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #df0010;
    border-color: #ff0000;
}
.banner {
 
position: relative;
}



.mt30
{
   margin-top:30px;
    }
    
    .sub {
 
    overflow: hidden;
     width:100%;
    
}

.wztou_2a{font-size:14px;float:right;color:#df0010;}
.wztou_2a:hover{text-decoration:underline;}

.jdalM1{border-bottom:1px #ddd solid;padding-bottom:10px;}
.jdalM2{border-bottom: 1px #ddd solid;}
.jdalM2_1p1{font-size:18px;color:#000;font-weight:bold;}
.jdalM2_1{padding-bottom:15px;}
.jdalM3h2{font-size:24px; line-height: normal; color:#fff;background-color:#df0011; padding:10px 20px; margin-bottom: 30px;}
.back_list{ float: right; }
.jdalM3_1{background-color:#dfdede;margin-bottom:20px; position: relative; }
.jdalM3_1img{float:left;width:70%;}
.jdalM3_1img img{min-width:100%;}
.jdalM3_1imgp1{ overflow:hidden; font-size:24px;color:#000; position: absolute; bottom: 0; right: 0; width: 30%; padding: 30px; }
.jdalM1 .wztou_2a{ margin-top: 114px;}
/*jdalM3_2BOX*/
.jdalM3_2BOX{ clear: both; margin: 15px -15px;}
.jdalM3_2{float:left;width:33.33%; padding:15px; overflow:hidden;}
.jdalM3_2 img{max-width:100%;}
.jdalM3{padding-top:30px;}


.jdalM4nr_1{margin-bottom:20px;}
.jdalM4nr_1 a,.jdalM3_2 a{ display: block; overflow: hidden; position: relative;}
.jdalM4h2{ border:1px #6f6f6f solid; font-size:18px; padding: 10px 15px; margin-bottom: 20px;}
.jdalM4nr_1 a img{ margin-bottom: 10px;}
.jdalM4nr_1 .img_caption,.jdalM3_2 .img_caption{/* position: absolute; bottom: 0; left:0; color: #fff; background: rgba(0,0,0,.40);*/ width: 100%; text-align: center; overflow: hidden; font-size: 14px; line-height: 22px; height: 44px; overflow: hidden;}

.column_top{ margin-bottom:40px;}
.column_tit{ text-align: center; font-size: 16px; color: #000; padding-bottom: 20px; background: url("../images/ico_01.png") center bottom no-repeat;}
.column_tit em{ display: block; font-size: 28px; font-family: Impact; text-transform: uppercase; color: #df0010;}
.column_des{ font-style: italic; font-size: 14px; text-align: center; width: 100%; padding:20px 15px; max-width: 860px; margin: 0 auto;}
.column_tab{}
.column_tab a{ color: #707070; padding: 0 8px; cursor: pointer;}
.column_tab a.column_cur{ color: #000;}

.news_area{ }
.news_list{ }
.news_list li{ padding: 30px 0; border-bottom: 1px dashed #bcbcbc; position: relative;}
.news_list li:before{ content: ""; position: absolute; top:0; left:-50%; width:200%; height: 100%; background: #f5f5f5; filter: Alpha(Opacity=0); opacity: 0; }
.shared{ position: absolute; top:50%; left:0; margin-top: -15px;}
.news_list li em{position: relative;z-index: 1;color:#555;}
.news_list li a{ display: block; overflow: hidden; position:relative;}
.news_img{ width:250px; height:aotu; margin-right:30px; display: block; float: left;}
.news_info{ overflow: hidden;}
.news_tit{ display: inline-block; font-size: 16px; height: 26px; line-height: 26px; overflow: hidden; font-weight: bold; position: relative;}
.news_tit:before{ content: ""; position: absolute; bottom: 0; left:0; width: 0; height: 1px; background: #df0010;}
.news_date{ font-style: italic; line-height: normal; color: #666;}
.news_des{ color: #444; text-align: justify; max-height: 150px; overflow: hidden; margin: 15px 0;}
.news_more{ display: inline-block; color: #df0010; font-size: 16px; position: relative;}
.news_more:before{ content: ""; position: absolute; bottom: 0; left:50%; width: 0; height: 1px; background: #df0010;}
/*.news_more:hover:before{ left:0; width: 100%;}*/
.news_list li:hover a .news_tit{ color: #df0010;}
.news_list li:hover:before{ filter: Alpha(Opacity=100); opacity: 1; }
/*news_end*/
.end_l{ padding: 0 40px 0 0;}
.end_l img{ margin-bottom: 30px;}
.end_r{ padding: 0;}
.end_r img{ display: inline-block;}
.end_tit{ font-size: 18px; font-weight: bold; color: #000; margin-bottom: 40px;}
.end_date{ font-size: 14px; color: #999; font-style: italic; font-weight: normal; margin-top: 5px;}
.site_url{ color: #999; font-size: 16px; font-style: italic;}