@charset "utf-8";

/* ===============================================
	BASE
=============================================== */
/*  BODY
------------------------------------------------*/
body {
	width:100%;
	min-width:320px;
	font-size:1.2rem;
}

* {
	box-sizing:border-box;
	
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
}

#container {
	background:#fff;
	text-align:left;
	overflow:hidden;
}


/* ===============================================
	HEADER
=============================================== */
#header {
}

/*  TITLE
------------------------------------------------*/
h1 {
}

h2 {
	margin:0 10px 10px;
	padding:8px 5px;
	background:#fc1b1c;
	border-radius:2px;
	color:#fff;
	font-size:1.2em;
	font-weight:bold;
	line-height:1;
	text-align:center;
}

h3 {
	background:#e62e4c;
	border-radius:2px;
	color:#fff;
}

h4 {
	background:#e62e4c;
	color:#fff;
}

/* LEAD */
#Lead {
	margin:0 0 10px;
	padding:10px;
	background:url(../img/lead_back.png) repeat-y;
	background-size:100% auto;
	color:#fff;
	text-shadow:1px 1px 2px #000, -1px -1px 2px #000;
}

#Lead p {
}

#Lead b {
	color:#e5007f;
}

#Lead em {
	color:#e5007f;
	font-weight:bold;
}

#Lead img {
	width:100%;
}


/* ===============================================
	CONTENTS
=============================================== */
/*  .header
------------------------------------------------*/
.header {
	margin:0;
}

/* LEAD */
.Lead {
	margin:0;
}

.Lead em {
	color:#009800;
	font-weight:bold;
}

/*  CONTENTS
------------------------------------------------*/
.article {
	background:#fff url(../img/contents_back.jpg) no-repeat;
	background-size:contain;
}

.section {
	margin:20px 0 0;
}

.content {
	margin:0 10px;
}

.Top {
	margin-bottom:10px;
}

.Item .Number {
	margin:0 0 3px;
	background:#787878;
	border:none;
	text-align:center;
}
.Item:nth-of-type(-n+10) .Number {
	background:#cc0000;
}

/* .Comment */
.Comment {
	padding:5px;
	background:#ffe372;
	border-radius:2px;
	clear:both;
}

/*	RANK
------------------------------------------------*/
.section {
	counter-reset:rank;
}

.section .Rank {
	padding-top:1px !important;
	padding-bottom:1px !important;
}

.section .Rank:before {
	content:"第"counter(rank)"位";
	counter-increment:rank;
}

.otherList {
	padding:10px 0 0;
	border-top:1px #666 dashed;
}

.titleList ol {
	margin:0;
}

.titleList ol li {
	position:relative;
	margin:0 0 5px;
	padding-left:52px !important;
}
.titleList ol li:before {
	position:absolute;
	top:0;
	left:0;
	display:block;
	width:46px;
	padding:2px 0;
	background:#787878;
	border-radius:2px;
	color:#fff;
	font-size:0.88em;
	line-height:1.2em;
	text-align:center;
}

/*	NAV
------------------------------------------------*/
.Nav li {
	width:45%;
	max-width:320px;
	margin:0 1%;
}

.Nav2 {
	margin:20px 0 0;
}

/*	#categoryNav
------------------------------------------------*/
#categoryNav {
	margin:20px 0 0;
	text-align:center;
}

#categoryNav ul {
	letter-spacing:-0.4em;
}

#categoryNav li {
	display:inline-block;
	width:45%;
	margin:0 3px 5px;
	letter-spacing:normal;
}

#categoryNav li em {
	display:block;
	margin:0 auto;
	border:1px #ccc solid;
}

#categoryNav li em span {
	display:block;
	width:100%;
	height:100%;
	padding:10px 5px 8px;
	background:linear-gradient(to bottom, #006C0E 0%, #0D5413 100%);
	border-left:1px #fff solid;
	border-top:1px #fff solid;
	border-right:1px #0A2B0D solid;
	border-bottom:1px #0A2B0D solid;
	color:#fff;
	font-weight:bold;
	text-align:center;
	line-height:1.13em;
	
	background:-webkit-gradient(linear, center top, center bottom, from(#006C0E), to(#0D5413));
}