@charset "utf-8";
/* reset */
html { height: 100%;}
body { min-height: 100% }
body { _height: 100% }
body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, iframe, pre, code, fieldset, legend, form, input, select, textarea, button, p, blockquote, th, td, figure { margin: 0; padding: 0 }
body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, iframe, pre, code, fieldset, legend, form, p, blockquote, figure, header, footer, nav, article, section, aside, address, figcaption { *zoom: 1 }
li { list-style-type: none }
iframe, frame, fieldset, img { border: 0 none }
/* img { vertical-align: top } */
input[type=button], input[type=submit], input[type=reset] { cursor: pointer }
button { cursor: pointer }
input, textarea, button { -webkit-border-radius: 0; -webkit-appearance: none }
input[type=radio] { -webkit-border-radius: 100%; -webkit-appearance: radio }
input[type=checkbox] { -webkit-appearance: checkbox }
input[type=search] { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; -ms-box-sizing: content-box; -o-box-sizing: content-box; box-sizing: content-box }
textarea { overflow: auto; resize: none }
blockquote, q { quotes: none }
blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none }
table { border-collapse: collapse; border-spacing: 0 }
caption, th { text-align: left }
th { font-weight: normal }
em, cite, address,i { font-style: normal }
sup { vertical-align: text-top }
sub { vertical-align: text-bottom  ; }
.fl {float: left;}
.fr {float: right;}
.fixed:before, .clearfix:before, .cf:before, body:before, .header:before, .main:before, .footer:before { content: ''; display: table }
.fixed:after, .clearfix:after, .cf:after, after, .header:after, .main:after, .footer:after { content: ''; display: table; clear: both }
.fixed, .clearfix, .cf, .header, .main, .footer { *zoom: 1 }
/*
@font-face {
	font-family: 'NotoSansHans';
	src: url('../font/NotoSansHans-DemiLight.eot'); 
	src: url('../font/NotoSansHans-DemiLight.eot?#iefix') format('embedded-opentype'), 
      url('../font/SourceHanSansK-Normal.woff') format('woff'),
      url('../font/SourceHanSansK-Normal.ttf')  format('truetype'), 
      url('../font/SourceHanSansK-Normal.svg#SourceHanSansK-Normal') format('svg'); 
   }
*/
body { color:#333;font-family:'Microsoft YaHei';  background:#fff }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight:normal; }
a:link,
a:visited,
a:active,
a { text-decoration: none; }

/* clear 页头，页脚，内容区都不用再加清除样式 */
.cf:before{ content: ''; display: table }
.cf:after{ content: ''; display: table; clear: both }
.cf { *zoom: 1 }
.clear, .cl { display: block!important; float: none!important; clear: both; width: auto!important; max-width: none!important; min-width: 0!important; max-height: none!important; min-height: 0!important; overflow: hidden; margin: 0!important; padding: 0!important; border: 0 none!important; font-size: 0!important; line-height: 0!important }

/*公用样式end*/
.auto-img { position: relative; overflow: hidden; display:block; }
.auto-img img { position: relative; }

.auto-bg { background-repeat:no-repeat; overflow:hidden; position:relative; background-position:center; background-size:cover; }

.ratio-img{ width:100%; height:auto; background:url(../images/error.png) center no-repeat #fff;}

a,
a:active,
a:focus,
input:focus,
a:hover,
a.music-toggle-btn:active,
a.music-toggle-btn:focus,
input:focus,
a.music-toggle-btn:hover,
img,
img:active,
img:focus,
li:active,
li:focus,
li:focus,
div,
div:active,
div:focus,
div:hover,
button,
button:active,
button:focus,
button:hover {-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-user-modify:read-write-plainteeet-only;outline:none;-webkit-tap-highlight-color: transparent;}

.header { position:relative; }
.header > a { position:absolute; display:block; width:148px; height:30px; bottom:34px; right:40%; }