body { font-family: Microsoft YaHei; margin: 0; padding: 0; background: #282828 url(../images/bg.jpg) repeat-y center ; font-size: 14px; }
p, div, form, img, ul, ol, li, dl, dt, dd { margin: 0; padding: 0; border: 0; }
ul, ol, li { list-style: none; }
h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; }
table, li, tr, th, br { font-family: Microsoft YaHei; font-size: 14px; }
img { display: block; max-width: 100%; }

/* Á´½ÓÑÕÉ« */
a { text-decoration: none; }
a:hover { text-decoration: none; color: #C00; }
.fl { float: left; }
.fr { float: right; }
.tc { text-align: center; }
.tr { text-align: right; }
.cl { clear: both; }

/* nav */
.nav { width: 100%; color: #fff; text-align: center; font-size: 12px; height: 40px; line-height: 40px; font-weight: normal; font-family: SimSun; background: #000; }
.nav a { color: #fff; }

.clearflx::after { content: '.'; display: block; clear: both; height: 0; visibility: hidden; }
.ww { max-width: 1100px; margin: 0px auto; clear: both; position: relative; }
.ww a.a01{ position: absolute; top: 40%; left: 6%; width: 55%; height: 40%; }
.ww a.a02{ position: absolute; top: 35%; left: 68%; width: 26%; height: 57%; }
.ww a.a03{ position: absolute; top: 55%; left: 2%; width: 15%; height: 23%; }
.ww a.a04{ position: absolute; top: 15%; left: 78%; width: 18%; height: 33%; }
.ww a.a05{ position: absolute; top: 55%; left: 85%; width: 13%; height: 30%; }
.ww::after { content: '.'; display: block; clear: both; height: 0; visibility: hidden; }
.bg01{ width: 100%; background: url(../images/bg01.jpg) repeat-y center; }
.bg01::after { content: '.'; display: block; clear: both; height: 0; visibility: hidden; }
.bg02{ width: 100%; background: url(../images/bg02.jpg) repeat-y center; }
.bg02::after { content: '.'; display: block; clear: both; height: 0; visibility: hidden; }

.box02{ display: flex; justify-content: space-between; }
.box02 a{ display: block; width: 311px; height: 309px; box-shadow:5px 5px 3px #e1e1e1;}
.box02 a.b01{ background:url(../images/a01.jpg);}
.box02 a.b01:hover{ background:url(../images/b01.jpg);}
.box02 a.b02{ background:url(../images/a02.jpg);}
.box02 a.b02:hover{ background:url(../images/b02.jpg);}
.box02 a.b03{ background:url(../images/a03.jpg);}
.box02 a.b03:hover{ background:url(../images/b03.jpg);}
.box02 a.b04{ background:url(../images/a04.jpg);}
.box02 a.b04:hover{ background:url(../images/b04.jpg);}
.box02 a.b05{ background:url(../images/a05.jpg);}
.box02 a.b05:hover{ background:url(../images/b05.jpg);}
.box02 a.b06{ background:url(../images/a06.jpg);}
.box02 a.b06:hover{ background:url(../images/b06.jpg);}

.box03{ float: left; width: 88%; padding: 5% 6%; }
.box03 .left{ float: left; width: 42%; }
.box03 .left div{ width: 44%; display: block; clear: both; }
.box03 .left p{ font-size: 14px; line-height: 26px; color: #111111; text-indent: 28px; padding-top: 10px; }
.box03 .left p a{ color: #111111; }
.box03 .right{ float: right; width: 40%; }

.list01{ display: block; }
.list01 li{ display:inline-block; margin: 3%; width: 295px; padding-bottom: 12px; background: #f5f5f5; border-bottom: 2px #2dc163 solid; }
.list01 li img { width: 100%; }
.list01 li h2{ background: #2dc163; padding: 8px 0; font-size: 14px; color: #fff; text-align: center; }
.list01 li p{ padding: 12px 20px; font-size: 14px; line-height: 26px; text-indent: 28px; color: #262626; }
.list01 li a.x{ margin: 0px auto; display: block; width: 108px; height: 26px; border: 1px #2dc163 solid; line-height: 26px; border-radius: 5px; font-size: 14px; color: #2dc163; text-align: center; }
.list01 li a.x:hover{ border: 1px #262626 solid; color: #262626; }

.new01{ float: left; width: 295px; padding-bottom: 12px; background: #f5f5f5; border-bottom: 2px #2dc163 solid;}
.new01 h2{ background: #2dc163; padding: 8px 0; font-size: 14px; color: #fff; text-align: center; }
.new01 p{ padding: 12px 20px; font-size: 14px; line-height: 26px; text-indent: 28px; color: #262626; }
.new01 a.x{ margin: 0px auto; display: block; width: 108px; height: 26px; border: 1px #2dc163 solid; line-height: 26px; border-radius: 5px; font-size: 14px; color: #2dc163; text-align: center; }
.new01 a.x:hover{ border: 1px #262626 solid; color: #262626; }



.box03r{ float: left; width: 1100px; }
.box03r .left{ float: left; width: 38px; height: 86px; margin: 230px 32px 0 0; background: url(../images/left.jpg) 0px 0px no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60); -moz-opacity: .6; opacity: 0.6;}
.box03r .left:hover{filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; opacity: 1;}
.box03r .right{ float: left; width: 38px; height: 86px; margin: 230px 0 0 32px; background: url(../images/right.jpg) 0px 0px no-repeat; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60); -moz-opacity: .6; opacity: 0.6;}
.box03r .right:hover{filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; opacity: 1;}


.tit{max-width: 1920px; margin: 0px auto; }

.box01{ max-width: 800px; margin: 40px auto; }
.box01 .left{ float: left; width: 70%; }
.box01 .left iframe{ width: 100%; height: 390px; }
.box01 .right{ float: right; width: 26%; }
.box04{ width:90%; padding:5% 5% 0 5%; text-align:center;}
.box04 p{ padding:3% 0 5% 0; text-align:center; font-size:12px;}

.tab01 {display:-webkit-table;display:table;width:100%;}
.tab01 li {background:#000; width: 100%;}
.tab01 li:last-child span{ border-right:0;}
.tab01 li span { width:100%;display:block;color:#FFF;font-size:16px; line-height:24px; padding:15px 0;text-align:center;}
.tab01 li span.here { background:#2dc163; color:#fff;}
.tab01Cont{ display:none;}
.tab01 li b{ clear: both; display: block; }
.tab01 hr{ background: #2dc163; border-top: 1px #2dc163 solid; margin: 30px 45px; }

.l1_1 { width: 105px; position: fixed; top: 100px; right: 50%; margin-right: -650px; }
*html .l1_1 { position: absolute; bottom: auto; top: expression(eval(document.documentElement.scrollTop)); }
.l7 { position: absolute; width: 105px; right: 50%; margin-right: -650px; }

.floating{ float: left; width: 124px; height: 293px; background: url(../images/float.png) 0px 0px no-repeat; }
.floating a{ float: left; width: 97px; height: 26px; margin: 86px 0 0 15px; display: block; }


/* footer */
#footer { width: 100%; line-height: 25px; font-family: SimSun; font-size: 12px; color: #fff; font-weight: normal; text-align: center; background:#000; padding:40px 0;}
#footer a { color: #fff; }
#footer p { text-align: center; font-family: SimSun; font-size: 12px; }
#footer address { font-style: normal; text-align: center; color: #fff; font-family: SimSun; font-size: 12px; }


@media (min-width: 1200px) and (max-width: 1920px){
	.max{
		display:none;}
     #footer span{
        display: none;
    }
    #footer p{
        display: block;
    }    
}

/*在 992 和 1199 像素之间的屏幕里,这里的样式才生效*/
@media (min-width: 992px) and (max-width: 1199px) {
    .max{
        display:none;}
     #footer span{
        display: none;
    }
    #footer p{
        display: block;
    }    
    .list01 li{ width: 29%; margin: 1.5%; }
}
/*在 768 和 991 像素之间的屏幕里,这里的样式才生效*/
@media (min-width: 768px) and (max-width: 991px) {
    
	.max{
		display:none;}
    #footer span{
        display: none;
    }
    #footer p{
        display: block;
    }
.box02 a{ display: block; width: 240px; height: 239px; box-shadow:5px 5px 3px #e1e1e1;}
.box02 a.b01, .box02 a.b01:hover, .box02 a.b02, .box02 a.b02:hover, .box02 a.b03, .box02 a.b03:hover, .box02 a.b04, .box02 a.b04:hover, .box02 a.b05, .box02 a.b05:hover, .box02 a.b06, .box02 a.b06:hover{ background-size:240px 239px;}
    .list01 li{ width: 29%; margin: 1.5%; }
}


/*在 480 和 767 像素之间的屏幕里,这里的样式才生效*/
@media (min-width: 480px) and (max-width: 767px) {
    .xs{
        display: none;
    }
	.max{
		display:block;}
    #footer{
        padding: 10px 0;
        font-size: 12px;
    }
    #footer span{
        display: block;
    }
    #footer p{
        display: none;
    }
    .box04 iframe{ width: 100%; height: 220px; }
	.box04 p{ font-size:12px;}
    
    .tab01 hr{ background: #2dc163; border-top: 1px #2dc163 solid; margin: 10px 20px; }
    .tab01 li span{ font-size: 12px; line-height: 18px; padding: 8px 0; }  
.box02 a{ display: block; width: 120px; height: 119px; box-shadow:5px 5px 3px #e1e1e1;}
.box02 a.b01, .box02 a.b01:hover, .box02 a.b02, .box02 a.b02:hover, .box02 a.b03, .box02 a.b03:hover, .box02 a.b04, .box02 a.b04:hover, .box02 a.b05, .box02 a.b05:hover, .box02 a.b06, .box02 a.b06:hover{ background-size:120px 119px;}
    
    .list01 li{ width: 29%; margin: 1.5%; }


}

/*在小于 480 像素的屏幕,这里的样式才生效*/
@media (max-width: 479px) {
    .xs{
        display: none;
    } 
	.max{
		display:block;}
    #footer{
        padding: 10px 0;
        font-size: 12px;
    }
    #footer span{
        display: block;
    }
    #footer p{
        display: none;
    }
    .box04 iframe{ width: 100%; height: 220px; }
	.box04 p{ font-size:12px;}
    .tab01 hr{ background: #2dc163; border-top: 1px #2dc163 solid; margin: 10px 20px; }
    .tab01 li span{ font-size: 12px; line-height: 18px; padding: 8px 0; }    
.box02 a{ display: block; width: 110px; height: 109px; box-shadow:5px 5px 3px #e1e1e1;}
.box02 a.b01, .box02 a.b01:hover, .box02 a.b02, .box02 a.b02:hover, .box02 a.b03, .box02 a.b03:hover, .box02 a.b04, .box02 a.b04:hover, .box02 a.b05, .box02 a.b05:hover, .box02 a.b06, .box02 a.b06:hover{ background-size:110px 109px;}
.list01 li{ width: 86%; margin: 1.5% 7%; }

.box03 .left{ float: left; width: 100%; }
.box03 .right{ float: left; width: 100%; margin-top: 20px; }
   
}