@charset "utf-8";

body {
	background:#e9eaed;
	color: #666;
	font-size: 0.9em;
}

/*---------------------------------------
Base Layout
---------------------------------------*/
#header {
	width:100%;
	border-bottom: solid #e0e0e0 1px;
	background:#FFF;
	position: absolute;
	top: 0;
}

	#header p {
		max-width:1050px;
		margin: auto;
		padding: 10px 0 14px;
	}

#footer {
	width:100%;
	padding:25px 0;
	border-top: solid #e0e0e0 1px;
	background:#FFF;
	text-align: center;
	overflow: hidden;
}

	.small {
		margin:0 auto;
		font-size: 0.9em;
	}

#mainContents {
	max-width: 900px;
	margin:auto;
	padding-top: 70px;
}

#whiteBg {
	margin-top:30px; 
	margin-bottom: 30px;
	padding: 40px 55px;
	/*background:#FFF;*/
	background: url(img/bg.jpg) repeat-y;
	background-size: contain;
}

/* ページトップへ */
.pagetopbox {
	text-align: right;
}

#pageTop {
	/*display:none;*/
	position: fixed;
	bottom: 20px;
	right: 20px;
	font-size: 100%;
}

#pageTop a {
	background: url(../img_com/top.png) no-repeat top #666;
	opacity:0.6;
	text-decoration: none;
	color: #fff;
	width: 80px;
	padding: 30px 0 20px;
	text-align: center;
	display: block;
	border-radius: 5px;
}

#pageTop a:hover {
	text-decoration: none;
	background:url(../img_com/top.png) no-repeat top center #999;
}

/*---------------------------------------
Contents
---------------------------------------*/
h1 img{width: 100%;}

h1,h2 {text-align: center;}

.titleEx {
	padding-top: 15px;
	text-align:center;
}

/* Navi */
ul#nav {
	width: 100%;
	padding-bottom: 50px;
	font-size: 1.2em;
	line-height: 1.3em;
}
	ul#nav li {
		margin: 0 12px;
		vertical-align: top;
		display: inline-block;
	}

		ul#nav li img {vertical-align: middle;padding-right:10px;}

	ul#nav li a:link,
	ul#nav li a:visited {
		padding-right: 20px;
		text-decoration: none;
		color: #FFF;
		background-color: rgba(0,0,0,0.7);
		display: block;
		border-radius: 20px;        /* CSS3草案 */  
		-webkit-border-radius: 20px;    /* Safari,Google Chrome用 */  
		-moz-border-radius: 20px;   /* Firefox用 */ 
	}

	ul#nav li a:hover {
		background-color: rgba(255,0,0,0.6);
	}

/*　1-3位　*/
ul#ranking {
	padding-bottom: 20px;
}

	ul#ranking li {
		width: 31%;
		margin: 0 0.8%;
		vertical-align: top;
		display: inline-block;
		text-align: center;
		color: #333333;
		font-weight: bold;
		font-size: 1.2em;
	}

		ul#ranking li img {width: 100%; height: auto;}

ul#ranking2 {
	padding-bottom: 10px;
}

	ul#ranking2 li {
		padding: 5px 20px 5px 5px;
		background: #d3971a;
		margin: 5px;
		vertical-align: top;
		display: inline-block;
		font-size: 1.1em;
		color: #FFF;
		border-radius: 14px;        /* CSS3草案 */  
    	-webkit-border-radius: 14px;    /* Safari,Google Chrome用 */  
    	-moz-border-radius: 14px;   /* Firefox用 */  
	}

	ul#ranking2 img {vertical-align: middle;padding-right: 5px;}

	ul#ranking2 li.kiri {background: #ffcc00; color: #643100;}

ul#ranking3 {
	padding-top: 10px;
	padding-bottom: 10px;
}

	ul#ranking3 li {
		width: 23%;
		padding: 0 0.5%;
		vertical-align: top;
		display: inline-block;
		text-align: center;
		font-size: 1.3em;
		font-weight: bold;
	}

	ul#ranking3 li img {width: 100%;}

/* ランキングボックス背景 */
#pointBox {
	margin-bottom: 20px;
	padding: 10px;
	background: #feffdd;
	border-left: solid 5px #6a3906;
	border-right: solid 5px #6a3906;
	border-bottom: solid 5px #6a3906;
	line-height: 1.5em;
}

