@charset "utf-8";
/*Reset*/
*{border:0;margin:0;outline:0;padding:0;}
img{vertical-align:top; border:none; width:100%;}
ol, ul{list-style:none outside none;}
table{border-collapse:collapse;border-spacing:0;}
body{font:14px/1.2 'Microsoft Yahei', Arial, Helvetica, SimHei, san-serif;}
/*Reset end*/
.header{height:60px; width:100%; *width:1024px; margin:0 auto;}
.header h1.logo{width:81px; float:left; margin:15px 0 0 40px;}
.header .sub_logo{width:97px; float:right; margin:15px 40px 0 0;}

.contents{width:940px; margin:0 auto 40px;}
.contents .controls_bar, .share_info{margin:0 auto; display:table; *display:block; *width:397px; _width:407px;}
.contents .controls_bar a, .share_info a{width:88px; height:24px; display:inline-block; margin-left:10px; text-indent:-99999px; ; zoom:1; *display:block; float:left; cursor:pointer;}
.contents .controls_bar a:first-child{margin-left:0;}
.contents h2{margin:5px auto 20px; text-align:center; font-size:24px; }
.contents .play_box{max-width:600px; margin:0 auto;}
.custom_previous{background:url(../img/previous.png) no-repeat;}
.custom_play{background:url(../img/play.png) no-repeat;}
.custom_stop{background:url(../img/pause.png) no-repeat;}
.custom_next{background:url(../img/next.png) no-repeat;}
.share_info{margin-bottom:20px; *width:200px;}
.share_info a, .share_info span{_display:inline; zoom:1;}
.share_info a{margin-left:0;}
.p_info{background:url(../img/product.png) no-repeat;}
.p_share{background:url(../img/share.png) no-repeat;}
.footer{color:#666; font-size:12px; text-align:center; width:100%; *width:940px; margin:0 auto 10px;}
.footer .copylight a{text-decoration:none; color:#666;}

#share_button{position:relative; margin-left:10px; display:inline-block; float:left;}
#share_button a,.share_parent a{text-indent:0; width:auto; height:auto;}
#share_button img, .share_parent img{width:auto;}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
.contents{width:700px;}
}
@media only screen and (min-width: 600px) and (max-width: 767px) {
.contents{width:460px;}
}
@media only screen and (min-width: 412px) and (max-width: 599px) {
.contents{width:372px;}
.contents .controls_bar{width:196px;}
.contents .controls_bar a{margin:0px 5px 10px;}
.contents .controls_bar a:first-child{margin-left:5px;}
}
@media only screen and (min-width: 360px) and (max-width: 411px) {
.contents{width:320px;}
.contents .controls_bar{width:196px;}
.contents .controls_bar a{margin:0px 5px 10px;}
.contents .controls_bar a:first-child{margin-left:5px;}
}
@media only screen and (min-width: 320px) and (max-width: 359px) {
.contents{width:300px;}
.contents .controls_bar{width:196px;}
.contents .controls_bar a{margin:0px 5px 10px;}
.contents .controls_bar a:first-child{margin-left:5px;}
}