/* search css */
@charset "UTF-8";

/* contents
----------------------------------------------------------------------*/
.contents{
	max-width:1294px;
	padding:0 15px;
	display:-webkit-flex;
	display:flex;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
	margin-top:35px;
}
/* [PC]sideArea
----------------------------------------------------------------------*/
.sideArea{
	width:198px;
	-webkit-flex-basis:198px;
	flex-basis:198px;
	margin-right:5.2%;
}
/* allItem */
.allItem.btn{ margin-bottom:40px; }

.allItem.btn a{
	width:100%;
	height:66px;
	line-height:64px;
	font-weight:normal;
}
/* itemSearch */
#itemSearch{ margin-bottom:85px; }

#itemSearch .ttl{
	margin-top:30px;
	padding:0 0 12px 3px;
	font-weight:bold;
	font-size:13px;
	border-bottom:1px solid #ccc;
}
#itemSearch .allItem.btn + .ttl{ margin-top:55px; }

#itemSearch > ul{
	margin:8px 0 0;
	font-size:13px;
}
#itemSearch > ul > li{
	position:relative;
	margin-bottom:10px
}
#itemSearch > ul > li a{
	display:block;
	padding:9px 30px 9px 3px;
	line-height:1.3;
	text-decoration:none;
}
#itemSearch ul li a:hover{ background:#efefef; }
#itemSearch .subCategory a{ padding:5px 15px; }
#itemSearch > .category > li:hover > .subCategory{ display:block; }

#itemSearch > ul > li > a.select{
	margin-bottom:8px;
	background:#ddd url(../img/check_ico.png) no-repeat right 10px center;
}
#itemSearch > ul > li a.select{ font-weight:bold; }
#itemSearch .selectBox{ margin-top:10px; }

/* priceSearch */
#itemSearch .priceSearch{
	margin:15px 0 30px;
	color: #333;
}
#itemSearch .priceSearch form{
	display:-webkit-flex;
	display:flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
	-webkit-align-items: center;
	align-items: center;
}
#itemSearch .priceSearch .nstSlider{
	width:160px;
	height:24px;
	margin:0 auto;
	background:#fff;
}
#itemSearch .priceSearch .nstSlider:before{
	content:'';
	position:absolute;
	left:0;
	top:11px;
	display:block;
	width:160px;
	height:3px;
	background:#efefef;
}
#itemSearch .priceSearch .nstSlider .bar{
	background:#ccc;
	top:11px;
	height:3px;
}
#itemSearch .priceSearch .nstSlider .leftGrip,
#itemSearch .priceSearch .nstSlider .rightGrip{
	width:22px;
	height:22px;
	border-radius:50%;
	border:1px solid #ccc;
}
#itemSearch .priceSearch .min{
	width:125px;
	margin:20px 0 0 10px;
	border-bottom:1px solid #ccc;
	font-size:14px;
}
#itemSearch .priceSearch .max{
	margin:10px 0 0 10px;
	font-size:14px;
}
#itemSearch .priceSearch .min input,
#itemSearch .priceSearch .max input{
	width:90px;
	border:none;
	font-size:14px;
	margin-left:5px;
	vertical-align:0;
	color: #333;
}
#itemSearch .priceSearch input[type="submit"]{
	width:54px;
	height:24px;
	line-height:24px;
	padding:0 0 2px;
	margin:0px 0 0 auto;
	font-size:13px;
	background:#ccc;
	border:none;
	cursor:pointer;
	box-sizing:border-box;
}

/* main
----------------------------------------------------------------------*/
#main{ -webkit-flex:1; flex:1; overflow:hidden; }

/* pankuzu
----------------------------------------------- */
#pankuzu{ margin-top:0;}
/* condition
----------------------------------------------- */
#condition{
	display:flex;
	display:-webkit-flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-align-items: baseline;
	align-items: baseline;
	margin:10px 0 0;
}
/* itemCount */
#condition .itemCount{
	margin-right:10px;
	color: #333;
	font-size:30px;
	display: inline-block;
}
#condition .itemCount span{
	margin-left:8px;
	font-size:18px;
	font-weight:normal;
}
#condition .itemCondition{margin:0 0 0 35px;display: inline-block;}

#condition .itemConditionBox{display:block;width: 100%;}

#condition .itemCondition a{
font-size:15px;
font-weight:bold;
text-decoration:none;
background-image: url(/template/img/search_close.svg);
background-repeat: no-repeat;
background-position: right 3px;
background-size: 16px 16px;
padding-right: 23px;
margin-right: 20px;
}
#condition a:not(:last-child):after{
/* content: ""; */
padding:0 2px 0 4px;
}
#condition .itemCondition a:hover{ text-decoration:underline; }