/* ランキング用文字装飾 */
.red_big {
	color: #ac0b1c;
	font-size: 1.5em;
}

.orange_big {
	color: #ff9900;
	font-size: 1.5em;
}

.brown_big {
	color: #81511c;
	font-size: 1.5em;
}

.name {
	font-size: 0.8em;
	font-weight: normal;
}

/*　メッセージボード　*/
.message {
	width: 80%;
	margin: 0 auto;
	padding: 10px 20px;
	background: #FFF;
	line-height: 1.5em;
	border-radius: 14px;        /* CSS3草案 */  
	-webkit-border-radius: 14px;    /* Safari,Google Chrome用 */  
	-moz-border-radius: 14px;   /* Firefox用 */  
}

.message p {
	margin: 0;
	display: table-cell;
	vertical-align: middle;
}

/* 注意事項 */
.attention {
	padding-bottom: 30px;
}

ul.attentionList {padding-bottom: 20px;}
	ul.attentionList li {line-height: 1.5em;list-style-type: disc;margin-left: 20px;}


/* PCの時非表示 */
.spNone {display: none;}
.pcNone {display:inherit;}

/* 共通 */
.mrg_b_30 {margin-bottom: 30px;}
.pdg_b_10 {padding-bottom: 10px;}
.pdg_b_20 {padding-bottom: 20px;}
.pdg_b_30 {padding-bottom: 30px;}
.attentionTxt {
	color: #c20000;
	background: #fffabb;
	font-weight: bold;
}
.lineH15 {line-height: 1.5em;}
.pcimg100 {width: 100%;}


/*============================================
Smart Phone 設定
============================================*/
@media screen and (max-width:640px){
	body {
		font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Roboto", "メイリオ", "新ゴ Pro", "ＭＳ Ｐゴシック", sans-serif;
	}

	/*#mainContents img {
		width: 100%;
	}*/

	#header p{
		text-align: center;
	}

	#whiteBg {padding: 20px;}

	/* Navi */
		ul#navsp {
			padding-bottom: 20px;
		}

		ul#navsp li {
			margin-right: 0;
			margin-bottom: 10px;
		}

			ul#navsp img {vertical-align: middle; padding-right: 10px;}

		ul#navsp li a:link,
		ul#navsp li a:visited {
			padding-right: 0;
			text-decoration: none;
			color: #FFF;
			background-color: rgba(0,0,0,0.7);
			display: block;
			border-radius: 20px;        /* CSS3草案 */  
			-webkit-border-radius: 20px;    /* Safari,Google Chrome用 */  
			-moz-border-radius: 20px;   /* Firefox用 */  
		}

		ul#navsp li a:hover {
			background-color: rgba(255,0,0,0.7);
		}

	/* ランキング内容 */
	ul#ranking {
		padding-bottom: 0;
	}

		ul#ranking li {
			width: 100%;
			margin: 0;
			padding-bottom: 10px;
			display: inherit;
		}

		ul#ranking li img {width: 60%;height: auto;}

	ul#ranking2 {
		margin-bottom: 0;
		padding-top: 5px;
		padding-bottom: 5px;
		background: #d3971a;
		font-size: 0.9em;
	}

		ul#ranking2 li {
			padding: 2px 0 2px 5px;
			/*background: #d3971a;*/
			margin: 0;
			vertical-align: top;
			display: inherit;
		}

			ul#ranking2 li img {width: 20px; vertical-align: bottom;}

		ul#ranking2 li.kiri {background: #ffcc00; margin: 2px 5px 5px;}

	ul#ranking3 {
		padding-bottom: 0;
	}

		ul#ranking3 li {
			width: 100%;
			padding: 0;
			vertical-align:top;
			display: inherit;
			text-align: left;
			overflow: hidden;
		}

		ul#ranking3 li img {
			width: 25%;
			vertical-align: middle;
			padding-right: 10px;
		}


	/* 注意事項 */
	.attention {
		padding: 0 20px 20px;
	}

	/*　SPの時非表示　*/
	.spNone {display:inherit;}
	.pcNone {display: none;}

	.img100 {width: 100%;}
}