@charset "utf-8";

/*
============================================================
category/category.css
------------------------------------------------------------

■ancArea
■今月のおすすめ


作成日：2014.07.25
作成者：kikuchi
更新日：
更新者：
バージョン： 1.0
会社名：Dynamite Brothers Syndicate

============================================================
*/

/* ---------------------------------------------------------
■ancArea
--------------------------------------------------------- */
.ancArea {
	margin: 0 0 80px; }

.ancArea ul {
	overflow: hidden; 
	zoom: 1; }
	
.ancArea ul li {
	float: left;
	width: 194px;
	margin-bottom: 5px; }
	
.ancArea ul li a {
	padding-left: 10px;
	color: #555555;
	line-height: 19px;
	text-decoration: none;
	background:url(/images/common/icon_arrow.jpg) no-repeat 0 0; }
	
.ancArea ul li a:hover {
	color: #222222;
	text-decoration: underline;
	background-position: left -29px; }




/* ---------------------------------------------------------
■今月のおすすめ
--------------------------------------------------------- */
.midashi18Line {
	border: none; }

.recoMonth {
	margin-bottom: 40px;
	padding-bottom: 40px; }

.recoMonth .left {
	float: left;
	width: 280px;
	margin-right: -310px; }

.recoMonth .right {
	float: left;
	width: 81.6%; }

.recoMonth .right .textWrapper {
	margin-left: 310px; }

.recoMonth .right .textWrapper .text13 {
	line-height: 20px; }

a.more {
	overflow: hidden;
	display: block;
	width: 82px;
	height: 32px;
	text-indent: -99999px;
	background: url(/images/common/btn_viewmore.jpg) no-repeat; }

a.more:hover {
	background-position: 0 -38px; }

.itemName {
	margin-bottom: 6px;
	padding-bottom: 10px;
	background: url(/images/common/bg_grid_line.jpg) no-repeat left bottom; }

.fee span {
	font-size: 77%; }

.fee {
	overflow: hidden;
}
.fee .discount {
	margin-bottom: 4px;
}
.fee .discount span {
	display: inline-block;
	padding: 2px 5px 3px;
	border-radius: 5px;
	background-color: #e61212;
	color: #fff;
	line-height: 14px;
	height: 14px;
}
.fee .before {
	padding-top: 1px;
	margin-right: 10px;
	margin-bottom: 2px;
	font-size: 85%;
	color: #7B7B7B;
	float: left;
}
.fee .before em {
	/*text-decoration: line-through;*/
	display: inline-block;
	position: relative;
}
.fee .before em:after {
	content: " ";
	width: 100%;
	height: 1px;
	background-color: #7B7B7B;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -1px;
}
.fee .after {
	color: #e61212;
	float: left;
	font-weight: bold;
}



/* ---------------------------------------------------------
■一覧
--------------------------------------------------------- */
.contentsHead {
	padding-top: 15px;
	border-top: 1px dotted #dcdcdc; }

.contentsHead .midashi18Line {
	float: left;
	width: 50%; }

.contentsHead .midashi18Line span {
	font-size: 55%;
	font-weight: normal;
	vertical-align: middle; }

.contentsHead .midashi18Line .count {
	font-size: 160%;
	font-weight: bold;
	vertical-align: middle; }

#categoryitem {
	overflow: hidden;
	margin: 0 0 100px; }

#categoryitem .gridInner {
	overflow: hidden;
	margin-right: -10px;
	zoom: 1; }

#categoryitem .gridInner h3 {
	overflow: hidden;
	max-height: 60px;
	padding-bottom: 0;
	background: none; }

#categoryitem .gridInner .text {
	overflow: hidden;
	height: 30px; }

#categoryitem .gridInner,
.itemList .gridInner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
}

.itemList .gridInner li {
	height: auto;
	float: none;
}

#categoryitem li {
	/*overflow: hidden;*/
	width: 154px;
	/*height: 255px;*/
	margin-bottom: 30px;
	padding-right: 9px; }

.gridInner .fee {
	padding-top: 10px;
	background: url(/images/common/bg_grid_line.jpg) no-repeat; }

.toTop {
	text-align: right; }

.toTop a {
	padding-left: 10px;
	color: #555;
	font-size: 75%;
	line-height: 21px;
	background: url(/images/common/bg_triangle.jpg) no-repeat 0 center; }

#categoryBox .midashi18Line {
	padding-right: 430px; }

#categoryBox {
	position: relative; }

#categoryBox .search-area {
	margin-bottom: 20px;
	position: relative; }

#categoryBox .refine {
	padding: 10px 20px 10px;
	background-color: #f6f7f8;
	font-size: 94%;
	line-height: 31px;
	width: 650px;
	box-sizing: border-box;
	overflow: hidden; }

