﻿/* 共通スタイルシートの読み込み */
@import url("common.css");
@import url("category.css");
@import url("item.css");
@import url("calendar.css");
@import url("info.css");
@import url("cart.css");
@import url("mail.css");
@import url("quest.css");
@import url("mess.css");

/**************目次****************/
/*■右カラムの設定
/*お知らせ*/
/*おすすめ商品*/
/*バナー*/
/*売れ筋ランキング*/



/*■右カラムの設定************************/
#rightcolumn {
	float: left;
	width: 600px;
	margin-left: 20px;
}
* html #rightcolumn {
	margin-right: -10px;
}
#rightcolumn a:hover img {
	opacity: 0.5; /* IE以外透過設定 */
	filter: Alpha(opacity=50); /* IE用透過設定 */
}

/*お知らせ*/
#news {
	background-image: url(../images/under.gif);
	background-repeat: no-repeat;
	background-position: bottom;
	width: 600px;
	padding-bottom: 5px;
}
#news h3 {
	height: 39px;
	width: 600px;
}
#news .area {
	background-image: url(../images/swirls.gif);
	background-repeat: no-repeat;
	background-color: #042133;
	background-position: right bottom;
	width: 595px;
	margin-left: 5px;
	color: #FFFFFF;
	line-height: 16px;
	height: 118px;
	overflow: hidden;
	margin-right: -5px;
}
#news .area .info {
	width: 535px;
	margin-left: 30px;
	margin-top: 5px;
	overflow: hidden;
	float: left;
}
* html #news .area .info {
	margin-left: 15px;
}
#news .area .info .date {
	text-align: left;
	width: 70px;
	float: left;
	display: block;
}
#news .area .info .text {
	width: 434px;
	float: left;
	margin-left: 24px;
	display: block;
}
/*おすすめ商品*/
#osusume {
	background-image: url(../images/under.gif);
	background-repeat: no-repeat;
	background-position: bottom;
	width: 600px;
	padding-bottom: 5px;
	margin-top: 20px;
	float: left;
}
#osusume h3 {
	height: 45px;
}

#osusume .area {
	background-image: url(../images/swirls.gif);
	background-repeat: no-repeat;
	background-color: #042133;
	background-position: right bottom;
	padding-bottom: 20px;
	float: left;
	width: 595px;
	margin-left: 5px;
}
* html #osusume .area {
	width: 594px;
	margin-left: 3px;
}
#osusume .area .photo {
	background-color: #FFFFFF;
	height: 130px;
	width: 130px;
	margin-left: 30px;
	float: left;
}
* html #osusume .area .photo {
	margin-left: 15px;
}

#osusume .area .shousai {
	width: 400px;
	margin-left: 15px;
	float: left;
}
#osusume .area .name {
	width: 396px;
	font-size: 18px;
	font-weight: bold;
	color: #f8b551;
	line-height: 20px;
}
#osusume .area .shousai .name a {
	color: #f8b551;
}
#osusume .area .shousai .setsumei {
	color: #FFFFFF;
	margin-top: 10px;
}
/*バナー*/
#banner {
	width: 600px;
	margin-top: 20px;
	float: left;
}
#banner .banner01 {
	float: left;
	height: 157px;
	width: 295px;
	margin-bottom: 10px;
	clear: left;
}
#banner .image {
	height: 130px;
	width: 295px;
}
#banner .button {
	float: right;
	margin-top: 5px;
}
#banner .banner02 {
	float: left;
	height: 157px;
	width: 295px;
	margin-left: 10px;
	margin-bottom: 10px;
}
/*売れ筋ランキング*/
#ranking {
	background-image: url(../images/under.gif);
	background-repeat: no-repeat;
	background-position: bottom;
	width: 600px;
	padding-bottom: 5px;
	margin-top: 20px;
	float: left!important;
	float:none;
}

#ranking h3 {
	height: 40px;
}
#ranking .area {
	background-color: #042133;
	background-image: url(../images/swirls.gif);
	background-repeat: no-repeat;
	background-position: right bottom;
	padding-bottom: 20px;
	float: left;
	width: 595px;
	margin-left: 5px;
}
* html #ranking .area {
	margin-left: 3px;
}
#ranking .area h4 a {
	font-size: 10px;
	color: #FFFFFF;
	display: block;
	width: 80px;
	margin-left: 30px;
	line-height: 12px;
	text-decoration: none;
	text-align: left;
}
#ranking .area img {
	height: 80px;
	width: 80px;
	margin-top: 15px;
	margin-left: 30px;
}
#ranking .area .rank01 {
	background-image: url(../images/ranking01_bg.gif);
	background-repeat: no-repeat;
	background-position: left top;
	width: 119px;
	float: left;
}
#ranking .area .rank02 {
	background-image: url(../images/ranking02_bg.gif);
	background-repeat: no-repeat;
	background-position: left top;
	width: 119px;
	float: left;
}
#ranking .area .rank03 {
	background-image: url(../images/ranking03_bg.gif);
	background-repeat: no-repeat;
	background-position: left top;
	width: 119px;
	float: left;
}
#ranking .area .rank04 {
	background-image: url(../images/ranking04_bg.gif);
	background-repeat: no-repeat;
	background-position: left top;
	width: 119px;
	float: left;
}
#ranking .area .rank05 {
	background-image: url(../images/ranking05_bg.gif);
	background-repeat: no-repeat;
	background-position: left top;
	width: 119px;
	float: left;
}