/* tagArea*/
#condition.tagArea{
	-webkit-align-items: flex-start;
	align-items: flex-start;
	margin:15px 0 0;
}
#condition.tagArea .image { min-width: 131px; }
#condition.tagArea .image img{ width:100%; }

#condition.tagArea h1{
	width:100%;
	margin-top:25px;
	font-size:25px;
	font-weight:bold;
	max-width: calc(100% - 130px);
}
#condition.tagArea .itemCount{
	margin-top:15px;
	margin-left: auto;
}
#condition.tagArea .disp{
	margin-top:15px;
	width:100%;
	font-size:14px;
}
#condition.tagArea .itemCondition{ margin:30px 0 0 0; }

/* salesType
----------------------------------------------- */
#salesType{ margin-top:20px; }
#condition.tagArea + #salesType{ margin-top:30px; }

#salesType .typeSelect{
	position:relative;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	text-align: center;
}
#salesType .typeSelect:after{
	content:'';
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
}
#salesType .typeSelect li{
	position:relative;
	width:calc(100% / 3);
	height:47px;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	z-index:1;
}
*::-ms-backdrop, #salesType .typeSelect li{ width:33.33%; }

#salesType .typeSelect li a{
	display:block;
	height:46px;
	font-size:14px;
	background:#fff;
	color: #333;
	line-height:46px;
	text-decoration:none;
	border-bottom:1px solid #ccc;
}
#salesType .typeSelect li a:hover{ background:#efefef; }

#salesType .typeSelect li.select{
	border:1px solid #ccc;
}
#salesType .typeSelect li.select a{
	background:#fff;
	line-height:46px;
	border-bottom:1px solid #fff;
}
#salesType .typeSelect li:first-child.select { border-left:0; }
#salesType .typeSelect li:last-child.select { border-right:0; }

/* [PC]viewCondition
----------------------------------------------- */
#viewCondition{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	margin-top:40px;
	font-size:14px;
	color: #333;
}
/* selectView */
#viewCondition .selectView{
	position:relative;
}
#viewCondition .selectView:nth-child(1){	min-width:175px; }
#viewCondition .selectView:nth-child(2){	min-width:150px; }
#viewCondition .selectView:nth-child(3){	min-width:135px; }
#viewCondition .selectView:nth-child(4){	min-width:145px; }

#viewCondition .selectView p{
	padding:5px 45px 5px 0;
	cursor:pointer;
}
#viewCondition .selectView p:after{
	content: '';
	position: absolute;
	right: 15px;
	top: 12px;
	width: 0;
	border: 5px solid transparent;
	border-top: 9px solid #666;
	-webkit-transition: .3s;
	transition: .3s;
	-webkit-transform-origin: center top;
	transform-origin: center top;
}
#viewCondition .selectView.open p:after{
	-webkit-transform: translateY(10px) scale(1, -1);
	transform: translateY(10px) scale(1, -1);
}
#viewCondition .selectView ul{
	position: absolute;
	top: auto;
	min-width:100%;
	border:1px solid #ccc;
	background:#fff;
	z-index:1;
	opacity: 0;
	-webkit-transform-origin: top center;
	transform-origin: top center;
	-webkit-transition: .1s;
	transition: .1s;
}
#viewCondition .selectView.open ul{
	opacity: 1;
}
#viewCondition .selectView ul li a{
	display:block;
	max-height:0;
	padding:0 10px;
	text-decoration:none;
	overflow:hidden;
	opacity: 0;
}
#viewCondition .selectView.open ul li a{
	padding:5px 10px;
	max-height: 50px;
	opacity: 1;
	-webkit-transition:.3s;
	transition:.3s;
}
/*
#viewCondition .selectView ul li:nth-child(1) a{ -webkit-transition-delay:0s; transition-delay:0s; }
#viewCondition .selectView ul li:nth-child(2) a{ -webkit-ransition-delay:.1s; transition-delay:.1s; }
#viewCondition .selectView ul li:nth-child(3) a{ -webkit-ransition-delay:.2s; transition-delay:.2s; }
#viewCondition .selectView ul li:nth-child(4) a{ -webkit-ransition-delay:.3s; transition-delay:.3s; }
#viewCondition .selectView ul li:nth-child(5) a{ -webkit-ransition-delay:.4s; transition-delay:.4s; }
#viewCondition .selectView ul li:nth-child(6) a{ -webkit-ransition-delay:.5s; transition-delay:.5s; }
#viewCondition .selectView ul li:nth-child(7) a{ -webkit-ransition-delay:.6s; transition-delay:.6s; }
#viewCondition .selectView ul li:nth-child(8) a{ -webkit-ransition-delay:.7s; transition-delay:.7s; }
#viewCondition .selectView ul li:nth-child(9) a{ -webkit-ransition-delay:.8s; transition-delay:.8s; }
*/
#viewCondition .selectView ul li.select a{
	font-weight:bold;
	background:#ddd;
}
#viewCondition .selectView ul li:hover{
	-webkit-transition-delay:0s;
	transition-delay:0s;
	background:#efefef;
}
/* imageSize */
#viewCondition .imageSize ul{
	display: -webkit-flex;
	display: flex;
}
#viewCondition .imageSize ul li a{
	padding:5px;
	opacity:.3;
}
#viewCondition .imageSize ul li.select a{ opacity:1; }

