/* @Contents */
#contents {
	width: 90%;
	max-width: 1280px;
	margin: 0 auto;
	text-align: center;
	}

#contents h2 {
	clear: both;
	margin-bottom: 1.5em;
	padding: 0.5em 1em;
    border-radius: 0.25em;
	background: #397ecf;
	color: #FFF;
	font-size: 1em;
	}

#contents table {
	width: 100%;
	margin-bottom: 1.5em;
	border: 1px solid #333;
	border-bottom: none;
	border-left: none;
	border-spacing: 0;
	border-collapse: collapse;
	}

#contents th {
	width: 10%;
	padding: 0.5em;
	border-top: none;
	border-right: none;
	border-bottom: 1px solid #333;
	border-left: 1px solid #333;
	background: #EFEFEF;
	color: #666;
	font-weight: bold;
	text-align: center;
	}

#contents td {
	padding: 0.5em;
	border-top: none;
	border-right: none;
	border-bottom: 1px solid #333;
	border-left: 1px solid #333;
	text-align: left;
	}

#contents td a {
	color: #333;
	}

#contents td a:hover {
	text-decoration: underline;
	}

#contents hr {
	clear: both;
	border: none;
	margin-bottom: 1.5em;
	height: 9px;
	background: url(../images/base/hr.png) repeat-x 0 0;
	}

/* @Banner */
#Banner {
	overflow: auto;
	width: 100%;
	max-width: 800px;
	margin: 0 auto;
	margin-bottom: 1.5em;
	text-align : center;
	}

#Banner li {
	margin-bottom: 0.5em;
	}

#Banner li:last-child {
	margin-bottom: 0;
	}

#Banner li:hover {
	filter: alpha(opacity=50);
	opacity: 0.5;	
	}

#Banner li a img{
	width: 150px;
	}

/* @Ranking */
#Ranking {
	margin-bottom: 1.5em;
	background: #FFF;
	}

#Ranking p {
	padding: 0.5em 0 0;
	font-size: 80%;
	text-align: right;
	}

#Ranking table {
	margin-bottom: 0;
	}

/* @Topics */
#Topics {
	margin-bottom: 1.5em;
	background: #FFF;
	}

#Topics .FstTopics {
	float: left;
	margin-right: 2%;
	margin-right: 3.5%\9; /* IE10以下 */
	width: 32%;
	width: 31%\9; /* IE10以下 */
	}
#Topics .FstTopics:not(:target) {
	margin-right: 2%\9; /* IE9,10 */
	width: 32%\9; /* IE9,10 */
	}

#Topics .ScdTopics {
	float: left;
	width: 32%;
	width: 31%\9; /* IE10以下 */
	}
#Topics .ScdTopics:not(:target) {
	width: 32%\9; /* IE9,10 */
	}

#Topics .TrdTopics {
	float: right;
	margin-left: 2%;
	width: 32%;
	width: 31%\9; /* IE10以下 */
	}
#Topics .TrdTopics:not(:target) {
	width: 32%\9; /* IE9,10 */
	}

#Topics .FstTopics .TopicsTitle,
#Topics .ScdTopics .TopicsTitle,
#Topics .TrdTopics .TopicsTitle {
	color: #333;
	}

#Topics .FstTopics:hover, 
#Topics .ScdTopics:hover, 
#Topics .TrdTopics:hover {
	filter: alpha(opacity=50);
	opacity: 0.5;	
	}

#Topics .FstTopics:hover .TopicsTitle,
#Topics .ScdTopics:hover .TopicsTitle,
#Topics .TrdTopics:hover .TopicsTitle {
	margin-bottom: 0;
	text-decoration: underline;
	/*word-wrap: break-word;*/
	}

#Topics .BoxTopics {
	height: 65px;
	margin-bottom: 1.0em;
	padding: 0 0.5em;
	border: 1px solid #333;
	background: url(../images/base/topics_go_m.png) right bottom no-repeat;
	text-align: left;
	font-weight: bold;
	}

#Topics .goCategory {
	clear: both;
	margin-bottom: 0;
	font-weight: bold;
	}

#Topics .goCategory a{
	color: #333;
	}

#Topics .goCategory a:hover{
	text-decoration: underline;
	filter: alpha(opacity=50);
	opacity: 0.5;	
	}

/* @Info */
#Info, #Info2 {
	margin-bottom: 1.5em;
	background: #FFF;
	text-align: left;
	}

#Info h3, #Info2 h3 {
	margin-bottom: 0.5em;
	}

#Info li {
	padding: 0.5em 0;
	vertical-align: middle;
	}

#Info li .date {
	margin-right: 2em;
	display: block;
	color:#333;
	}

#Info li .text {
	display: block;
	overflow: hidden;
	}

#Info2 h3.taishokishu {
	color: #F00;
	}

/* list */
#contents h3.list {
	margin-bottom: 1.5em;
	padding: 0.5em;
	border-bottom: 2px solid #397ecf;
	font-size: 1em; /* 24px */
	}

/* thanks */

#contents .thanks {
	margin-bottom: 1.5em;
	padding: 1em;
	border: 2px solid #CCC;
	background-color: #EEE;
	font-size: 1em; /* 24px */
	font-weight: bold;
	}

#contents #goHome a {
    padding: 0.25em 0.75em;
    border-radius: 0.25em;
	background-color: #3a7ecf;
    color: #FFF;
    }

#contents #goHome a:hover {
	background: #72a3dc;
    }

/*480px*/
@media screen and (min-width : 480px){
#Banner li{
	float: left;
	margin: 0 2% 0 0;
	width: 32%;
	width: 31%\9; /* IE10以下 */
	}
#Banner li:not(:target) {
	width: 32%\9; /* IE9,10 */
	}

#Banner li:last-child {
	margin-right: 0;
	}

#Banner li a img{
	width: 247px;
	}
}

/*768px*/
@media screen and (min-width : 768px){
#contents h2 {
	font-size: 1.25em;
	text-align: left;
	}

#Ranking table {
	border: 2px solid #333;
	border-bottom: none;
	border-left: none;
	}

#Ranking th {
	border-bottom: 2px solid #333;
	border-left: 2px solid #333;
	}

#Ranking td {
	border-bottom: 2px solid #333;
	border-left: 2px solid #333;
	}

#Topics .BoxTopics {
	height: 85px;
	padding: 0.5em 1.0em;
	border: 2px solid #333;
	background: url(../images/base/topics_go.png) right bottom no-repeat;
	font-size: 1.25em;
	}

#Info li .date {
	float: left;
	}

#contents h3.list {
    border-left: 10px solid #397ecf;
	font-size: 1.25em;
	text-align: left;
	}

#contents .thanks {
	font-size: 1.25em;
	}	
}

/*1024px*/
@media screen and (min-width : 1024px){
}
