@charset "utf-8";
/* CSS Document */

/*===============================================
●共通
===============================================*/
#roadnavSelect ul li {padding-left: 0.2em!important;}

/* 商品一覧用タイトル */
.itemTitle {
	width: 100%;
	max-width: 960px;
	padding: 0 10px;
	margin: 0 auto;
	letter-spacing: 0;
}
.itemTit03 {
	color: #0052a4;
	text-align: center;
	padding-bottom: 0.2em;
	border-bottom: #0052a4 1px solid;
	/* font-family: "ゴシックMB101 DB"; */
	font-weight: 700;
}
.tit03Sub {
	color: #0052a4;
	text-align: center;
	/* font-family: "ゴシックMB101 DB"; */
	font-weight: 600;
}
.tit03Catch {text-align: center;}
.itemlistBackground {width: 100%;}

/* アイテム検索
---------------------------------------- */
#frmItemSearch h3 {
		font-size: 1.12em;
		color: #0052a4;
		font-weight: bold;
		margin-bottom: 0.5em;
	}
.searchPagerBox {border-bottom: #ccc 1px solid;}

/*カテゴリ内 or 全体*/
.targetArea input[type="radio"] {
	display:inline;
	padding-right: 1em;
}

/*アイテム検索ボックス*/
.itemSearchArea {
	display: flex;
	text-align: left;
	justify-content: space-between;
	margin-bottom: 1em;
	background-color: #eef2f5;
}
.itemSearchArea input {
	width: 85%;
	padding: 0.2em;
	border: none;
	border-radius: 0;
	font-size: 14px;
	background-color: #eef2f5;
}
.itemSearchArea button {
	width: 14%;
	text-align: center;
	border: none;
	background-color: #eef2f5;
}

/*表示件数、並び順*/
.sortArea select {
	height: 2em;
	padding: 0 0.3em;
	vertical-align: baseline;
}
.sortArea th {padding-right: 0.5em}

/* ページャー */
.searchNumber .number {display: none;}
.searchNumber ul li {
	display: inline-block;
	font-size: 1.15em;
	font-weight: bold;
}
.searchNumber ul li.currentpage {
	color:#F08300!important;
	padding: 0 0.4em;
}
.searchNumber ul li.disabled {
	color:#aaa!important;
	padding: 0 0.4em;
}
.searchNumber ul li a {
	display: block;
	padding: 0 0.4em;
	text-decoration: none;
}
.searchNumber ul li a:hover {
	color:#0e53a3!important;
}

/* 下層カテゴリのリスト */
.categoryButtonList li {
	display: inline-block;
	margin: 0 0.3em 0.6em;
}
.categoryButtonList li a {
	display: block;
	color: #fff;
	font-weight: bold;
	text-decoration:none;
	padding: 0.5em 1em;
	background-color: #2fa9dc;
}
.categoryButtonList li a svg {
	width: 9px;
	height: 15px;
	fill: #fff;
	margin-right: 0.5em;
	vertical-align: middle;
}
.categoryButtonList li a:hover {
	opacity: 0.8;
}

/* 商品一覧 */
.itemDetail {
	display:flex;
	flex-wrap:wrap;
	align-items: flex-start;
	width:100%;
	margin-bottom: 2em;
}
.itemSection a {text-decoration: none;}
.itemPhoto {
	margin-bottom: 0.5em;
	background-color: #FFFFFF;
}
.itemPhoto:hover {opacity:0.8;}
.itemPhoto span {
	display: block;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}
.itemPhoto span.noimage {background-image:url(../../img/common/logo.png);}
.itemPhoto span:after {
	content: "";
	display: block;
	width: 100%;
	padding-top: 66.7%;
}
.itemSection h4 {
	font-weight: bold;
	color:#0553a5;
}
.itemSection h4:hover{opacity:0.8;}
.itemPrice {
	font-weight: bold;
	color:#e60012;
	text-align: right;
}
.openPrice {
	margin-bottom: 0.3em;
}
p#openPriceText {
	text-align: right;
	font-size: 0.9em;
}

