@media screen and (orientation: portrait) {
 /*���� css*/
body {margin:0 auto;padding:0;width:100%;background:#c6daf2;color:#333;position:relative;font-size:1.2em;}

body a{text-decoration:none;color:#4b72bf;}
a:visited {
    color:#4b72bf;
}

div#logo {height:429px;width:100%;background:url(head1.jpg) no-repeat;}

 #main {width:100%;position:relative;background: rgb(255,255,255);}
p {text-indent:2em;}

.firl {width:92%;padding:2%;padding-right:4%;background: #eee;line-height:1.5;font-family:arial black;font-size:0.75em;}
.firl .firw{filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8;font-size:3.6em;line-height:3;border-bottom-right-radius:50%;padding:0.1em;padding-right:0.5em;font-weight:bold;float:left;margin-left:-12px;margin-top:-12px;margin-right:0.4em;background-color:rgb(252,252,252);color:#3f5c6a;}

.nor1 {width:100%;padding:0;color:#eee;line-height:1.5;}

.nor1 li {margin-bottom:1em;margin-left:-0.5em;margin-right:0.5em;padding:0.8em;padding-left:2em;background-color:#eee;color:#333;}
.nor1 li:hover {margin-bottom:1em;padding:0.8em;padding-left:2em;background-color:rgba(36,36,36,0.8);color:#ccc;}
li h3 {color:rgb(125,150,25);text-align:center;margin:0;}
li:hover h3 {color:rgb(225,125,125);}
li span.top {display:block;font-size:0.8em;color:rgb(125,150,25);}
li:hover span.top {display:block;font-size:0.8em;color:rgb(225,125,125);}
li span.sec {display:none;font-size:2em;margin-left:-0.5em;transition:1s;max-height:9999px;}
li span#targ {display:block;font-size:2em;}

.nor1 .topic{filter:alpha(Opacity=80);-moz-opacity:0.8;opacity:0.8;margin-top:1em;padding:0.5em;padding-left:2em;font-size:1.5em;font-weight:bold;background:#88CDC8 url(aset/t4.png) no-repeat center left;color:#efe;}

li hr {margin-left:2em;height:3px;border:none;border-top:3px groove skyblue;border-left:2em groove transparent;}

div#top2{filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8;margin-top:1em;padding:0.5em;padding-left:2em;background:#E5C976 url(aset/t2.png) no-repeat center left;font-size:1.5em;font-weight:bold;border:1px solid silver;color:#ffe;}
div#top3{filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8;margin-top:1em;padding:0.5em;padding-left:2em;background:#8DCEE2 url(aset/t3.png) no-repeat center left;font-size:1.5em;font-weight:bold;border:1px solid silver;color:#eff;}
div#top4{clear:both;filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8;margin-top:1em;padding:0.5em;padding-left:2em;font-size:1.5em;font-weight:bold;border:1px solid silver;background:#ef9aaf url(aset/t1.png) no-repeat center left;border:1px solid purple;color:#fee;}

.menu {width:28%;height:16em;margin-left:-1.2em;margin-right:.2em;font-size:1.6em;text-align:center;float:left;}
.contbox {width:70%;height:12.5em;background-color:#eee;margin-top:1.2em;margin-left:1.2em;overflow:auto;font-size:1.6em;}
.menu li:nth-of-type(odd) {background-color:#eee;color:#E5C976;padding:3px;}
.menu li:nth-of-type(even) {background-color:#fefefe;color:#E5C976;padding:3px;}
.menu li:hover {background-color:#E5C976;color:#ffe;}
.menu li.targ {background-color:#ef9aaf;color:#fee;}
.contbox div{display:none;text-align:center;padding-left:-2em;}
.contbox div p{text-align:left;font-size:1em;}
.contbox div.targ{display:block;}

.menu2 {width:900px;height:90px;font-size:1.4em;text-align:center;}
.menu2 li{width:165px;float:left;background-color:#eff;color:#6193c8;transition:1s;}
.menu2 li.target{background-color:#ef9aaf;color:#ffe;}
.menu2 li:hover{background-color:#ef9aaf;color:#ffe;}
.menu2 li:not(:last-child){border-right:2px solid #88cfc9;}

.contbox2 {margin-left:32px;width:900px;font-size:1.4em;overflow:auto;font-weight:bold;position:relative;}
.contbox2 .huafu1 {width:3200px;height:720px;position:relative;}
.contbox2 section {width:900px;float:left;text-align:center;}
.contbox2 div {width:450px;height:340px;float:left;}
.contbox2 div.zz {color:#df5352;}
.contbox2 img {height:200px;border-radius:6px;}
.contbox2 p {text-align:left;font-weight:normal;text-indent:0;margin-bottom:-0.8em;}

.nor2 {width:962px;color:#333;line-height:1.5;font-size:1.1em;}

.nor2 p#des{margin-bottom:1em;padding:0.8em;background-color:rgba(158,33,37,0.5);margin-right:6em;}
.nor2 span a{display:block;width:9em;height:4em;padding-bottom:2em;}

.nor2 .zz a {color:red;}
.nor2 a:hover{color:#ff8000;}
#showpic {margin:0 auto;height:900px;width:800px;text-align:center;}
#container{width:800px;height:200px;position: relative;overflow:hidden;text-align:center;}
.ball{
border-radius:100%;
position: absolute;
margin:1em;
left:50%;
width:100px;
height:100px;float:left;
}

#ball0,#ball6{background:#00FF00 url(./w/14.jpg) no-repeat top left}
#ball1,#ball7{background:#00FF00 url(./w/15.jpg) no-repeat}
#ball2,#ball8{background:#00FF00 url(./w/16.jpg) no-repeat}
#ball3,#ball9{background:#00FF00 url(./w/17.jpg) no-repeat}
#ball4,#ball10{background:#00FF00 url(./w/18.jpg) no-repeat}
#ball5,#ball11{background:#00FF00 url(./w/19.jpg) no-repeat}


#controlpanel{position: absolute;
margin:6px;
left:50%;top:160px;
width:200px;
height:100px;}

#leftanchor {width:0;height:0;float:left;border:12px solid transparent;border-right:24px solid #0099CC;margin-left:16px;}
#rightanchor{width:0;height:0;float:left;border:12px solid transparent;border-left:24px solid #0099CC;margin-left:32px;}
#leftanchor:hover{border-right:24px solid #33ccff;}
#rightanchor:hover{border-left:24px solid #33ccff;}


#main .nor3 {clear:both;border-top:1px solid gray;text-align:center;font-size:0.6em;background-color:rgba(25,25,25,0.6);color:white;padding-bottom:1em;}
#main .nor3 img {height:23px;}
#main .nor3 a {text-decoration:none;color:white;}

#main ol {list-style-type:none;}
#main hr {margin-left:-3em;}
#main img {margin-top:1em;margin-left:1em;}
} 
@media screen and (orientation: landscape) {
 /*���� css*/

body {margin:0 auto;width:962px;background:#c6daf2;color:#333;position:relative;font-size:1em;}

body a{text-decoration:none;color:#4b72bf;}
a:visited {
    color:#4b72bf;
}

div#logo {height:410px;width:962px;background:url(head.jpg) no-repeat;}

#main {max-width:960px;position:relative;border:1px solid gray;background: rgb(255,255,255);}

p {text-indent:2em;}

.firl {width:28%;position:absolute;right:0;padding:0.6em;padding-bottom:2.3em;background: #eee;line-height:1.8;font-size:1em;font-family:"΢���ź�";}
.firl .firw{filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8;font-size:2.4em;border-bottom-right-radius:50%;padding:0.1em;padding-right:0.5em;font-weight:bold;float:left;margin-left:-12px;margin-top:-12px;margin-right:0.4em;background-color:rgb(252,252,252);color:#3f5c6a;}

.nor1 {width:68%;color:#eee;line-height:1.5;}

.nor1 li {margin-left:-2em;margin-bottom:1em;padding:0.8em;padding-left:3em;background-color:#eee;color:#333;}
.nor1 li:hover {margin-left:-2em;margin-bottom:1em;padding:0.8em;padding-left:3em;background-color:rgba(36,36,36,0.8);color:#ccc;}
li h3 {color:rgb(125,150,25);text-align:center;margin:0;}
li:hover h3 {color:rgb(225,125,125);}
li span.top {display:block;font-size:1em;color:rgb(125,150,25);}
li:hover span.top {display:block;font-size:1em;color:rgb(225,125,125);}
li span.sec {display:none;transition:1s;margin-left:-1em;font-size:1em;max-height:9999px;}
li span#targ {display:block;}

.nor1 .topic{filter:alpha(Opacity=80);-moz-opacity:0.8;opacity:0.8;padding:0.8em;padding-left:2em;font-size:1.5em;font-weight:bold;background:#88CDC8 url(aset/t4.png) no-repeat center left;color:#efe;}

li hr {margin-left:2em;height:3px;border:none;border-top:3px groove skyblue;border-left:2em groove transparent;}

div#top2{filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8;margin-top:1em;padding:0.5em;padding-left:2em;background:#E5C976 url(aset/t2.png) no-repeat center left;font-size:1.5em;font-weight:bold;border:1px solid silver;color:#ffe;}
div#top3{filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8;margin-top:1em;padding:0.5em;padding-left:2em;background:#8DCEE2 url(aset/t3.png) no-repeat center left;font-size:1.5em;font-weight:bold;border:1px solid silver;color:#eff;}
div#top4{clear:both;filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8;margin-top:1em;padding:0.5em;padding-left:2em;font-size:1.5em;font-weight:bold;border:1px solid silver;background:#ef9aaf url(aset/t1.png) no-repeat center left;border:1px solid purple;color:#fee;}

.menu {width:26%;height:300px;margin-left:-1em;margin-right:1em;font-size:1em;text-align:center;float:left;}
.contbox {width:69%;height:300px;background-color:#eee;margin-top:1.2em;margin-left:1.2em;overflow:auto;}
.menu li:nth-of-type(odd) {background-color:#eee;color:#E5C976;padding:3px;padding-right:1em;}
.menu li:nth-of-type(even) {background-color:#fefefe;color:#E5C976;padding:3px;padding-right:1em;}
.menu li:hover {background-color:#E5C976;color:#ffe;}
.menu li.targ {background-color:#ef9aaf;color:#fee;}
.contbox div{display:none;text-align:center;}
.contbox div p{text-align:left;}
.contbox div.targ{display:block;}

.menu2 {width:900px;height:60px;font-size:0.7;text-align:center;}
.menu2 li{width:165px;float:left;background-color:#eff;color:#6193c8;transition:1s;}
.menu2 li.target{background-color:#ef9aaf;color:#ffe;}
.menu2 li:hover{background-color:#ef9aaf;color:#ffe;}
.menu2 li:not(:last-child){border-right:2px solid #88cfc9;}

.contbox2 {margin-left:32px;width:900px;font-size:16px;overflow:auto;font-weight:bold;position:relative;}
.contbox2 .huafu1 {width:3200px;height:550px;position:relative;}
.contbox2 section {width:900px;float:left;text-align:center;}
.contbox2 div {width:450px;height:260px;float:left;}
.contbox2 div.zz {color:#df5352;}
.contbox2 img {height:200px;border-radius:6px;}
.contbox2 p {text-align:left;font-weight:normal;}

.nor2 {width:962px;color:#333;line-height:1.5;font-size:1em;}

.nor2 p#des{margin-bottom:1em;padding:0.8em;background-color:rgba(158,33,37,0.5);margin-right:6em;}
.nor2 span a{display:block;width:14em;height:4em;padding-bottom:2em;}

.nor2 .zz a {color:red;}
.nor2 a:hover{color:#ff8000;}
#showpic {margin:0 auto;height:660px;width:800px;text-align:center;font-size:16px;}
#showpic img{height:600px;}
#container{width:800px;height:200px;position: relative;overflow:hidden;text-align:center;}
.ball{
border-radius:100%;
position: absolute;
margin:1em;
left:50%;
width:100px;
height:100px;float:left;
}

#ball0,#ball6{background:#00FF00 url(./w/14.jpg) no-repeat top left}
#ball1,#ball7{background:#00FF00 url(./w/15.jpg) no-repeat}
#ball2,#ball8{background:#00FF00 url(./w/16.jpg) no-repeat}
#ball3,#ball9{background:#00FF00 url(./w/17.jpg) no-repeat}
#ball4,#ball10{background:#00FF00 url(./w/18.jpg) no-repeat}
#ball5,#ball11{background:#00FF00 url(./w/19.jpg) no-repeat}


#controlpanel{position: absolute;
margin:6px;
left:50%;top:160px;
width:200px;
height:100px;}

#leftanchor {width:0;height:0;float:left;border:12px solid transparent;border-right:24px solid #0099CC;margin-left:16px;}
#rightanchor{width:0;height:0;float:left;border:12px solid transparent;border-left:24px solid #0099CC;margin-left:32px;}
#leftanchor:hover{border-right:24px solid #33ccff;}
#rightanchor:hover{border-left:24px solid #33ccff;}


#main .nor3 {clear:both;border-top:1px solid gray;text-align:center;font-size:0.6em;background-color:rgba(25,25,25,0.6);color:white;padding-bottom:1em;}
#main .nor3 img {height:23px;}
#main .nor3 a {text-decoration:none;color:white;}

#main ol {list-style-type:none;}
#main hr {margin-left:-3em;}
#main img {margin-top:1em;margin-left:1em;}
} 