@import "baseStyle.css";

/* ******************************************
 基本設定
****************************************** */

/* ページID設定 */
#swfsIdx {
	width: 900px;
	font-size: 100%;
	line-height: 100%;
	color: #875858;
	text-align: center;
	background: #ffffff;
}

#swfsIdx img {
	vertical-align: top;
}


/* ******************************************
 メインビジュアル・FLASH ブロック
****************************************** */

/* FLASH更新 */
#swfsIdx div#mvFlash {
	width: 874px;
	height: 363px;
	margin: 0px auto 15px auto;
	text-align: left;
}


/* ******************************************
 最新コンテンツバナー ブロック
****************************************** */

#swfsIdx div#newContentsBanner {
	width: 874px;
	margin: 0px auto 20px auto;
	text-align: left;
}


/* ******************************************
 コンテンツ大枠 ブロック
****************************************** */

#swfsIdx div#contentWrap {
	width: 900px;
	background: url(http://swfs.jp/img/img2/idx_bg_under_contents.gif) left top repeat-y;
}


/* ******************************************
 メインコンテンツ左枠 ブロック
****************************************** */

#swfsIdx div#mainWrap {
	float: left;
	display: inline;
	width: 645px;/* コンテンツ毎に幅指定 */
	margin-left: 13px;
	text-align: center;
}


/* ******************************************
 サブコンテンツ右枠 ブロック
****************************************** */

#swfsIdx div#subWrap {
	float: right;
	display: inline;
	width: 218px;/* コンテンツ毎に幅指定 */
	margin-right: 12px;
}

#swfsIdx div.sub-L {
	width: 218px;
}

#swfsIdx div.sub-M {
	width: 218px;
}

#swfsIdx div.sub-S {
	width: 210px;
	margin: 0px auto;
	text-align: center;
}

/* ****************************************************************************
 ▼▼▼　最新コンテンツバナー内　要素　▼▼▼
**************************************************************************** */

#swfsIdx div#newContentsBanner ul{
	margin:0 1px;
	padding:0;
}

#swfsIdx div#newContentsBanner ul li{
	margin:0;
	padding:4px;
	width: 210px;
	float:left;
}

#swfsIdx div#newContentsBanner ul li span.update{
	display:block;
	margin:0 auto;
	padding:0;
	font-size: 10px;
	color: #777777;
	text-align:left;
}



/* ****************************************************************************
 ▼▼▼　メインコンテンツ内　要素　▼▼▼
**************************************************************************** */


/* ******************************************
 ピックアップ
****************************************** */

#swfsIdx div.pick_up {
	width: 642px;
}

#swfsIdx div.pick_up h4 {
	width: 642px;
	margin: 0px;
}

#swfsIdx ul.pickupList {
	width:624px;
	margin-left:14px;
}

#swfsIdx li.category-L {
	float: left;
	width: 302px;
	margin: 9px 9px 8px 0px;
}

#swfsIdx div.category-M {
	width: 302px;
	margin: 0px;
	background: url(http://swfs.jp/img/img2/idx_bg_004.gif) left top no-repeat;
}


/* タイトル */
#swfsIdx div.category-M div.title {
	width: 302px;
	height: 32px;
	position: relative;
	margin-bottom: 5px;
}

#swfsIdx div.category-M div.title h5 {
	width: 302px;
	height: 32px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	background: #999999;
}

#swfsIdx div.category-M div.title p {
	display: block;
	width:90px;
	height: 32px;
	line-height: 34px;
	position: absolute;
	top: 0;
	right: 5px;
	text-align: left;
	text-indent: 13px;
	font-size: 10px;
	z-index: 2;
	overflow: hidden;
}

#swfsIdx div.category-M div.title p a {
	display: block;
	height: 32px;
	color: #777777;
	text-decoration: none;
	background: url(http://swfs.jp/img/img2/idx_ic_001.gif) 0px 11px no-repeat;
	float:right;
}

#swfsIdx div.category-M div.title p a:hover {
	text-decoration: underline;
}


/* インフォメーション */
#swfsIdx div.category-M div.info {
	width: 292px;
	margin: 0px auto;
}

#swfsIdx div.category-M div.info a {
	display: block;
	text-align: left;
	background: url(http://swfs.jp/img/img2/idx_bg_001.gif) left top no-repeat;
	text-decoration: none;
	height: 101px;
}

