@charset "utf-8";

body {
	background:url(../image/bg_ajgg.jpg) #FFF;
}
.userContent {
    padding: 10px 20px; text-align: left; font-size: 1em; line-height: 1.5em;
}
.contentTitle {
	display: block; width: 90%; color: #999900; font-size: 1.8em; line-height: 1em; font-weight: bold; margin: 20px; padding: 20px 0 10px 0; border-bottom:#444 1px solid;
}
.subTitle {
	display: block; width: 95%; color: #999900; font-size: 1.8em; line-height: 1em; font-weight: bold; margin: 0px; padding: 20px 0 10px 0; border-bottom:#444 1px solid;
}
a {
	color: #00C;
}


.mainBg {
	background:#FFF; width: 980px; text-align: left; margin: 10px; box-shadow: 0px 0px 10px #AAA;
}
.mainList {
	list-style-type:none; overflow:hidden; padding:0; margin:0;
}
.mainList > .logo {
	float: left; width: 226px; height: 100px; overflow: hidden; border-right:#AAA 4px solid;
}
.mainList > .logo img {
	max-width: 100%; max-height: 100%;
}
.mainList > .header {
	float: left; width: 750px; height: 100px; overflow: hidden; background: #ffffcc;
}
.mainList > .leftMenu {
	display: table-cell; width: 226px; min-height: 40px; overflow: hidden; background: #660033; border-right:#AAA 4px solid;
}
.mainList > .rightMenu {
	display: table-cell; width: 750px; min-height: 40px; overflow: hidden; background: #000033; font-size: 11px;
}
.mainList > .leftHeader {
	display: table-cell; width: 226px; min-height: 600px; overflow: hidden; background: url(../image/bg_left.jpg) #d7e4b6; border-right:#AAA 4px solid;
}
.mainList > .content {
	display: table-cell; width: 750px; min-height: 600px; overflow: hidden; background: #f2f2f2;
}

.mainList > .leftMenu > a {
	float: right; height: 40px; background: #660033; color: #FFF; font-weight: bold; font-size: 1.1em; line-height: 40px; margin: 0; padding: 0 10px;
	transition:background .2s ease-in;
}
.mainList > .leftMenu > a:hover, .mainList > .leftMenu > .over {
	float: right; height: 40px; background: #FF0033; color: #FFF; font-weight: bold; font-size: 1.1em; line-height: 40px; margin: 0; padding: 0 10px;
	transition:background .2s ease-in;
}
.mainList > .rightMenu > a {
	float: left; height: 40px; background: #000033; color: #FFF; font-weight: bold; font-size: 1.1em; line-height: 40px; margin: 0; padding: 0 10px;
	transition:background .2s ease-in;
}
.mainList > .rightMenu > a:hover, .mainList > .rightMenu > .over {
	float: left; height: 40px; background: #3333cc; color: #FFF; font-weight: bold; font-size: 1.1em; line-height: 40px; margin: 0; padding: 0 10px;
	transition:background .2s ease-in;
}

.pageContent {
	min-height: 500px;
}
.footer {
	background: #eaeaea; min-height: 60px; padding: 10px; margin: 20px 0 0 0; color: #666; text-align: center;
}
.footerMenu {
	margin: 10px; color: #444;
}
.footerMenu > a {
	color: #444;
	transition:color .2s ease-in;
}
.footerMenu > a:hover {
	color: #AAA;
}

.board {
	margin: 0 20px; color: #444;
}
.board > .title {
	display: block; font-size: 1.4em; line-height: 1.4em; margin: 30px 0 10px 0; font-weight: bold; text-decoration: underline;
}
.board > .list {
	display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 10px;
}
.board > .list > .name {
	box-shadow: 0px 0px 2px #CCC; background: #FCFCFC; padding: 10px; min-height: 60px;
	transition:background .2s ease-in;
}
.board > .list > .name > .location {
	color: #888;
}

.early {
	width: 90%; margin: 30px 20px 20px 20px; padding: 20px 10px; color: #444; box-shadow: 0px 0px 2px #CCC; background: #FCFCFC;
}
.customPage {
	width: 100%;
}
.customPage > .title {
	display: block; font-size: 1.4em; line-height: 1.4em; padding: 0 0 10px 0;
}
.customPage > ul {
	list-style-type:none; overflow:hidden; padding:0; margin: 0 0 30px 0; width: 100%;
}
.customPage > ul > li {
	border-bottom: 1px #CCC solid; padding: 5px 0;
}
.customPage > ul > li > .file {
	display: inline-block; width: 48%; padding: 5px; vertical-align: top;
}
.customPage > ul > li > .name {
	display: inline-block; width: 48%; padding: 5px; vertical-align: top;
}

.issueList {
	width: 90%; margin: 0 20px 0 20px; padding: 0; color: #444;
}
.issueList > .year {
	color: #999900; font-size: 1.8em; line-height: 1.8em; font-weight: bold; margin: 30px 0 0 0;
}
.issueList > .item {
	box-shadow: 0px 0px 2px #CCC; background: #FCFCFC; font-size: 1.2em; line-height: 1.2em; padding: 5px; cursor: pointer;
	transition:background .2s ease-in;
}
.issueList > .item:hover {
	background: #EEE;
}
.issueList > .item a {
	color: #444;
}
.issue {
	width: 90%; margin: 30px 20px 20px 20px; padding: 20px 10px; color: #444; box-shadow: 0px 0px 2px #CCC; background: #FCFCFC;
}
.issue > .title {
	color: #444; font-size: 1.5em; line-height: 1.5em; font-weight: bold; margin: 0 0 30px 0;
}
.back {
	width: 90%; margin: 0 20px 0 20px; text-align: right;
}


@media only screen and (max-width:980px) {
	.mainBg {
		width:100%; margin: 0; box-shadow: none;
	}
	.mainList > .logo {
		display: table-cell; width: 180px; height: 80px; overflow: hidden; border-right:#AAA 4px solid;
	}
	.mainList > .header {
		display: none;
	}
	.mainList > .leftMenu {
		display: table-cell; border: none; width: 80px; vertical-align: top;
	}
	.mainList > .leftMenu > a {
		width: 60px;
	}
	.mainList > .rightMenu {
		display: table-cell; width: auto;
	}
	.mainList > .leftHeader {
		display: none;
	}
	.mainList > .content {
		display: block; width: 100%; border-top: #AAA 3px solid;
	}
}

@media only screen and (max-width:730px) {
	.mainList > .logo {
		display: block; width: 100%; text-align: center; background: #fff8e6;
	}
	.customPage > ul > li > .file {
		width: 90%;
	}
	.customPage > ul > li > .name {
		width: 90%;
	}
	.mainList > .leftMenu > a {
		height: 30px; line-height: 30px;
	}
	.mainList > .leftMenu > a:hover, .mainList > .leftMenu > .over {
		height: 30px; line-height: 30px;
	}
	.mainList > .rightMenu > a {
		height: 30px; line-height: 30px;
	}
	.mainList > .rightMenu > a:hover, .mainList > .rightMenu > .over {
		height: 30px; line-height: 30px;
	}
	.board > .list {
		grid-template-columns: 1fr 1fr;
	}
}

@media only screen and (max-width:500px) {
	.early {
		width: 85%;
	}
	.issueList {
		width: 85%;
	}
	.issue {
		width: 85%;
	}
}

@media only screen and (max-width:380px) {
	.board > .list {
		grid-template-columns: 1fr;
	}
}