#categoryBox .refine h4 {
	font-size: 13px;
	line-height: 1.1;
	margin-bottom: 12px; }

#categoryBox .refine h4 span {
	display: inline-block;
	padding-bottom: 4px;
	border-bottom: 1px solid #ccc; }

#categoryBox .refine-price {
	padding-left: 17px;
	padding-right: 67px;
	border-left: 1px solid #ccc;
	float: right;
	font-size: 13px;
	vertical-align: text-bottom;
	position: relative; }

#categoryBox input[type=text] {
	-webkit-appearance: none;
	padding: 0 5px;
	height: 28px;
	width: 75px;
	font-size: 15px;
	border-radius: 0;
	border: 1px solid #ccc;
	background-color: #fff;
	box-sizing: border-box; }

#categoryBox .refine-price_range {
	margin-bottom: 12px;
	width: 182px;
	height: 4px;
	background-color: #fff; }

#categoryBox .noUi-horizontal {
	height: 4px; }

#categoryBox .noUi-connect {
	background-color: #afafaf; }

#categoryBox .noUi-handle {
	border: 1px solid #cdcdcd;
	width: 14px;
	height: 14px;
	border-radius: 7px;
	top: -5px;
	right: -7px;
	box-shadow: none; }

#categoryBox .noUi-handle:before,
#categoryBox .noUi-handle:after {
	display: none; }

#categoryBox .noUi-target {
	box-shadow: none;
	border: 0; }

#categoryBox .refine-price_btn {
	position: absolute;
	right: 0; }

#categoryBox .refine-price_btn.submit {
	bottom: 4px; }

#categoryBox .refine-price_btn.clear {
	bottom: 36px; }

#categoryBox .refine-price_btn a {
	display: block;
	width: 58px;
	height: 24px;
	line-height: 24px;
	text-align: center;
	color: #fff;
	cursor: pointer!important; }

#categoryBox .refine-price_btn a:hover {
	text-decoration: none; }

#categoryBox .refine-price_btn.submit a {
	border: 1px solid #222;
	background-color: #222;
	bottom: 4px; }

#categoryBox .refine-price_btn.clear a {
	border: 1px solid #ccc;
	background-color: #ccc;
	bottom: 36px; }

#categoryBox .refine-price_btn.submit a:hover {
	background-color: #fff;
	color: #222;
	bottom: 4px; }

#categoryBox .refine-price_btn.clear a:hover {
	background-color: #fff;
	color: #ccc;
	bottom: 36px; }

#categoryBox .refine-category {
	float: left; }

#categoryBox .refine ul {
	padding-top: 6px;
	overflow: hidden; }

#categoryBox .refine li {
	margin-right: 25px;
	float: left; }

#categoryBox .refine li:last-child {
	margin-right: 0; }

#categoryBox .refine li a {
	display: inline-block;
	padding-left: 24px;
	background: url(/images/category/icon_check01.png) 0 6px no-repeat; }

#categoryBox .refine li.checked a {
	background-image: url(/images/category/icon_check02.png); }

#categoryBox .sorts {
	border: 1px solid #ccc;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 190px;
	font-size: 94%;
	line-height: 31px; }

#categoryBox .sorts p {
	padding: 0 30px 0 12px;
	cursor: pointer;
	background: url(/images/category/icon_selector.png) 162px 10px no-repeat; }

#categoryBox .sorts ul {
	border: 1px solid #ccc;
	position: absolute;
	top: 100%;
	left: -1px;
	width: 100%;
	z-index: 1;
	background-color: #fff;
	display: none; }

#categoryBox .sorts li a {
	display: block;
	padding: 3px 12px; }

#categoryBox .sorts li a:hover {
	background-color: #ccc;
	text-decoration: none; }

#categoryBox .sorts li.cur a {
	background-color: #ccc; }

#categoryBox .sorts.open p {
	color: #ccc; }

@media print, screen and (max-width: 1100px) {
	#categoryBox .search-area {
		padding-bottom: 50px;
	}
}



/* ---------------------------------------------------------
■商品履歴
--------------------------------------------------------- */
#historyWrapper {
	padding: 0 0 55px; }

#history .gridInner {
	overflow: hidden;
	height: 111px;
	margin-right: -10px;
	zoom: 1; }

#historyfellowPrev,
#historyfellowNext {
    position: absolute;
    display: block;
    width: 40px;
    height: 40px;
    text-indent: -99999px; }

#historyfellowPrev {
    background: url(/images/common/btn_slide_prev.jpg) no-repeat; }

#historyfellowNext {
    background: url(/images/common/btn_slide_next.jpg) no-repeat; }

#historyfellowPrev:hover,
#historyfellowNext:hover {
    background-position: 0-60px; }