#swfsIdx div.category-M div.info a:hover {
	text-decoration: none;
	background: url(http://swfs.jp/img/img2/idx_bg_002.gif) left top no-repeat;
}

#swfsIdx div.category-M div.info a img {
	margin: 10px 15px 0px 10px;
	float: left;
}

#swfsIdx div.category-M div.info a span.detail {
	display: block;
	padding: 3px 0px 7px 0px;
	font-size: 10px;
	line-height: 1.2em;
	color: #806363;
}

#swfsIdx div.category-M div.info a:hover span.detail {
	color: #d53f3e;
}

#swfsIdx div.category-M div.info a span.bland {
	display: block;
	padding: 0px 0px 0px 0px;
	font-size: 12px;
	line-height: 1.2em;
	color: #424242;
	font-weight: bold;
}

#swfsIdx div.category-M div.info a span.item {
	display: block;
	padding: 0px 0px 2px 0px;
	font-size: 10px;
	line-height: 1.2em;
	color: #424242;
	font-weight: bold;
}

#swfsIdx div.category-M div.info a span.price {
	display: block;
	padding: 0px 0px 0px 0px;
	font-size: 10px;
	line-height: 1.2em;
	color: #d53f3e;
	font-weight: bold;
}


/* ******************************************
 スペシャルコンテンツ
****************************************** */

#swfsIdx div.sp-contens {
	width: 642px;
	margin: 20px 0px;
	text-align: center;
	overflow:hidden;
}

#swfsIdx div.sp-title {
	width: 642px;
	height: 25px;
}

#swfsIdx div.sp-bn-wrap01 {
	width: 640px;
	margin: 8px auto 6px auto;
}

#swfsIdx div.sp-bn-wrap02 {
	width: 645px;
	text-align: left;
}

#swfsIdx div.sp-bn-wrap02 li {
	width: 215px;
	display: inline;
	float: left;
	padding-bottom: 6px;
}

#swfsIdx div.sp-bn-wrap02 div.list_btn_special {
	float: right;
	margin-right:3px;
}


/* ******************************************
 ランキングエリア
****************************************** */

#swfsIdx div.ranking {
	width: 642px;
	margin: 0px 0px 20px 0px;
}

#swfsIdx div.hot-ranking {
	width: 642px;
	margin: 0px auto;
	text-align: left;
	background: url(http://swfs.jp/img/img2/idx_bg_003.gif) -4px 2px repeat-y;
}

#swfsIdx div.ranking-title {
	width: 642px;
	height: 25px;
}

#swfsIdx div.ranking-title2 {
	width: 642px;
	height: 20px;
	position: relative;
	margin:5px 0 0 0;
}

#swfsIdx div.ranking-title3 {
	width: 642px;
	position: relative;
	margin:0;
	background:#fff;
	padding:20px 0 0 0;
}

#swfsIdx div.hot-ranking ul {
	display: inline;
	width: 642px;
	margin-bottom:10px;
}

#swfsIdx div.hot-ranking li {
	display: inline;
	float: left;
	width: 128px;
	padding-top:7px;
	text-align:center;
}

#swfsIdx div.hot-ranking li a {
	display: block;
	margin: 0px 10px;
	text-decoration: none;
	text-align:left;
	font-size: 10px;
	line-height:12px;
	overflow:hidden;
}
#swfsIdx div.hot-ranking li a img {
	margin:0 0 5px 4px;
}

#swfsIdx div.hot-ranking li a span.rank_default {
	display: block;
	color: #f12aa1;
	font-weight: bold;
	text-align: left;
	width: 100px;
	min-height:25px;
	margin-bottom:2px;
}
* html body #swfsIdx div.hot-ranking li a span.rank_default {
	width: 100px;
	height:30px;
	oveflow:visible;
	margin-bottom:2px;
}

#swfsIdx div.hot-ranking li a span.rank1 {
	background: url(http://swfs.jp/img/img2/idx_ic_rank1.gif) left top no-repeat;
	padding:9px 0 0 24px;
}
#swfsIdx div.hot-ranking li a span.rank2 {
	background: url(http://swfs.jp/img/img2/idx_ic_rank2.gif) left 7px no-repeat;
	padding:9px 0 0 21px;
}