/* 特集バナー
---------------------------------------- */
.flex {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.flex a {text-decoration: none;}
.flex article div {margin-bottom: 1em;}
.flex article a {text-decoration: none;}
.flex article h4 {
	font-size: 1.3em;
	font-weight: bold;
	line-height: 1.2em;
	color: #0052a4;
	margin-bottom: 0.5em;
}

/* 一覧用共通タグ
---------------------------------------- */
.detailText {
	font-size: 1.2em;
	text-align: center;
	line-height: 1.7em;
}
.marginText {margin-bottom:1em;}
.partsImg {
	width: 40%;
	height: 40%;
}
/*===============================================
●画面の横幅が729px以下
===============================================*/
@media screen and (max-width: 729px){

	#roadnavSelect {display: none;}
	.itemTit03 {
		font-size: 1.55em;
		margin: 1em 0 0.35em;
		padding-bottom: 0.45em;
		line-height: 1.5em;
	}
	.tit03Sub {
		font-size:1.05em;
		margin-bottom:0.5em;
	}
	.tit03Catch {
		margin-bottom: 1.2em;
		font-size:0.85em;
	}
	.itemlistBackground {
		padding: 1.07em 0;
		margin-bottom: 3em;

	}

	/* アイテム検索
	---------------------------------------- */

	/*カテゴリ内 or 全体*/
	.targetArea { margin-bottom: 2em;}
	.targetArea input#TargetAll { margin-left: 2em;}
	.targetArea div {
		text-align: center;
		margin-bottom: 2em;
	}

	/* 商品・型番検索窓 */
	.itemSearchArea {
		width: 100%;
		align-content: center;
		flex-direction: row-reverse;
		margin: 0 0 0 0;
	}
	.itemSearchArea button {
		line-height: 1.5em;
		padding: 0.35em 0.7em;
	}
	.sortArea {margin-bottom: 2em;}
	#frmItemSearch h3 {text-align: center;}

	/* 表示順 */
	.searchPagerBox { margin-bottom: 0.5em;}
	.searchNumber ul {
		width: auto;
		text-align: center;
		margin-bottom: 0.5em;
	}
	.searchNumber ui li { margin-right: 0.32em;}
	.sortArea td.displayNumber { padding-right: 1em;}
	.searchPagerBoxBottom .searchNumber {
		padding-top: 0.5em;
		border-top: #ccc 1px solid;
	}

	/* 下層カテゴリのリスト */
	.categoryButtonList {margin-bottom: 1em;}
	.categoryButtonList ul {
		width: auto;
		text-align: center;
	}

	/* 商品一覧 */
	.itemSection {
		width:47.25%;
		margin-right:5.5%;
		margin-bottom: 2em;
	}
	.itemSection:nth-child(2n){margin-right: 0;}
	.itemSection:nth-last-child(-n+2){margin-bottom:0;}
}

/*===============================================
●画面の横幅が730px以上
===============================================*/
@media screen and (min-width: 768px) {

	/* roadnavSelect
	---------------------------------------- */
	#roadnav {display: none;}
	#roadnavSelect {
		width: 100%;
		max-width: 960px;
		padding: 1.5em 10px 1em;
		margin: 0 auto;
	}
	#roadnavSelect ul {font-size:0.85em;}
	#roadnavSelect ul li {display:inline-block;}
	#roadnavSelect ul li a {text-decoration: none;}

	.itemTit03 {
		font-size: 2em;
		line-height: 2em;
		margin-bottom: 0.5em;
	}
	.tit03Sub {
		font-size:1.15em;
		margin-bottom:1em;
	}
	.tit03Catch {
		margin-bottom: 1.2em;
		line-height: 1.8em;
	}

	.itemlistBackground {
		padding: 1.5em 0;
		margin-bottom: 4em;
	}

	/* 表示順 */
	.searchPagerBox {
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
		padding-bottom: 1em;
		margin-bottom: 1.5em;
	}
	#frmItemSearch {
		width: 60%;
		font-size:1.14em;
	}
	/*カテゴリ内 or 全体*/
	.targetArea {
		display: flex;
		align-items: center;
}


	.targetArea { margin-bottom: 2em;}
	.targetArea input#TargetAll {
		margin-left: 2em;
	}

	/* 商品・型番検索窓 */
	.itemSearchArea {
		width: 50%;
		align-content: center;
		flex-direction: row-reverse;
		margin: 0 0 0 2em;
		-webkit-appearance:none;
	}
	.itemSearchArea button {
		line-height: 1.5em;
		padding: 0.35em 0.7em;
	}
	.searchNumber {
		width: 40%;
		text-align: right;
	}
	.sortArea td.displayNumber {
		padding-right: 2.0em
	}
	.searchPagerBoxBottom .searchNumber {
		width: 100%;
		padding-top: 1em;
		border-top: #ccc 1px solid;
	}

	/* 下層カテゴリのリスト */
	.categoryButtonList {
		margin-bottom: 1.42em;
	}
	.categoryButtonList li a {font-size: 1.2em;}
	.categoryButtonList a.categoryButton {
		height: 25px;
		width: 160px;
		font-size:1.28em;
		margin-right: 2em;
		line-height: 25px;
	}
	.catList{
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}

	/* 商品一覧 */
	.itemSection {
		width:30%;
		margin-right:5%;
		margin-bottom: 4em;
	}
	.itemSection:nth-child(3n){margin-right: 0;}
	.itemSection:nth-last-child(-n+3){margin-bottom:0;}
}