@charset "utf-8";
/* CSS Document */


/*------------------------------------------------------------------------------
PC及びSPのFeatur & Hot用スタイル
------------------------------------------------------------------------------*/
ul.feature_hot{
	margin:0;
	overflow:visible;
	max-width:800px;
	box-sizing:border-box;
	padding:0 0 0 0.2%;
}

/*.fh_800{
	width:100%;
	max-width:800px;
}*/


@media screen and (min-width: 561px){ /* 画面が2010pxの場合 */
     .fh_800 li{
	width:22%;
	margin: 1.3%;
	/*float:left;*/
	display:inline-block;
	/*display:inline-block;*/
	vertical-align:top;
	opacity:1;
	-webkit-transition-duration: 0.10s;
    transition-duration: 0.10s;
}	
     .fh_800 li:nth-of-type(4n){
	margin-right: 0;
}	
p.caption{
	font-size:11px;
	line-height:150%;
	letter-spacing: normal;
	}}

@media screen and (max-width: 560px){ /* 画面が560pxの場合 */
    .fh_800 li{
	width:43%;
	margin: 2%;
	/*float:left;*/
	display:inline-block;
	vertical-align:top;
	opacity:1;
	-webkit-transition-duration: 0.10s;
    transition-duration: 0.10s;
}	
     .fh_800 li:nth-of-type(2n){
	margin-right: 0;
}	
p.caption{
	font-size:10px;
	line-height:130%;
	letter-spacing: normal;
	}}

@media screen and (max-width: 340px){ /* 画面が340pxの場合 */
    .fh_800 li{
	width:43;
	margin: 2%;
	/*float:left;*/
	display:inline-block;
	vertical-align:top;
	opacity:1;
	-webkit-transition-duration: 0.10s;
    transition-duration: 0.10s;
}	
     .fh_800 li:nth-of-type(2n){
	margin-right: 0;
}	
p.caption{
	font-size:10px;
	line-height:130%;
	letter-spacing: normal;
	}}


.fh_800 li:nth-of-type(4n){
	margin-right: 0;
}

.feature_hot li:hover{
	opacity:0.8;
	-webkit-transition-duration: 0.10s;
    transition-duration: 0.10s;
}

.feature_hot li a{
	text-decoration:none;
	color: #666 !important;
}

.feature_hot li img{
	opacity:1;
}

.feature_hot li:hover img{
	opacity:1;
}

.feature_hot li dl{
	position:relative;
	width:100%;
}

.feature_hot li dl dt img{
	display:block;
/*	border:1px solid #CCC;
	box-shadow:0 0 2px #CCC;*/
	box-sizing:border-box;
	width:100%;
	height:auto;
}

.feature_hot li dl dd{
	margin:0;
	font-size:11px;
	line-height:1.5px;
	word-break:break-all;
	text-align: justify;
	text-justify: inter-ideograph;
	height:4.5em;
}




/* 2line */

@media screen and (min-width: 561px){ /* 画面が2010pxの場合 */
    ul.feature_hot2.fh_800 li{
	width:47%;
	margin: 1.3%;
	/*float:left;*/
	display:inline-block;
	/*display:inline-block;*/
	vertical-align:top;
	opacity:1;
	-webkit-transition-duration: 0.10s;
    transition-duration: 0.10s;
}	
p.caption{
	font-size:11px;
	line-height:150%;
	letter-spacing: normal;
	}}

@media screen and (max-width: 560px){ /* 画面が560pxの場合 */
    .feature_hot2.fh_800 li{
	width:92%;
	margin: 2%;
	/*float:left;*/
	display:inline-block;
	vertical-align:top;
	opacity:1;
	-webkit-transition-duration: 0.10s;
    transition-duration: 0.10s;
}	
p.caption{
	font-size:10px;
	line-height:130%;
	letter-spacing: normal;
	}}

@media screen and (max-width: 340px){ /* 画面が340pxの場合 */
    .feature_hot2.fh_800 li{
	width:92%;
	margin: 2%;
	/*float:left;*/
	display:inline-block;
	vertical-align:top;
	opacity:1;
	-webkit-transition-duration: 0.10s;
    transition-duration: 0.10s;
}	
p.caption{
	font-size:10px;
	line-height:130%;
	letter-spacing: normal;
	}}


ul.feature_hot2{
	margin:0;
	overflow:visible;
	max-width:800px;
	box-sizing:border-box;
	padding:0 0 0 0.2%;
}


.feature_hot2 li:hover{
	opacity:0.8;
	-webkit-transition-duration: 0.10s;
    transition-duration: 0.10s;
}

.feature_hot2 li a{
	text-decoration:none;
	color: #666 !important;
}

.feature_hot2 li img{
	opacity:1;
}

.feature_hot2 li:hover img{
	opacity:1;
}

.feature_hot2 li dl{
	position:relative;
	width:100%;
}

.feature_hot2 li dl dt img{
	display:block;
/*	border:1px solid #CCC;
	box-shadow:0 0 2px #CCC;*/
	box-sizing:border-box;
	width:100%;
	height:auto;
}

.feature_hot2 li dl dd{
	margin: 0;
	font-size: 11px;
	line-height: 1.5px;
	word-break: break-all;
	text-align: justify;
	text-justify: inter-ideograph;
	height: 2.5em;
}



p.badge{
	margin:0;
	padding:2%;
	position:absolute;
	top:-2%;
	right:-2%;
	font-size:12px;
	line-height:12px;
	font-weight:bold;
	color:#FFF;
	background:#C30;
	border:1px solid #FFF;
	border-radius: 5px;
	box-shadow: 1px 2px 2px #666;
	
}