@charset "utf-8";


/* contents */
/*----------------------------------------------*/

.contBox.tbl{
	display: table;
}
#contents .proBox .contBox:last-child{
	margin-bottom: 20px;
}
@media only screen and (max-width: 768px){
	.contBox.tbl{
		margin-top: 10px;
	}
	.contBox.tbl:first-of-type{
		margin-top: 0;
	}
}

.proBox.fR{
	width	: 395px;
	cursor : pointer;
	box-sizing: border-box;
	position: relative;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-color: #ccc;
	border-bottom-color: #ccc;
	float: none;
	padding: 15px;
	display: table-cell;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #CCC;
	vertical-align: top;
}
.proBox.fL{
	width	: 395px;
	cursor : pointer;
	box-sizing: border-box;
	position: relative;
	float: none;
	padding: 15px;
	display: table-cell;
	border: 1px solid #CCC;
	vertical-align: top;
}
@media only screen and (max-width: 768px){
	.proBox{
		margin-top: 10px;
	}
	.proBox:first-of-type{
		margin-top: 0;
	}
	.proBox.fR{
		width: 100%;
		display: block;
		border: 1px solid #CCC;
	}
	.proBox.fL{
		width: 100%;
		display: block;
	}
}
.proBox.defaultPointer{
	cursor : default;
}
.proBox a{
	display: block;
	padding: 15px;
}
/* title */
/*----------------------------------------------*/
.proBox .title{
	padding-top: 25px;
	width: 200px;
	float: right;
}
@media only screen and (max-width: 768px){
	.proBox .title{
		padding-top: 15px;
		float: none;
		width: 100%;
	}
}
.proBox .title p{
	font-size	: 11px;
	color: #333333;
}
#contents .proBox .title h2{
	font-size	: 18px;
	border-bottom-style: none;
	margin-bottom: 0px;
	line-height: 100%;
	padding-bottom: 5px;
	color: #74B018;
	font-weight: bold;
}
.proBox.new .title{
	background-image	:	url("/images/view/products/newRibbon.png");
	background-repeat	:	no-repeat;
	background-position	:	right top;
	padding	:	10px 0px 10px 0px;
}
.proBox.ninki .title{
	background-image	:	url("/images/view/products/ninkiRibbon.png");
	background-repeat	:	no-repeat;
	background-position	:	right top;
	padding	:	10px 0px 10px 0px;
}

/* detail */
/*----------------------------------------------*/

.proBox .detail{
}
.proBox .detail .photo{
	width	: 160px;
	overflow	: hidden;
	text-align: center;
	padding-top: 10px;
	height: 160px;
}
@media only screen and (max-width: 768px){
	.proBox .detail .photo{
		float: none;
		width: 100%;
	}
}

.mdS{
	line-height: 140%;
	font-weight: bold;
	margin-bottom: 5px;
}
.proBox .detail .photo img{
	max-width	: 100%;
}
.proBox .detail .priceArea{
	width	: 100%;
	margin-top: 10px;
	padding-top: 10px;
	border-top-width: 1px;
	border-top-style: dotted;
	border-top-color: #CCC;
}
.proBox .detail .priceArea .aicon{
	margin	:	0px 0px 0px 0px;
}
.proBox .detail .priceArea .aicon li{
	float	: left;
	padding-top: 0px;
	padding-right: 3px;
	padding-bottom: 3px;
	padding-left: 0px;
}
@media only screen and (max-width: 768px){
	.proBox .detail .priceArea .aicon li{
		width: 32.5%;
		margin-right: 1.25%;
		padding-right: 0;
		box-sizing: border-box;
	}
	.proBox .detail .priceArea .aicon li:nth-child(3n){
		margin-right: 0;
	}
}
.proBox .detail .priceArea .aicon li img{
	height : 60px;
	background-color: #FAFAFA;
}

