html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,blockquote,pre,a,abbr,acronym,address,big,cite,code,p,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video
{
margin:0;
padding:0;
border:0;
font-size:100%;
vertical-align:baseline;
}
html{
max-width: 1980px;
max-height：1680px;
height: 200%;
margin: 0 auto;
}
body{
height: 100%;
min-width:100%;
margin: 0;
padding: 0;
font-family:"Microsoft Yahei","Helvetica Neue",Arial,Helvetica,sans-serif;
}
a{
color: #000000;
text-decoration: none;
}
a img{
border: none;
}
#up{
height: 51.5%;
width: 100%;
}
.header{
width: 100%;
height: 80px;
position: fixed;
z-index: 999;
margin: 0px auto;
}
.header .header_bg{
width: 100%;
height: 80px;
background-color: #eeeeee;
}
.header_logo{
width: 100%;
margin-left: 30px;
}
.header .header_logo img{
width: 200px;
height: 65px;
left: 60px;
top: -70px;
position: relative;
float: left;
margin: 10px;
z-index: 999;
}
.header .header_menu{
margin-left: 35%;
width: 100%;
}
.header .header_menu ul{
position: relative;
top: -50px;
left: 40px;
/*width: 695px;*/
}
.header .header_menu ul li{
float: left;
list-style: none;
display: block;
padding: 10px;
font-size: 14px;
}
.header .header_menu ul li a:hover {
color: red;
}
.header .header_menu .nav_title .nav_chilren {
position: absolute;
z-index: 999;
text-align: center;
width: 100px;
background-color: #eee;
margin: 10px 0px 0px -20px;
display: none;
}
.header .header_menu .nav_title:hover .nav_chilren
{
z-index: 999;
display: block;
}
.header .header_menu .nav_title .nav_chilren p{
width: 100%;
height: 20px;
margin: 10px 0;
}
.header .header_menu .nav_title .nav_chilren p:hover{
background-color:#fff;
}
.drumbeating {
position: relative;
top: 0px;
left: 0px;
width: 100%;
height: 25%;
}
.drumbeating .drumbeating_bg{
width: 100%;
height: 100%;
background-color:#fff;
}
.drumbeating .drumbeating_news{
width: 40% ;
height: 100%;
position: absolute;
top: -15px;
left: 0px;
}
.drumbeating .drumbeating_news .drumbeating_news_pic{
padding: 20px 25px;
width: 30%;
height: 80%;
}
.drumbeating .drumbeating_news .drumbeating_news_pic img{
width: 100%;
height: 100%;
}
.drumbeating .drumbeating_news .drumbeating_news_pic .datebg{
width:60%;
height: 40%;
position: relative;
top: -42%;
left: 0px;
background-color: #666;
text-align: center;
}
.drumbeating .drumbeating_news .drumbeating_news_pic span{
color: white;
font-size:20px;
font-weight:bold ;
}
.drumbeating .drumbeating_news .drumbeating_news_word{
position: relative;
top: -100%;
left: 40%;
width: 60%;
height: 100%;
}
.drumbeating .drumbeating_news .drumbeating_news_word .title{
width: 100%;
height: 30%;
font-weight:bold;
margin-top:15px;
}
.drumbeating .drumbeating_news .drumbeating_news_word .content{
width: 100%;
height: 60%;
font-size:14px;
overflow: hidden;
}
.drumbeating .drumbeating_logo{
width: 55%;
height: 100%;
position: absolute;
top: 0;
left: 45%;
overflow: hidden;
/*background-color: #FF0000;*/
}
.drumbeating .drumbeating_logo ul{
/*float: right;*/
}
.drumbeating .drumbeating_logo ul li{
float: left;
list-style: none;
text-align: center;
height:100%;
width: 20%;
}
.drumbeating .drumbeating_logo ul li img{
width: 120px;
height: 120px;
/*padding-bottom: -10px;*/
}
.drumbeating .drumbeating_logo ul li p{
color:black;
font-weight:bold;
}
#down{
height: 50%;
width: 100%;
}
.main_bg{
height: 77%;
position: relative;
top: 0;
left: 0;
background:url(../images/mainbg.png) no-repeat;
background-size:100% 100%;
}
.foot{
position: relative;
top: 0;
left: 0;
width: 100%;
height: 23%;
background-color: #666;
}
.foot p{
margin:15px 0px;
}
.main_con{
height: 150px;
width: 100%;
position: absolute;
top: -150px;
left: 0;
}
.main_menu{
width: 190px;
height: 278px;
position: absolute;
z-index:5;
top: -150px;
left: 185px;
background: url(../images/main_menu.png) no-repeat 0px 0px;
}
.main_menu a{
width:190px;
height: 278px;
display:block;
background:url(../images/main_menu.png) no-repeat 0px 0px;
}
.main_menu a#A1{
height: 35px;
background-position: 0px 0px;
}
.main_menu a#A1:hover{
background-position: -196.5px 0px;
}
.main_menu a#A2{
height: 40px;
background-position: 0px -35px;
}
.main_menu a#A2:hover{
background-position: -196.5px -35px;
}
.main_menu a#A3{
height: 35px;
background-position: 0px -75px;
}
.main_menu a#A3:hover{
background-position: -196.5px -75px;
}
.main_menu a#A4{
height: 30px;
background-position: 0px -110px;
}
.main_menu a#A4:hover{
background-position: -196.5px -110px;
}
.main_menu a#A5{
height: 45px;
background-position: 0px -140px;
}
.main_menu a#A5:hover{
background-position: -196.5px -140px;
}
.main_menu a#A6{
height: 35px;
background-position: 0px -185px;
}
.main_menu a#A6:hover{
background-position: -196.5px -185px;
}
.shopbg{
width: 474px;
height: 290px;
position: absolute;
top: -180px;
left: 30%;
background: url(../images/index.png) no-repeat -520px -1570px;
}
.mainboxbg{
width: 80px;
height: 240px;
position: absolute;
top: -90px;
left: 50px;
background: url(../images/index.png) no-repeat -20px -1570px;
}
.bickbg{
width: 180px;
height: 140px;
position: absolute;
top: -50px;
left:70%;
background: url(../images/index.png) no-repeat -20px -2228px;
}
.main_news{
width: 139px;
height: 206px;
position: absolute;
top: -80px;
left: 80%;
background: url(../images/main_news.png);
}
.barsbg{
width: 100%;
height: 80px;
position: absolute;
z-index: 25;
top: -80px;
left: 0;
background: url(../images/index.png) no-repeat -606px -2219px;
}
@media only screen and (max-height:800px){
html{
height:200%;
}
.header .header_menu ul li{
float: left;
list-style: none;
display: block;
padding: 10px;
font-size: 14px;
}
.drumbeating .drumbeating_news .drumbeating_news_pic span{
color: white;
font-size:20px;
font-weight:bold ;
}
.drumbeating .drumbeating_news .drumbeating_news_word .title{
margin-top:2px;
}
.drumbeating .drumbeating_logo ul li img{
width: 82px;
height: 82px;
/*padding-bottom: -10px;*/
}
.foot p{
font-size:8px;
margin:10px 0px;
}
}
@media screen and (min-device-width: 320px) and (max-device-width: 480px){
html{
height:100%;
}
.header .header_menu ul li{
float: left;
list-style: none;
display: block;
padding: 10px;
font-size: 11px;
}
.drumbeating .drumbeating_logo ul li img{
width: 80px;
height: 80px;
/*padding-bottom: -10px;*/
}
.foot p{
font-size:8px;
}
}
@media all and(orientation:landscape){
html{
height:200%;
}
.drumbeating .drumbeating_logo ul li img{
width: 80px;
height: 80px;
/*padding-bottom: -10px;*/
}
.drumbeating .drumbeating_news .drumbeating_news_word .content{
width: 100%;
height: 50%;
font-size:10px;
margin-top:10px;
overflow: hidden;
}
}