*{margin:0;padding:0}
body{background: #326bb4;position: relative;padding-top:3%;overflow: hidden;}
/*
.building{position: absolute;top:10%;width:10%;left:80%;z-index:2;}
.building img{width:100%;}
.bgd{position: absolute;top:0;width:100%;left:0;z-index: 1}
.bgd img{width:100%;}
.btnRun{display:block;position: absolute;z-index: 3;}*/
.clearAll{clear:both;}
h1{
    margin-left:26%;
    width:30%;
    padding-top:2%;
}
h1 img{width:100%;}
.topBgd{
    position: absolute;
    right:5%;
    top:0;
    width:54%;
    display: block;
}
.monthSet{
    width:85%;
    margin:0 auto;
    margin-top: 60px;
    position: relative;
    z-index:2;
}
.monthSet li{
    position: absolute;
    list-style: none;
    /*float:left;
    width:14%;
    margin-left: 1%;
    margin-right: 1%;
    list-style: none;
    position: relative;
    margin-bottom: 20px;*/
}
.monthSet .monthIcon{
    position: absolute;
    top:6%;
    z-index:3;
    left: 0;
    width:100%;
    transform-origin:100% 100%;

}
.monthSet .monthBtn{
    position: absolute;
    bottom:5%;
    width:90%;
    margin-left:5%;
    z-index:2;
    cursor: pointer;
}
.monthSet .monthBgd{
    width:100%;
}
.singleSet{
    width:85%;
    margin:0 auto;
    margin-top: 50px;
    list-style: none;
    opacity:0;
    position: relative;
    z-index:1;
    display: none;
}
.curMonthTank{
    width:85%;
    margin:0 auto;
    margin-top: 50px;
    list-style: none;
    opacity:0;
    position: relative;
    z-index:1;
}
.singleSet li{
    /*display:none;*/
}
.singleSet .tank{
    width:100%;
    background: #fff;
    padding-bottom:20px;
}
.singleSet .topBar{
    width:100%;
    background: url(images/singleTop.png) no-repeat top center;
    height: 30px;
}
.singleSet .monthTitle{
    width:81%;
    max-width: 786px;
    margin:0 auto;
    display: block;
    padding-top: 28px;
    opacity: 0;
    -ms-transform: translate(0, -50px); /* IE 9 */
    -webkit-transform: translate(0px, -50px); /* Safari */
    transform: translate(0px, -50px);
}

.curMonthTank li{
    /*display:none;*/
}
.curMonthTank{
    position: relative;
}
.curMonthTank .tank{
    width:100%;
    background: #eff8fe;
    padding-bottom:20px;
}
.curMonthTank .topBar{
    width:100%;
    background: url(images/singleTop.png) no-repeat top center;
    height: 30px;
}
.curMonthTank .monthTitle{
    width:81%;
    max-width: 1170px;
    margin:0 auto;
    display: block;
    padding-top: 28px;
    opacity: 0;
    -ms-transform: translate(0, -50px); /* IE 9 */
    -webkit-transform: translate(0px, -50px); /* Safari */
    transform: translate(0px, -50px);
}
.monthPic{
    position: absolute;
    right:0;
    bottom:0;
    z-index:100;
    opacity: 0;
}
.keywordSet{
    width:80%;
    margin:0 auto;
    margin-top:20px;
}
.keywordSet li{
    position: relative;
    float:left;
    width:18%;
    margin:1% 3%;
    list-style: none;
    text-align: center;
    opacity: 0;
    -ms-transform: scale(0, 0); /* IE 9 */
    -webkit-transform: scale(0, 0); /* Safari */
    transform: scale(0, 0);
}
.keywordSet li a {
    position: absolute;
    display: block;
    bottom: 0;
    top: auto;
    height:100%;
}
.keywordSet img{
    width:auto;
    height:100%;
}
#icon1{
    width:60%;
    left:20%;
}
#icon2{
    width:42%;
    left:29%;
}
#icon3{
    width:80%;
    left:10%;
}
#icon4{
    width:62%;
    left:38%;
    top:4%;
}
#icon5{
    width:70%;
    left:15%;
}
#icon6{
    width:76%;
    left:12%;
}
#icon7{
    width:76%;
    left:12%;
}
#icon8{
    width:90%;
    left:5%;
    top:11%;
}
#icon9{
    width:72%;
    left:14%;
}
#icon10{
    width:56%;
    left:22%;
}
#icon11{
    width:86%;
    left:7%;
}
#icon12{
    width:76%;
    left:12%;
}

a.linkM2 {
    position: absolute;
    top: 0;
    right: 0;
}
.btnNavTank{display: block;}
.btnNav {
    position: absolute;
    bottom: 0;
    width: 40%;
    margin-left: 10%;
}
.btnNav a {
    display: inline-block;
    width: 20%;
    margin-right: 2%;
}
.btnNav img {
    width: 100%;
    max-width: 175px;
}

.windowContent{
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	z-index:100;
	background:url(images/windowBgd.png) repeat;
	display:none;
}

.contentTank{
	width:80%;
	height:60%;
	margin:5%;
	overflow-y:auto;
	background:#fcf4da;
	padding:2% 5%;
	font-family: "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1";
}
.windowContent .btnClose{
	position:absolute;
	right:10px;
	top:10px;
	display:block;
	font-size:30px;
	color:#fff;
	font-family: "Microsoft YaHei","\5FAE\8F6F\96C5\9ED1";
	width:30px;
	height:30px;
	line-height:30px;
	text-decoration:none;
}
.contentTank p{
	line-height:1.7em;
	margin-bottom:20px;
}
.contentTank h1{
	width:80%;
	margin:0 auto 20px auto;
	text-align: center;
}
@media (max-width: 480px) {
    .keywordSet li {
        width: 36%;
        margin: 2% 11% 2% 3%;

    }
    .keywordSet li a {
         text-align: center;
        width: 100%;
    }
    .monthPic{
        -ms-transform-origin: 100% 100%; /* IE 9 */
        -webkit-transform-origin: 100% 100%; /* Chrome, Safari, Opera */
        transform-origin: 100% 100%;
    }
    h1 {
        margin-left: 10%;
        width: 60%;
        padding-top: 2%;
    }
    .topBgd {
        right: -45%;
        top: 0;
        width: 120%;
    }
    .top {
        width: 100%;
        height: 100px;
        overflow: hidden;
        position: absolute;
        top: 0;
    }
    .btnNav {
        width: 60%;
    }
    .btnNav a {
        width: 30%;

    }
	.contentTank {
		width: 80%;
		height: 80%;
		margin: 10% 5% 5% 5%;
		padding: 2.5% 5%;
	}
	.contentTank img{
		width:90%;
	}
	.contentTank h1 {
		font-size: 20px;
	}
	.contentTank p {
		font-size: 15px;
	}

}