.proBox .detail .price{
	margin-top: 10px;
	font-size: 10px;
	text-align: center;
	width: 100%;
	background-color: #F0F0F0;
	border: 1px dotted #E6E6E6;
	box-sizing: border-box;
	padding-top: 5px;
	padding-bottom: 5px;
	line-height: 150%;
}
.proBox .detail .price .fs25{
	font-size	: 18px;
}
.proBox .detail .priceArea .moreBtn a{
	display	:	none;
	background-image	:	url("/images/view/products/moreBtn_on.png");
	background-repeat	:	no-repeat;
	background-position	:	left top;
}
.proBox .detail .priceArea .moreBtn a img{
	width	:	150px;
}
.proBox .detail .priceArea .moreBtn a:hover img{
	visibility	:	hidden;
}


/* caption */
/*----------------------------------------------*/
.proBox .caption{
	margin-right: 0px;
/*	margin-bottom: 10px;*/
	margin-left: 0px;
	padding: 0px;
}

.proBox .caption p{
	margin-bottom: 10px;
}

/* 20190624追加 */
#contents .caption h1{
	padding-top: 20px;
	line-height: 160%;
	font-weight: bold;
	color: #455E1E;
	font-size: 24px;
}

#contents .caption h2{
	padding-top: 20px;
	font-size: 18px;
	border-bottom: none;
	padding-bottom: 0;
}
#contents .caption h3{
	padding-top: 20px;
	padding-bottom: 20px;
	font-size: 16px;
	font-weight: bold;
	line-height: 160%;
	color: #455E1E;
}
#contents .caption h4{
	padding-top: 15px;
	padding-bottom: 15px;
	font-weight: bold;
	line-height: 160%;
	color: #455E1E;
	font-size: 14px;
}
@media only screen and (max-width: 768px){
	#contents .caption h2{
		padding-top: 10px;
	}
}


/* spec */
/*----------------------------------------------*/
.cpuBlock{
	width:100%;
}
@media only screen and (max-width: 768px){
	.cpuBlock{
		margin-top: 10px;
	}
}

.cpu{
	width:100%;
}
.cpu li{
	float: left;
	margin-right:5px;
}
.cpu li img{
	height: 50px;
	width: auto;
	vertical-align: bottom;	
}


.proBox .spec h3{
	padding	:	0px 0px 0px 5px;
	border-left	:	2px solid #000;
	font-size	:	12px;
}

.proBox ul.spec{
	width: 100%;
	margin	:	10px 0px 0px 0px;
}
.proBox ul.spec li{
	width: 45px;
	padding	:	1px;
	text-align: center;
	float: left;
	font-size	:	9px;
	color: #FFF;
}
.proBox .spec ul li span{
	display	:	block;
}
.proBox ul.spec li img{
	width: 100%;
}

.redIco{
	background-color: #bf264a;
}
.orengeIco{
	background-color: #eb912c;
}
.orangeIco{
	background-color: #eb912c;
}
.blueIco{
	background-color: #2587ba;
}
.greenIco{
	background-color: #68ab43;
}
.purpleIco{
	background-color: #bb349b;
}
.pinkIco{
	background-color: #e64c4f;
}


ul.speci{
	width: 100%;
	margin-top: 5px;
}

ul.speci li{
	width: 87px;
	float: left;
	padding-top: 1px;
	padding-bottom: 1px;
}
ul.speci li span{
	width: 100%;
	font-size: 8px;
	color: #FFF;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 3px;
	float: left;
	line-height: 100%;
}

.proList h3.title{
	font-size	: 18px;
	font-weight	: bold;
	color	: #000000;
	line-height: 100%;
	background-color: #F3F3F3;
	margin-bottom: 10px;
	padding-top: 12px;
	padding-bottom: 12px;
	border-top-width: 3px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #333;
	border-bottom-color: #EBEBEB;
	margin-right: 0px;
	margin-left: 0px;
	margin-top: 30px;
	padding-left: 12px;
}
#main h3:first-of-type {
	margin-top: 0px;
}
.mr20{
	margin-right : 20px;
}
.clear {
	font-size: 0px;
	line-height: 0px;
	margin: 0px;
	padding: 0px;
	clear: both;
	height: 0px;
}

/*appealIcon*/

#appealIcon{
	position: absolute;
	top: 3px;
	z-index: 1;
	right: -8px;
}
#appealIcon img{
	width: 110px;
}