@charset "UTF-8";

/*******************************
  サイト共通の設定
*******************************/

/* ヘッダ～ナビゲーション*/

#header {
	margin-bottom: 10px;
	text-align: center;
}

#description {
	padding: 2px 5px;
	font-size: 10px;
	line-height: 12px;
	text-align: left;
}

#news {
	margin-bottom: 20px;
	padding: 0 5px;
}

#banner {
	margin-bottom: 20px;
	text-align: center;
}

#gnav {
	margin-bottom: 20px;
}

#mainMenu {
	/*display: -webkit-box;
	display: -moz-box;
	display: box;*/
	margin-bottom: 10px;
	padding: 0 3px;
}

#mainMenu:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

#mainMenu li {
	width: 20%;
	float: left;
}

#mainMenu a {
	display: block;
	height: 38px;
	margin: 0 2px;
	padding: 0 5px;
	border-radius: 4px;
	text-align: center;
	line-height: 38px;
}

#subMenu {
	padding: 0 5px;
}

/* コンテンツ */

.toNewPage {
	padding: 0 5px;
	text-align: center;
}

.toNewPage span {
	width: 60%;
	display: inline-block;
	padding: 2px 8px 2px 18px;
	border: 1px solid #999;
	border-radius: 4px;
	background: 8px 50% no-repeat;
	-webkit-box-shadow: 0 4px 4px #eee, inset 0 -4px 4px #ccc;
	box-shadow: 0 4px 4px #eee, inset 0 -4px 4px #ccc;
	text-shadow: 0 1px 1px #fff;
}

#toTopPage {
	padding: 0 5px;
	text-align: center;
}

#toTopPage span {
	width: 60%;
	display: inline-block;
	padding: 2px 8px 2px 18px;
	border: 1px solid #999;
	border-radius: 4px;
	background: 8px 50% no-repeat;
	-webkit-box-shadow: 0 4px 4px #eee, inset 0 -4px 4px #ccc;
	box-shadow: 0 4px 4px #eee, inset 0 -4px 4px #ccc;
	text-shadow: 0 1px 1px #fff;
}

#search ul {
	margin-bottom: 10px;
}

#search input[type=text] {
	display: inline-block;
	width: 251px;
	height: 21px;
	margin-right: 5px;
	border-radius: 4px;
	padding: 1px;
	border: 1px solid #999;
	font-size: 12px;
	line-height: 21px;
	-webkit-box-shadow: inset 2px 2px 2px #eee;
	box-shadow: inset 2px 2px 2px #eee;
}

#search input[type=submit] {
	display: inline-block;
	width: 50px;
	height: 25px;
	border-radius: 12px;
	border: 1px solid #999;
	text-align: center;
	font-size: 12px;
	line-height: 23px;
	-webkit-box-shadow: 0 4px 4px #eee;
	box-shadow: 0 4px 4px #eee;
}

#ranking ol {
	margin: 0 -5px 10px;
}

#ranking ol>li,
#media>ul>li,
#new>ul>li {
	border-bottom: 1px solid;
}

#ranking li:last-of-type,
#media li:last-of-type,
#new li:last-of-type {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
	/*border-bottom-style: none !important;*/
}

#ranking ol a,
#media a,
#new a {
	display: block;
	padding: 5px 30px 5px 5px;
	background: 100% 50% no-repeat;
}

#ranking ol a:after,
#media a:after,
#new a:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

#ranking .rank {
	width: 40px;
	float: left;
	line-height: 80px;
}

#ranking .image,
#media .image,
#new .image {
	width: 80px;
	float: left;
}

#ranking ol ul {
	margin-left: 125px;
	padding-top: 25px;
}

#ranking li li,
#media li li,
#new li li {
	margin-bottom: 5px;
}

#ranking .rank span {
	font-size: 16px;
}

#ranking .price {
	font-size: 14px;
}

#ranking .more {
	padding-right: 5px;
	text-align: right;
}

#ranking .more span {
	padding-left: 10px;
	background: 0 50% no-repeat;
}

#media>ul,
#new>ul {
	margin: 0 -5px;
}

#media ul .image+ul,
#new ul .image+ul {
	margin-left: 85px;
}

#media .name,
#new .name {
	margin-bottom: 2px;
	color: #39f;
	text-shadow: 0 1px 1px #fff;
}

#media .text,
#new .text {
	margin-bottom: 2px;
	line-height: 18px;
}

#feature li {
	margin-bottom: 5px;
	text-align: center;
}

#feature li:last-of-type {
	margin-bottom: 0;
}

#keyword p {
	margin-bottom: 5px;
}

#keyword li {
	margin-bottom: 5px;
	counter-increment: kw;
}

#keyword li:last-of-type {
	margin-bottom: 0;
}

#keyword li:before {
	content: '[' counter(kw) '] ';
}

/*******************************
  サイトごとの設定
  色、背景画像などの設定はここで
*******************************/

body.site01 #header {
}

body.site01 #description {
	background-color: #FF6699;
	color: #fff;
}

body.site01 #mainMenu a {
	border: 1px solid #999;
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#fc9));
	background-image: -webkit-linear-gradient(top, #fff, #fc9);
	background-image: -moz-linear-gradient(top, #fff, #fc9);
	background-image: -ms-linear-gradient(top, #fff, #fc9);
	background-image: -o-linear-gradient(top, #fff, #fc9);
	background-image: linear-gradient(top, #fff, #fc9);
	-webkit-box-shadow: 0 4px 4px #eee;
	box-shadow: 0 4px 4px #eee;
	text-shadow: 0 1px 1px #fff;
}

body.site01 #search input[type=submit] {
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f69), to(#f05));
	background-image: -webkit-linear-gradient(top, #f69, #f05);
	background-image: -moz-linear-gradient(top, #f69, #f05);
	background-image: -ms-linear-gradient(top, #f69, #f05);
	background-image: -o-linear-gradient(top, #f69, #f05);
	background-image: linear-gradient(top, #f69, #f05);
	color: #fff;
}

body.site01 #ranking ol>li,
body.site01 #media>ul>li,
body.site01 #new>ul>li {
	border-bottom-color: #ccc;
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#eee));
	background-image: -webkit-linear-gradient(top, #fff, #eee);
	background-image: -moz-linear-gradient(top, #fff, #eee);
	background-image: -ms-linear-gradient(top, #fff, #eee);
	background-image: -o-linear-gradient(top, #fff, #eee);
	background-image: linear-gradient(top, #fff, #eee);
}

body.site01 #ranking ol a,
body.site01 #media a,
body.site01 #new a {
	background-image: url(../../common/img/mk-02.png);
}

body.site01 #ranking .rank span {
	color: #f00;
}

body.site01 #ranking .price {
	color: #f00;
}

body.site01 #ranking .more span {
	background-image: url(../../common/img/mk-01.png);
}

body.site01 #keyword li:before {
	color: #f69;
}