﻿@charset "utf-8";
/* CSS Document */
html,body{
	height:100%;
}
body{
    font-size:12px;
	font-family:"微软雅黑",Arial;
	color:#555;
	background:url(../images/bg.png) center top no-repeat;
	background-size:cover;
}
*{
	margin:0px;
	border:0px;
	padding:0px;
	-webkit-appearance: none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent;
	outline:none;
}
ul{ 
   list-style:none;
}
ul li{ 
   list-style-type:none;
}
dl>div{
	clear:inherit!important;
}
div{
	word-break:break-all;
	word-wrap:break-word;
}
h1,h2,h3,h4,h5,h6{
    font-size: 14px;
    font-family:"微软雅黑";
    font-weight: 500;
}
img{
	max-width:100%;
}
.clear{
	clear:both;
	font-size:0px;
	visibility:hidden;
	width:0px;
	line-height:0px!important;height:0;
}	
a{
	color:#555;
	text-decoration:none;
}
a:hover{
	color:#555;
}
a,input,select{
	-webkit-appearance: none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent;
	outline:none;
	background:none;
	text-decoration: none;
}
.tip,.tip a,a.tip{
	color:#bbb;
}
.tipped{
	color:#bbb;
	font-family:Arial;
}
input::placeholder,textarea::placeholder{
	color:#bbb;
}
input:focus::placeholder,textarea:focus::placeholder{
	color: transparent;
}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button{
	opacity:1;
	height:25px;
}
input:-webkit-autofill{
	-webkit-box-shadow:0 0 0px  1000px white inset;
}
.warning,.warning a,a.warning{
	color:#ff4b8c;
}
.highlight,.highlight a,a.highlight{
	color:#2b98b9;
}
.secondary,.secondary a,a.secondary{
	color:#999;
}
input,select{
	vertical-align:middle;
    outline:none;
    color:#555;
    font-size:12px;
    font-family:Arial;
}
textarea{
    outline:none;
    color:#555;
}
input[type="checkbox"]{
    height:13px;
    width:13px;
    -webkit-appearance: none;
    background: none;
    border: 1px solid #ccc;
    cursor:pointer;
}
input[type="checkbox"]:checked{
	background:#0f8fcc url(../images/checked.png) center center no-repeat;
    border: 1px solid #0f8fcc;
}
input[type="radio"] {
    width:14px;
    height:14px;
    outline:none;
    -webkit-appearance: none;
    border:1px solid #999;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
    border-radius:7px;
    vertical-align:middle;
    cursor:pointer;
}
input[type="radio"]:checked {
    background:url(../images/radio.png) center center no-repeat;
    border:1px solid #999;
}
.en{
    font-family:Arial;
}
.h10{
	height:10px;
	clear:both;
}
.h50{
	height:50px;
}
.wrapper{
	width:500px;
	height:750px;
	margin:auto;
	background:#fff;
	box-shadow:0 0 4px rgba(9, 2, 4, 0.2);
}
.wrapper .slide{
	height:100%;
}
.wrapper .main_image{ 
	height:100%;
}
.wrapper .main_image li{
	width:100%;
	height:100%;
	background-size:cover!important;
}
.wrapper .main_image li a{
	display:block;
	height:100%;
}
.wrapper #btn_prev,.wrapper #btn_next{
	visibility:visible;
	width:50px;
	height:50px;
	border-radius:50%;
}

