﻿@charset "utf-8";

/* ------------------------------------------------
 * Style Name  :  recommend_style.css
 * --------------------------------------------- */


#consumablesrecommend .caroufredsel_wrapper {
	height: 250px !important;
}

#consumablesrecommend .carouInner {
	margin-left: 20px;
}

#consumablesrecommend ul {
	height: 250px;
	overflow: hidden;
	width:93%;
	margin:0 auto;
}

#consumablesrecommend ul li {
    min-height: 180px;
    float: left;
    width: 160px;
    margin-right: 15px;
}
#consumablesrecommend ul li:last-child {
    margin-right: 0;
}

#wrapper.topPageNew.topA #consumablesrecommend ul li {
    width: 158px !important;
}

#consumablesrecommend ul li img {
  width:160px;
  height:auto;
}

#wrapper.topPageNew.topA #consumablesrecommend ul li img {
    width: 158px !important;
}


#consumablesrecommend img,{
	width: 150px;
}

#consumablesrecommend .prev {
    top: 120px;
    text-indent: -9999px;
    width: 16px;
    height: 47px;
    background: url(/layout/store/common/img/carousel_arrow_left.gif) no-repeat;
    position: absolute;
    top: 120px;
    left: 0;
    cursor: pointer;
    z-index: 3000;
    display: none;
}

#consumablesrecommend .next {
    text-indent: -9999px;
    width: 16px;
    height: 47px;
    background: url(/layout/store/common/img/carousel_arrow_right.gif) no-repeat;
    position: absolute;
    top: 120px;
    right: 0;
    cursor: pointer;
    z-index: 3000;
    display: none;
}


#consumablesrecommend .textOverflow {
	display: inline-block;
	margin-top: 5px;
	font-weight: normal;
}

#consumablesrecommend .salesPrice i {
	font-style: normal;
	color: #f00;
}

#consumablesrecommend h2.title {
 font-weight:normal;
 background:#fcfcfc;
 margin:0 0 25px 0;
 padding:7px;
 border-top:1px solid #ddd;
 border-bottom:1px solid #ddd;
 overflow: hidden;
}

#consumablesrecommend h2.title em {
 color:#3b3b3b;
 font-size:20px;
 font-weight:bold;
 letter-spacing:0.1em;
 border-left:2px solid #1776e8;
 padding:5px 20px 4px;
 float:left;
 display:inline-block;
 text-shadow: 0 2px 0 #fff;
}

/*追記*/
.u-section{
	background: #f6f6f6;
	margin-top: 3em;
	width: 976px;
	margin: 2em auto;
}
#consumablesrecommend h2.u-textHeading{
	color: #1063c7;
	padding: 1em 0 0 1em;
	font-style: normal!important;
	background-color: #f6f6f6;
	border: none;
	font-size: 1.6em;
	font-weight: bold;
}
#consumablesrecommend em {
	font-style: normal!important;
}
#consumablesrecommend ul li a{
    font-size: 1em;
	color: #1063c7;
}


@media screen and (min-width: 641px) {
	#consumablesrecommend a:hover img {
		-webkit-animation: flash 2s;
		animation: flash 2s;
	}
	@-webkit-keyframes flash {
	  0% {
	    opacity: .4;
	  }
	  100% {
	    opacity: 1;
	  }
	}
	@keyframes flash {
	  0% {
	    opacity: .4;
	  }
	  100% {
	    opacity: 1;
	  }
	}
}



@media screen and (max-width:640px) {


	#consumablesrecommend ul {
		height: auto;
      display: flex;
      flex-wrap: wrap;
	}

	#consumablesrecommend ul li {
		float: none;
		display:inline-block;
		width:150px;
		height: 200px;
		overflow: hidden;
		position: relative;
	}

	#consumablesrecommend ul {
		overflow: hidden;
	}


	#consumablesrecommend ul li img {
		display: inline-block;
		width: 160px;
	}
	.u-section{
	width:100%;
}

}

@media screen and (max-width: 640px) {
	#consumablesrecommend em {
		font-size: 1.2em;
	}
}