#swfsIdx div.hot-ranking li a span.rank3 {
	background: url(http://swfs.jp/img/img2/idx_ic_rank3.gif) left 7px no-repeat;
	padding:9px 0 0 21px;
}

#swfsIdx div.hot-ranking li a span.rank4 {
	display: block;
	background: url(http://swfs.jp/img/img2/idx_ic_rank4.gif) left 7px no-repeat;
	padding:9px 0 0 21px;
}

#swfsIdx div.hot-ranking li a span.rank5 {
	background: url(http://swfs.jp/img/img2/idx_ic_rank5.gif) left 7px no-repeat;
	padding:9px 0 0 21px;
}

#swfsIdx div.hot-ranking li a span.item {
	display: block;
	font-size: 10px;
	color: #5c5b5c;
	text-align: left;
}


/* ******************************************
 PickUpブランド
****************************************** */

#swfsIdx div.pic-brand {
	width: 642px;
	margin: 0px;
	text-align: center;
}

#swfsIdx div.pic-title {
	width: 642px;
	height: 25px;
	margin-bottom: 10px;
}

#swfsIdx div.pic-list {
	width: 642px;
	height: 250px;
	overflow:hidden;
}

#swfsIdx div.pic-list li {
	width: 107px;
	display: inline;
	float: left;
	padding-bottom: 30px;
}

#swfsIdx div.pic-list li a.item-link {
	display: block;
	margin: 0px auto 6px auto;
	width: 94px;
	height: 94px;
	background: url(http://swfs.jp/img/img2/idx_bg_005.gif) no-repeat;
}

#swfsIdx div.pic-list img.item {
	margin: 6px 0px 0px 0px;
}

#swfsIdx div.pic-list li a.item-link:hover {
	background: url(http://swfs.jp/img/img2/idx_bg_006.gif) no-repeat;
}

#swfsIdx div.pic-brand div.list_btn_brand {
	float: right;
	margin-right:3px;
}



/* ****************************************************************************
 ▼▼▼　サブコンテンツ内　要素　▼▼▼
**************************************************************************** */

#swfsIdx div.border_y {
	width: 218px;
	height:15px;
	background: url(http://swfs.jp/img/img2/idx_bg_dotline_x.gif) left top repeat-x;
}


/* ******************************************
 FEATURE
****************************************** */

#swfsIdx div.feature {
	width: 218px;
	margin: 0px auto;
}

#swfsIdx div.feature h4{
	width: 218px;
	height:25px;
	margin-bottom:8px;
}


/* ******************************************
 アイテムから探す
****************************************** */

#swfsIdx div.item-search {
	width: 218px;
	text-align: left;
	margin: 0px auto 2px auto;
	background: url(http://swfs.jp/img/img2/idx_bg_itembox02.gif) left bottom no-repeat;
}

#swfsIdx div.item-search ul.search_item_pickup {
	display:block;
	margin:0;
	padding:5px 0 10px 0;
	list-style:none;
	overflow:hidden;
	background: url(http://swfs.jp/img/img2/idx_bg_itembox01.gif) left top no-repeat;
}

#swfsIdx div.item-search ul.search_item_pickup li{
	display:block;
	margin:0;
	padding:1px 0 1px 5px;
	list-style:none;
	overflow:hidden;
	font-size:12px;
	line-height:14px;
	color:#6b6b6b;
	background: url(http://swfs.jp/img/img2/idx_bg_itembox03.gif) left top repeat-y;
}

#swfsIdx div.item-search ul.search_item_pickup li a{
	display:block;
	color:#6b6b6b;
	text-decoration:none;
	background: url(http://swfs.jp/img/img2/idx_ic_002.gif) 7px 6px no-repeat;
	padding:3px 5px 2px 20px;
}

#swfsIdx div.item-search ul.search_item_pickup li a:hover{
	color:#ff7f20;
	background: url(http://swfs.jp/img/img2/idx_ic_003.gif) 7px 6px no-repeat;
}

#swfsIdx div.sub-L div.list_btn_item {
	float: right;
	margin:0 3px 10px 0;
}


/* ******************************************
 バナーエリア
****************************************** */

#swfsIdx div.banner {
	width: 218px;
	margin: 0px auto 9px auto;
}

#swfsIdx div.banner li {
	width: 218px;
	background: #ffffff;
}