/*====================================================================================================
//////////////////////////////////////////////////////////////////////////////////////////////////////

version: 1.0
created: 2017/09/14
update : -

//////////////////////////////////////////////////////////////////////////////////////////////////////
====================================================================================================*/
@charset "SHIFT-JIS";
body {
font-size:14px;
line-height:22px;
font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic","sans-serif";
}
.cpn-itemList{
margin:0;
padding:0 30px 0 30px;
}
.cpn-itemList a:link, a:visited{
color:#333;
text-decoration:underline;
}
.cpn-itemList a:hover{
color:#333;
text-decoration:none;
}
.cpn-itemList ul{
margin:0;
letter-spacing:-0.4em;
}
.cpn-itemList ul > li{
position: relative;
display:inline-block;
vertical-align:top;
padding:5px 21px 30px 10px;
width:146px;
letter-spacing:0;
white-space:normal;
}
.cpn-itemList ul > li .cpn-item .image{
display:block;
margin:0 0 10px;
padding:0;
width:auto;
}
.cpn-item{
display:table;
position:relative;
}
.cpn-item .image,
.cpn-item .body{
display:table-cell;
vertical-align:top;
direction:ltr;
}
.cpn-item .image{
padding:0 12px 0 0;
height:146px;
}
.cpn-item .item-img .no-item{
position: absolute;
top: 55px;
left: 28px;
background-color: #808080;
color: #fff;
text-align: center;
border-radius: 4px;
font-size: 16px;
margin: auto;
height: 25px;
padding: 6px 6px 0 6px;
width: 79px;
line-height:21px;
text-decoration: none;
}
.cpn-item .body{
padding:0;
text-align:left;
width:auto;
display:block;
}
.cpn-item .body > *:last-child{
margin-bottom:0;
}
.cpn-item .body .item-name{
margin:0 0 10px;
line-height:1.3;
word-break: break-all;
}
.cpn-item .body .item-name img{
display:block;
margin:0 0 5px;
}
.cpn-item .body .item-catch {
word-break: break-all;
}
.cpn-item .body .item-price{
margin:0 0 10px;
font-size:12px;
line-height:1.2;
}
.cpn-item .body .item-price .period-wrapper{
display:block;
}
.cpn-item .body .item-price .period{
display:inline-block;
font-size:12px;
white-space:nowrap;
}
.cpn-item .body .item-price .price{
font-weight:bold;
font-size:18px;
color:#e4007f;
display: inline-block;
}
.cpn-item .body .item-price .priceB{
font-weight:bold;
font-size:18px;
color:#333;
display: inline-block;
}
.cpn-item .body .item-price .sell-price{
display: block;
}
.cpn-item .body .item-price .wprice{
display: block;
}
.cpn-item .body .item-price .monthly{
display:block;
font-size:12px;
}
.wpriceLine{
text-decoration: line-through;
}
.cpn-item .body .item-price .price[class*="-million"],
.cpn-item .body .item-price .priceB[class*="-million"]{
font-size:15px;
line-height:160%;
}
.cpn-item .body .item-price .price[class*="-10million"],
.cpn-item .body .item-price .priceB[class*="-10million"]{
font-size:13px;
line-height:200%;
}
.cpn-item .body .item-price .price[class*="-10million"] + .tax,
.cpn-item .body .item-price .priceB[class*="-10million"] + .tax{
font-size:9px;
}
.cpn-item .body .item-price .rate{
display:block;
}
.cpn-item .body .item-price .price[class*="-default"]{
color:#333;
}
.cpn-item .body .item-price .ico-off{
display:inline-block;
vertical-align:middle;
margin:5px 0 0;
border-radius:2px;
padding:0 10px;
background:#f17fbf;
color:#fff;
font-weight:bold;
font-size:12px;
line-height:20px;
text-align:center;
}
.cpn-item .body .item-date{
margin:0 0 8px;
font-weight:bold;
line-height:1.4;
}
.templateBlock {margin:60px 0;}

.cpn-itemList .ribbon:before {
  position:absolute;
  top:-9px;
  left:-7px;
  content:"";
  overflow:hidden;
  display:inline-block;
  text-indent:200%;
  white-space:nowrap;
  vertical-align:middle;
  line-height:1;
  background-image:url('/com/images/common/icon_ssv_series.png');
  background-repeat:no-repeat;
}
.cpn-itemList .prodType1 .ribbon:before {
  width:100px;
  height:27px;
  background-position:0 -46px;
}

.cpn-itemList .prodType7 .ribbon:before {
  width:105px;
  height:27px;
  background-position:0 -183px;
}

.cpn-itemList .prodType3 .ribbon:before {
  width:100px;
  height:27px;
  background-position:0 -120px;
}

.cpn-itemList .prodType8 .ribbon:before {
  width:105px;
  height:27px;
  background-position:0 -244px;
}

.cpn-itemList .prodType9 .ribbon:before {
  width:105px;
  height:27px;
  background-position:0 -297px;
}
.cpn-itemList .prodType0 .ribbon:before {
  width:105px;
  height:19px;
  background-position:0 -425px;
}
/*クチコミ*/
.cpn-itemList ul li .body .item-evaluation-wrap{
margin:0 0 10px;
}
.cpn-itemList ul li .body .item-evaluation{
background:#fdebf5;
border-radius:3px;
text-align:center;
height:24px;
line-height:160%;
color:#666;
}
.cpn-itemList ul li .body .item-evaluation .star-rank{
display:inline-block;
vertical-align:middle;
padding-left:5px;
}
.cpn-itemList ul li .body .item-evaluation .star-rank .star-s{
width:72px;
}
.cpn-itemList ul li .body .item-evaluation .star-rank .star-range{
position:relative;
top:-1px;
left:0;
width:72px;
background: none;
text-align:left;
height:14px;
}
.cpn-itemList ul li .body .item-evaluation .star-rank .star-range:before{
position:absolute;
top:0;
content:" ";
overflow:hidden;
display:inline-block;
text-indent:200%;
white-space:nowrap;
vertical-align:middle;
line-height:1;
background-image:url('../../com/images/common/common-img-sprite.png?ver=3.75.2');
background-repeat:no-repeat;
width:72px;
height:14px;
background-position:0 -2845px;
left:0;
z-index:0;
}
.cpn-itemList ul li .body .item-evaluation .star-rank .star-range .star-selected{
position:absolute;
overflow:hidden;
display:inline-block;
text-indent:200%;
white-space:nowrap;
vertical-align:middle;
line-height:1;
background-image:url('../../com/images/common/common-img-sprite.png?ver=3.75.2');
background-repeat:no-repeat;
width:72px;
height:14px;
background-position:0 -2821px;
z-index:0;
}
.cpn-itemList ul li .body .item-evaluation a{
display:inline-block;
vertical-align:middle;
color:#666;
text-decoration:none;
line-height:24px;
}
.cpn-itemList ul li .body .item-evaluation a:hover{
text-decoration:underline;
opacity:.7;
}

.cpn-itemList .bx-wrapper .bx-prev,
.cpn-itemList .bx-wrapper .bx-next {
  background-image: url("/com/images/common/carousel-control.png");
  height: 0;
  overflow: hidden;
  padding-top: 33px;
  position: absolute;
  top: 40%;
  width: 33px;
}

.cpn-itemList .bx-wrapper .bx-prev {
  left: -30px;
  background-position: 0 0;
}

.cpn-itemList .bx-wrapper .bx-next {
  right: -30px;
  background-position: -27px 0;
}