@charset "UTF-8";
/* ===================================================================
CSS information
 file name  :  side.css
 style info :  馬刺しの達人：サイドカラム
=================================================================== */

#side_coloumn {
	width: 200px;
	float: left;
}

/* -------------------------------
 キタガワ達人
------------------------------- */
#tatsujin_area {
	width: 200px;
	padding: 10px;
	background-color:#F6F3F3;
	box-sizing:border-box;
	margin-bottom: 20px;
}
#tatsujin_area p {
	text-align:center;
	margin-bottom: 10px;
}

/* -------------------------------
 バナーエリア
------------------------------- */
.side_bnr {
	width: 200px;
	margin-bottom: 20px;
}
.side_bnr ul li {
	margin-bottom: 10px;
}

/* -------------------------------
 検索
------------------------------- */
#search {
	width: 200px;
	padding: 10px;
	box-sizing:border-box;
	background-color: #f6f3f3;
	margin-bottom: 20px;
}
#search h2 {
	margin-bottom: 10px;
}
#search .search_box {
	width: 180px;
	height: 30px;
}
#search .search_box input.textBox {
	width: 120px;
	height: 30px;
	float: left;
	border: none;
	background: #fff url(https://secure1.future-shop.jp/~basashi/common/img/side/bg_search.png) 96% center no-repeat;
	padding: 0 24px 0 4px;
	font-size: 1.4rem;
	box-sizing:border-box;
}
#search .search_box input.submit_btn {
	width: 48px;
	height: 30px;
	float: right;
}
#search .search_box input.submit_btn:hover {
	filter:alpha(opacity=70);
	opacity:0.7;
        -moz-opacity: 0.7;
        -webkit-opacity: 0.7;
}

/* -------------------------------
 ご利用案内
------------------------------- */
#guide {
	width: 200px;
	box-sizing:border-box;
	border: #000 solid 2px;
	padding: 10px 10px 0px 10px;
	margin-bottom: 20px;
}
#guide h2 {
	width: 100%;
	text-align: center;
	margin-bottom: 10px;
}
#guide ul {
	width: 100%;
}
#guide ul li {
	width: 100%;
	border-top: #000 solid 2px;
	padding: 12px 0;
}

/* -------------------------------
 ランキング
------------------------------- */
#side_ranking {
	width: 200px;
	margin-bottom: 20px;
}
#side_ranking h2 {
	width: 200px;
	margin-bottom: 20px;
}
#side_ranking ul {
	width: 180px;
	margin: 0 auto 10px;
}
#side_ranking ul li {
	width: 180px;
	height: 70px;
	display: table;
	position: relative;	
	margin-bottom: 20px;
	border-bottom: #000000 solid 1px;
}
#side_ranking ul li p.rank_number {
	width: 20px;
	height: 20px;
	text-align: center;
	font-size: 1.2rem;
	font-weight:bold;
	line-height: 22px;
	border-radius: 50%;
	background: #c7c7c7;
	position: absolute;	
	top: -10px;
	left: -10px;
	z-index:10;
	color: #ffffff;
}
#side_ranking ul li:nth-of-type(1) p.rank_number {	background: #cabf11;}
#side_ranking ul li:nth-of-type(2) p.rank_number {	background: #6f7b83;}
#side_ranking ul li:nth-of-type(3) p.rank_number {	background: #a2531f;}
#side_ranking ul li p.rank_img {
	width: 70px;
	height: 70px;
	float: left;
	margin-bottom: 10px;
	margin-right: 10px;
}
#side_ranking ul li p.rank_img img {
	width: 100%;
	height: auto;
}
#side_ranking ul li p.rank_name {
	margin-left: 80px;
	height: 70px;
	width: 100px;
	display: table-cell;
	vertical-align:middle;
}
#side_ranking ul li p.rank_name span {
	font-size: 1.2rem;
	line-height: 1.8rem;
}
#side_ranking p.rank_link {
	font-size: 1.4rem;
	line-height: 16px;
	text-align: right;
	background:url(https://secure1.future-shop.jp/~basashi/common/img/ico/ico_blt01.png) right center no-repeat;
	padding-right: 12px;
}
#side_ranking li a span:hover {
	text-decoration: underline!important; 
}
#side_ranking li a img:hover {
	filter:alpha(opacity=70);
	opacity:0.7;
        -moz-opacity: 0.7;
        -webkit-opacity: 0.7;
}

/* -------------------------------
 特集企画、値段から選ぶ
------------------------------- */
.side_menu {
	width: 200px;
	box-sizing:border-box;
	border: #000 solid 2px;
	padding: 10px 10px 0px 10px;
	margin-bottom: 20px;
}
.side_menu h2 {
	width: 100%;
	text-align: center;
	margin: -12px -12px 0px;
}
.side_menu ul {
	width: 100%;
}
.side_menu ul li {
	width: 100%;
	border-bottom: #000 solid 2px;
	font-size: 1.4rem;
	line-height: 1.8rem;
	background:url(https://secure1.future-shop.jp/~basashi/common/img/ico/ico_blt01.png) 96% center no-repeat;
	padding-right: 12px;
	box-sizing:border-box;
}
.side_menu ul li:last-child {
	border: none;
}
.side_menu ul li a {
	width: 100%;
	padding: 12px 0;
	display: block;
}

/* -------------------------------
 種類から選ぶ
------------------------------- */
#side_part.side_menu h3 {
	width: 100%;
	text-align: center;
	margin: 0px -10px;
}
#side_part.side_menu ul {
	margin: 10px 0px;
}
#side_part.side_menu ul li {
	border: none;
	background:none;
	padding-right: 0px;
	box-sizing:border-box;
}
#side_part.side_menu ul li a {
	padding: 10px 0;
}