.main_image li:nth-child(1){
	background:#0188cc url(../images/bg01.jpg) no-repeat center center;
}
.main_image li:nth-child(2){
	background:#0188cc url(../images/bg02.jpg) no-repeat center center;
}
.main_image li:nth-child(3){
	background:#0188cc url(../images/bg03.jpg) no-repeat center center;
}
.main_image li:nth-child(4){
	background:#0188cc url(../images/bg04.jpg) no-repeat center center;
}
.main_image li:nth-child(5){
	background:#0188cc url(../images/bg05.jpg) no-repeat center center;
}
.main_image li:nth-child(6){
	background:#0188cc url(../images/bg06.jpg) no-repeat center center;
}
.slide{
	width:auto;
	position:relative;
	margin:0 auto;
}
.main_image {
	margin:0px auto;
	width:100%; 
	height:450px;
	overflow:hidden; 
	position:relative;
}
.main_image a{
	height:450px;
	display:block;
}
.flicking_con{
	position:absolute;
	height:22px;
    bottom:0px;
    text-align:center;
    color:#fff;
    font-size: 14px;
    width: auto;
    left: 0;
    right: 0;
}
.flicking_con .flicking_inner {
	display: block;
    width: 100%;
    text-align: center;
	line-height:15px;
	height:15px;
}
.flicking_con li{
	background: url("../images/pagericon.png") no-repeat 0px 0px; 
	display: inline-block;
    height: 15px;
    width: 20px;
    background-repeat:no-repeat;
    background-position: 0 -16px;
    cursor:pointer;
}
.flicking_con li.on {
	background-position: 0px 0px;
}
#btn_prev {
	top:50%;
	width:73px; 
	height:73px;
	margin-top:-37px;
	display:none;
	position:absolute;
	z-index:11111;
	cursor:pointer;
	background: url("../images/prev.png") no-repeat center center;
	left: 10px;
	visibility:hidden;
}
#btn_next {
	top:50%;
	width:73px;
	height:73px;
	margin-top:-37px;
	display:none; 
	position:absolute; 
	z-index:11111;
	cursor:pointer;
	background: url("../images/next.png") no-repeat center center;
	right:10px;
	visibility:hidden;
}
.page01-01{
	margin:auto;
	display:block;
}
.page01-02{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
}
.page01-03{
	position:absolute;
	top:50%;
	left:calc(50% - 80px);
	transform:translate(-50%, -50%);
	font-size:16px;
	writing-mode: vertical-rl;
    writing-mode:tb-rl;
}
.page01-04{
	position:absolute;
	top:calc(50% - 60px);
	left:calc(50% + 80px);
	transform:translate(-50%, -50%);
	font-size:28px;
	writing-mode: vertical-rl;
    writing-mode:tb-rl;
}
.main{
	width:calc(100% - 20px);
	min-height:100px;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
}
.title{
	margin:10px auto 20px auto;
	text-align:center;
	
}
.title span{
	padding:0px 10px;
	height:40px;
	line-height:40px;
	font-size:18px;
	font-weight:500;
	font-family:"微软雅黑";
	border:2px solid #9ccecf;
	display:inline-block;
}
.content{
	line-height:25px;
}
.content p{ 
	text-indent:2em;
}
.content p:nth-child(1){ 
	text-indent:0em;
}
.content dl{
	font-size:14px;
	font-weight:500;
	font-family:"微软雅黑";
	padding:10px;
	clear:both;
	margin:auto;
	clear:both;
	line-height:20px;
}
.content dt{
	float:left;
	width:80px;
	text-align:center;
	width:80px;
	height:20px;
	padding:3px 0px;
}
.content dd{
	float:left;
	width:calc(100% - 80px);
	height:20px;
	padding:3px 0px;
}
.QRcode{
	width:150px;
	height:180px;
	margin:0 auto;
	position:fixed;
	text-align: center;
	top:80px;
	left:calc(50% + 270px);
	line-height:25px;
	font-size: 14px;
    font-family:"微软雅黑";
    font-weight: 500;
	color:#fff;
	overflow:hidden;
}
.QRcode img{
	max-width:100%;
}
.share{
	width:160px;
	height:30px;
	margin:0 auto;
	position:fixed;
	text-align: center;
	top:280px;
	left:calc(50% + 270px);
}
.share li{
	width:25%;
	float:left;
}
.share a,ul.bdshare-button-style1-32 a{
	width:30px;
	height:30px;
	display:block;
	border-radius:50%;
	margin:0 auto;
	float:none;
}
.share li>a:hover{
	opacity:1;
	filter:alpha(opacity=100)
}
.share a.bds_qzone{
	background:#fff url(../images/share01.png) center center no-repeat;
}
.share a.bds_wsqq{
	background:#fff url(../images/share02.png) center center no-repeat;
}
.share a.bds_tsina{
	background:#fff url(../images/share03.png) center center no-repeat;
}
.share a.bds_ibaidu{
	background:#fff url(../images/share04.png) center center no-repeat;
}
@media screen and (max-width: 750px){
	.wrapper{
		width:100%;
		height:100%;
		box-shadow:none;
	}
	.QRcode,.share,.h50{
		display:none;
	}
}
.audio{
	width:18px;
	height:18px;
	line-height:18px;
	text-align:center;
	color:#fff;
	font-size:16px;
	font-family:Arial;
	border:2px solid #fff;
	border-radius:50%;
	position:absolute;
    top:10px;
	right:10px;
	z-index:100000;
	cursor:pointer;
}

@keyframes rotation{
	from {-webkit-transform: rotate(0deg);}
	to {-webkit-transform: rotate(360deg);}
}
@-ms-keyframes rotation{
	0%{
    	transform: rotate(0);
    }
    50%{
    	transform:rotate(180deg);
    }
    100%{
         transform: rotate(360deg);
    }
}
@-webkit-keyframes rotation{
	from {-webkit-transform: rotate(0deg);}
	to {-webkit-transform: rotate(360deg);}
}
@-moz-keyframes rotation{
	from {-webkit-transform: rotate(0deg);}
	to {-webkit-transform: rotate(360deg);}
}
@-o-keyframes rotation{
	from {-webkit-transform: rotate(0deg);}
	to {-webkit-transform: rotate(360deg);}
}
.Rotation{
	-webkit-transform: rotate(360deg);
	animation: rotation 3s linear infinite;
	-ms-animation: rotation 3s linear infinite;
	-moz-animation: rotation 3s linear infinite;
	-webkit-animation: rotation 3s linear infinite;
	-o-animation: rotation 3s linear infinite;
}
.user{
	width:calc(100% - 8px);
	height:35px;
	line-height:35px;
	border:1px solid #eee;
	padding:0 3px;
	margin-bottom:10px;
	background:#fff;
}
.button{
	width:100%;
	height:40px;
	background:#00b7ee;
	cursor:pointer;
	color:#fff;
	text-align:center;
    -moz-border-radius:3px; 
    -webkit-border-radius:3px;
	border-radius:3px;
    font-size:14px;
    letter-spacing:5px;
	margin-top:5px;
}