/* pager
----------------------------------------------- */
#pager{ margin: 65px 9.5% 135px; }

/* recommend
----------------------------------------------------------------------*/
#recommend{
	border-top:1px solid #ccc;
	max-width:1064px;
	width:100%;
	margin:0 auto;
	padding:55px 0 0;
}
#recommend ul li{ margin-bottom:0; }

/* ranking */
@media all and (min-width: 641px) {
	#recommend .itemList li:nth-child( n+6 ){ display:none; }
}

/*--------------------------------------------------------------------
 sp
--------------------------------------------------------------------*/
@media all and (max-width: 640px) {
	#main{
		display:block;
		width:100%;
		margin:0 auto;
		-webkit-flex:unset;
		flex:unset;
		overflow:visible;
	}

/* contents
----------------------------------------------- */
.contents{
	margin-top:0;
	padding:0 25px;
}

/* condition
----------------------------------------------- */
	/* itemCount */
	#condition .itemCount{
		margin:0;
		font-size:18px;
	}
	#condition .itemCount span{ font-size:11px; }

	#condition .itemCondition{
		width:100%;
		margin:5px 0 0;
	}
	#condition .itemCondition a{
		font-size:11px;
		font-weight:normal;
		min-height: 16px;
		background-position: right 0;
		margin-right: 15px;
		display: inline-block;
	}
	/* tagArea */
	#condition.tagArea{ margin-top:0; }

	#condition.tagArea .image{
		margin:0 -25px;
		order:1;
		width: calc(100% + 50px);
	}
	#condition.tagArea h1{
		max-width:100%;
		margin-top:15px;
		font-size:16px;
		order:2;
	}
	#condition.tagArea .disp{
		margin:10px 0 0;
		font-size:11px;
		line-height:1.7;
		order:3;
	}
	#condition.tagArea .itemCount{
		margin:15px 0 0;
		order:4;
	}
	#condition.tagArea .itemCondition{
		order:5;
	}
/* salesType
----------------------------------------------- */
	#condition.tagArea + #salesType{ margin-top:20px; }
	#salesType .typeSelect li a{ font-size:11px; }
	#salesType .typeSelect li:last-child a{ color:#ff4d4d; }

