.hero {
    width: 100%;
    height: 80%;
    min-height: 550px;
    position: relative;
}
.hero .container {
   position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    /* width: 70%; */
    /* height: 40%; */
    z-index: 9;
    
}
.hero .tagline {
    font-family: "微软雅黑" arial;
    float: left;
   /* width: 35%;*/
    background: rgba(0,0,0,.08);
    padding: 30px 50px;
    box-shadow: 0px 0px 1px 3px rgba(255,255,255,0.2);
    color: #fff;
}
.hero .tagline h1 {
    font-size: 34px;
    text-align: center;
    border-bottom: 2px #fff solid;
}
.hero .tagline p {
	font-weight: bold;
    font-size: 42px;
    color: #fff;
    padding-top: 15px;
    text-align: center;
}
.hero .tagline .EN{
    font-size: 14px;
    color: #fff;
    padding-top: 10px;
}
.skippr {
	width:100%;
	height:550px;
	position: relative;
	overflow:hidden;
}

.skippr > div {
	position: absolute;
	width:100%;
	height:100%;
	background-size: cover;
	background-position: 50% 62.5%;

}

.skippr > img {
	position: absolute;
	top:50%;
	left:50%;
	-webkit-transform:translate(-50%,-50%);
	-moz-transform:translate(-50%,-50%);
	-ms-transform:translate(-50%,-50%);
	transform:translate(-50%,-50%);
	width:100%;
	min-height: 100%;
}

.skippr-nav-container {
	position: absolute;
	left:50%;
	-webkit-transform:translate(-50%,0);
	transform:translate(-50%,0);
	-moz-transform:translate(-50%,0);
	-ms-transform:translate(-50%,0);

	bottom:25px;
	overflow: auto;
	z-index:999;

}

.skippr-nav-element {
	cursor:pointer;
	float:left;
	background-color: rgba(255,255,255,0.5);
	-webkit-transition: all .25s linear;
	transition: all .25s linear;
}

.skippr-nav-element-bubble {
	width:12px;
	height:12px;
	border-radius: 50%;
	margin:0 4px;
}

.skippr-nav-element-block {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    margin: 0px 5px;
}



.skippr-nav-element:hover, .skippr-nav-element-active {
	background-color:rgba(255,255,255,1);
}


.skippr-arrow {
	position: absolute;
	z-index:999;
	top:50%;
	-webkit-transform:translate(0%,-50%);
	-moz-transform:translate(0%,-50%);
	-ms-transform:translate(0%,-50%);
	transform:translate(0%,-50%);

	width:30px;
	height:30px;
	/*background-color: white;*/
	transform-origin:center center;
	-webkit-transform-origin:top left;
	cursor: pointer;
}

.skippr-previous {
	left:2.5%;
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg);
	border-top:2px solid white;
	border-left:2px solid white;
}

.skippr-next {
	right:3.5%;
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg);
	border-bottom:2px solid white;
	border-right:2px solid white;
}