/*
==================================================
## css Information
## Site URL: anythings
## File name: /excludes/css/_shared/mod/recommendDuet_v2.css
## Summary: recommendDuetコンポーネント用CSS
## Created: 2016.09.--
## Last update: 2020.12.16  -name: -DDuet Iwai
## Author: H.Muroi(ZP)
## comment: 
更新時など、基本的にはネストは3階層まででお願いします。
該当するHTMLとセットで読み込むことによりどのページでも利用できます。
==================================================
*/

/* recommendDuet */
/*
-usage-:下記HTMLブロックに該当
<section class="contentBlock recommendDuet">
  ・
  略
  ・
</section>
*/
.recommendDuet .recommendDuet_notice {
  margin: 0 -6px;
	padding-bottom: 25px;
}
.recommendDuet .recommendDuet_notice.bnrSlider02 {
  margin: 0;
}
.recommendDuet .recommendDuet_notice li {
  float: left;
  margin-bottom: 12px;
  margin-left: 6px;
  margin-right: 6px;
  position: relative;
  text-align: left;
}
.recommendDuet .recommendDuet_notice li a {
  display: block;
  text-decoration: none;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  transition: opacity 0.3s;
}
.recommendDuet .recommendDuet_notice li a:hover,.recommendDuet .recommendDuet_notice li input:hover {
  transition-delay: 0;
  opacity: .7;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}
.recommendDuet .box_col1row1 img {
  width: 236px;
  height: 210px;
}
.recommendDuet .box_col2row1 img {
  width: 484px;
  height: 215px;
}
.recommendDuet .box_col2row1_bnr img {
  width: 484px;
  height: 216px;
  padding-top: 20px;
}
.recommendDuet .box_col2row2 img {
  width: 484px;
  height: 484px;
}
.recommendDuet .labelArea {
  position: absolute;
  top: 4px;
  left: 4px;
  padding: 6px 0;
}
.recommendDuet .label {
  background: #008093;
  color: #fff;
  padding: 6px 9px;
  margin-right: 4px;
  border-radius: 2px;
}
.recommendDuet .label.label-special {
  background: #0194be;
}
.recommendDuet .label.label-coupon {
  background: #01b348;
}
.recommendDuet .label.label-new {
  background: #e60051;
}
.recommendDuet .label.label-wadai {
  background: #eb6100;
}
.recommendDuet .label.label-special:after{
  content: '特集'
}
.recommendDuet .label.label-coupon:after{
  content: 'クーポン'
}
.recommendDuet .label.label-new:after{
  content: 'NEW'
}
.recommendDuet .label.label-wadai:after{
  content: '話題'
}
.duetBtn ul {
    display: flex;
    justify-content: space-between;
    margin-bottom: 34px;
}
.duetBtn img{
  width: 100%;
}
.duetBtn li {
    width: calc(20% - 15px);
    margin: 0 0 12px 0;
    background: #fde4ec;
    border-radius: 5px;
    box-shadow: 0 2px 2px rgba(55, 55, 55, 0.3);
    transition: background 0.3s;
}
.duetBtn li:hover {
    transition-delay: 0;
    background: #f9bad0;
}
.recommendDuet .recommendDuet_info {
  display: block;
  width: 100%;
/*  position: absolute;*/
  bottom: 0;
  color: #fff;
  background: rgba(233, 82, 131, 0.8);
  box-sizing: border-box;
  padding: 5px 10px 5px;
}

.recommendDuet .infoTtl {
  font-size: 12px;
/*  border-bottom: 1px solid #bf0846;
  margin-bottom: 5px;
  padding-bottom: 5px;*/
  display: block;
}
.recommendDuet .infoTtl h4 {
  float: left;
  font-weight: normal;
}
.recommendDuet .infoTtl .data {
  float: right;
}
.recommendDuet .infoRead {
/*  font-weight: bold;*/
  font-size: 15px;
}
.recommendDuet .bnrSlider li:hover{
  opacity: .7;
}
.review .box_review {
  text-align: left;
  background: #fff;
}
.review .box_review span {
  display: block;
}
.review .box_review a {
  width: 236px;
  height: 236px;
  border: 1px solid #cccccc;
  padding: 9px;
  box-sizing: border-box;
  display: block;
  position: relative;
  text-decoration: none;
  color: #e95283;
}
.review .box_review a:focus{
  outline: none;
}
.review .box_review a:hover {
  color: #e95283;
}
.review .box_review a:hover .rev_review p {
  color: #333;
}
.review .rev_thumb {
  float: left;
  box-sizing: border-box;
  border: 1px solid #ccc;
}
.review .rev_review {
  width: 100px;
  margin-left: 10px;
  float: left;
  color: #333;
}
.review .rev_star {
  margin-top: 5px;
  font-size: 0;
  line-height: 0;
  height: 16px;
  background: url(/excludes/images/top/review/review_star.png) no-repeat top left;
}
.review .rev_star.rev_star01 {
  width: 20px;
}
.review .rev_star.rev_star02 {
  width: 40px;
}
.review .rev_star.rev_star03 {
  width: 60px;
}
.review .rev_star.rev_star04 {
  width: 80px;
}
.review .rev_star.rev_star05 {
  width: 100px;
}
.review .rev_commentTtl {
  margin: 0.5em 0;
  height: 3em;
/*  font-weight: normal;*/
}
.review .rev_comment {
  color: #333;
}
.review .rev_comment:hover {
  color: #333 !important;
}
.review .more_read {
  display: inline-block;
  position: absolute;
  bottom: 9px;
  right: 9px;
  color: #d7145b;
  text-decoration: underline;
}
.review .more_read:hover {
  text-decoration: none;
  color: #f60;
}
.review .commentBtn {
  margin-top: 20px;
}
.review .commentBtn p a {
  display: block;
  font-size: 0;
  line-height: 0;
  float: right;
  background: url(/excludes/images/top/review/review_commentBtn02.png) no-repeat top left;
  width: 475px;
  height: 50px;
}
.review .commentBtn p a:hover {
  background-position: 0 -50px;
}
.review .commentBtn p:first-child a {
  float: left;
  background: url(/excludes/images/top/review/review_commentBtn01.png) no-repeat top left;
}
.review .commentBtn p:first-child a:hover {
  background-position: 0 -50px;
}

/* 【追記】注目の商品・サービス情報、注目のレビュー　のスライドバナーのコントローラー位置 修正 */

.recommendDuet .bx-wrapper .bx-prev {
    left: -40px;
}
.recommendDuet .bx-wrapper .bx-next {
    right: -40px;
}

/* 【追記】注目のレビュー PC・SPソース統一 修正 */
.review .box_review .rev_thumb img {
  width: 90px;
  height: 90px;
}