/* [SP]sortArea
--------------------------------------------------------------------*/
	#sortArea{ margin-top:20px; }

	#sortArea .sortTab{
		position:relative;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		-webkit-box-pack: justify;
		justify-content: space-between;
		text-align:center;
		margin-bottom:10px;
		z-index:2;
	}
	#sortArea .sortTab:after{
		content:'';
		position:absolute;
		left:50%;
		top:0;
		width:1px;
		height:100%;
		border-left:1px solid #ccc;
		z-index:1;
	}
	#sortArea .sortTab li{
		width:50%;
		height:32px;
		line-height:32px;
		text-align:center;
	}
	#sortArea .sortTab li a{
		position:relative;
		display:block;
		height:100%;
		font-size:11px;
		text-decoration:none;
		z-index:1;
	}
	#sortArea .sortTab li a img{
		width:17px;
		margin-right:10px;
		vertical-align:middle;
	}
	#sortArea .sortTab li a:hover img{
		opacity:1;
	}
	/* sortBlock */
	#sortArea .sortBlock{
		position:absolute;
		width:100%;
		max-height:0;
		margin:0 -25px;
		padding:0 20px;
		font-size:11px;
		background:#fff;
		z-index:1;
		-webkit-box-sizing:border-box;
		box-sizing:border-box;
		-webkit-transform: translatez(0);
		-webkit-transform: translate3d(0,0,0);
		overflow:hidden;
		-webkit-transition: .5s;
		transition: .5s;
	}
	#sortArea .sortBlock.select{
		max-height:150%;
		padding:20px 20px 0;
		border-bottom:1px solid #ccc;
		z-index:2;
	}
	#sortArea .sortBlock:before{
		content:'';
		position:absolute;
		top:0;
		left:50%;
		width:calc(50% - 25px);
		height:1px;
		border-top:1px solid #ccc;
	}
	#sortArea .sortBlock .selectBox{
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		-webkit-box-pack: justify;
		justify-content: space-between;
		-webkit-align-items: center;
		align-items: center;
	}
	#sortArea .sortBlock .selectBox > *{
		width:50%;
	}
	#sortArea .sortBlock .selectBox.openNum select{
		font-size:14px;
		text-indent:65%;
		text-align:right;
	}
	#sortArea .sortBlock .selectBox > p{
		text-align:left;
		line-height:1;
		text-indent:10px;
	}
	#sortArea .sortBlock .selectBox select{
		padding:16px 25px 14px;
		border:none;
		text-align:right;
	}
	#sortArea .sortBlock .sortSelect ul{
		padding:10px 0 15px;
		display:flex;
		display:-webkit-flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#sortArea .sortBlock .sortSelect li{
		position:relative;
		width:50%;
		height:45px;
		margin:4px 0;
		padding:0 0 0 12px;
		line-height:45px;
		-webkit-box-sizing:border-box;
		box-sizing:border-box;
	}
	#sortArea .sortBlock .sortSelect li:nth-child(odd){ padding:0 12px 0 0; }

	#sortArea .sortBlock .sortSelect li:nth-child(odd):after{
		content:'';
		position:absolute;
		right:0;
		top:0;
		height:100%;
		width:0;
		border-left:1px solid #ccc;
	}
	#sortArea .sortBlock .sortSelect li label{
		display:block;
		height:100%;
		padding-left:10px;
	}
	#sortArea .sortBlock .sortSelect li input[type="radio"]{
		visibility:hidden;
		position:absolute;
	}
	#sortArea .sortBlock .sortSelect li input[type="radio"]:checked + label{ background:#ccc; }

	#sortArea .sortBlock .sortSelect li input[type="radio"]:checked + label:after{
		content:'';
		position:absolute;
		right:28px;
		top:18px;
		width:12px;
		height:6px;
		border-left:1px solid #6f6f6f;
		border-bottom:1px solid #6f6f6f;
		-webkit-transform:rotate(-50deg);
		transform:rotate(-50deg);
	}
	#sortArea .sortBlock .sortSelect li:nth-child(even) input[type="radio"]:checked + label:after{
		right:12px;
	}
	#sortArea .sortBlock .submitBtn{
		width:71.94%;
		margin:20px auto 40px;
	}
	#sortArea .sortBlock .submitBtn input{
		height:48px;
		line-height:46px;
		font-size:11px;
	}
	/* moreBlock */
	#sortArea .moreBlock{
		position:absolute;
		width:100%;
		max-height:0;
		margin:0 -25px;
		padding:0 25px;
		background:#fff;
		z-index:1;
		-webkit-box-sizing:border-box;
		box-sizing:border-box;
		-webkit-transform: translatez(0);
		-webkit-transform: translate3d(0,0,0);
		overflow:hidden;
		-webkit-transition: .5s;
		transition: .5s;
	}
	#sortArea .moreBlock.select{
		max-height:150%;
		padding:20px 25px 0;
		border-bottom:1px solid #ccc;
		z-index:2;
	}
	#sortArea .moreBlock:before{
		content:'';
		position:absolute;
		top:0;
		left:25px;
		width:calc(50% - 25px);
		height:1px;
		padding-right:1px;
		border-top:1px solid #ccc;
	}
	#sortArea .moreBlock .selectBox{
		margin-top:6px;
	}
	#sortArea .moreBlock .selectBox select{
		padding:16px 35px 14px 15px
	}
	#sortArea .moreBlock .submitBtn{
		width:71.94%;
		margin:20px auto 40px;
	}
	#sortArea .moreBlock .submitBtn input{
		height:47px;
		line-height:45px;
		font-size:11px;
	}
/* result
----------------------------------------------- */
	#result .itemList{ margin-top:20px; }

/* pager
----------------------------------------------- */
	#pager{ margin: 25px 0 10px; }

/* recommend
----------------------------------------------- */
	#recommend{
		max-width:100%;
		margin-top:55px;
	}
	#recommend ul li{ margin:25px 0 0; }
	#recommend ul li:nth-child(-n+3){ margin-top:0; }

}