/*各製品ページのポップアップ*/
.contents-list{
    position: fixed;
    z-index: 20;
    right: 15px;
    bottom: 60px;
}
.contents-list .closeBTN{
    position: absolute;
    top: -15px;
    right: -15px;
    display: inline-block; 
    width: 40px;
    height: 40px;
}
.contents-list .suggest{
    background: rgb(0,70,161);
    filter:alpha(opacity=85); 
    background: rgba(0,70,161,0.85);
    color: #fff;
    padding: 10px 0 10px 10px;
    border-radius: 5px;
    box-shadow: 3px 3px 9px 0 rgb(73 73 73);
    font-weight: bold;
}
.contents-list .suggest h4{
    display: block;
    border-bottom: 1px solid #fff;
    padding-left: 10px;
    margin: 0 0 20px 0;
}
.contents-list .suggest ul{
    padding: 0 2%;
}
.contents-list .suggest ul li a:hover{
    text-decoration: none;
    opacity: 0.8;
}
.contents-list .suggest ul li span{
    display: inline-block;
    font-size: .8rem;
    background: #3babc3;
    padding: 3% 0 3% 6%;
    width: 65%;
    color: #fff;
    box-shadow: 1px 3px 4px 0 rgb(73 73 73);
}
.contents-list .suggest.mco ul li span{
    background: #8dc63f;
}
.contents-list .suggest.mhe ul li span{
    background: #8e52a0;
}
.contents-list .suggest.lab ul li span{
    background: #ee6d34;
}
.contents-list .suggest ul li img{
    width: 25%;
    box-shadow: 3px 3px 9px 0 rgb(73 73 73);
}
.contents-list.pdf1 .suggest ul li span{
    border-top-left-radius : 40px;
    -webkit-border-top-left-radius: 40px;
    -moz-border-radius-topleft: 40px;
    border-bottom-left-radius : 40px;
    -webkit-border-bottom-left-radius: 40px;
    -moz-border-radius-bottomleft: 40px;
    border-top-right-radius : 0px;
    -webkit-border-top-right-radius: 0px;
    -moz-border-radius-topright: 0px;
    border-bottom-right-radius : 0px;
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-bottomright: 0px;   
}
.contents-list.pdf2 .suggest ul li:first-of-type span{
    border-top-left-radius : 40px;
    -webkit-border-top-left-radius: 40px;
    -moz-border-radius-topleft: 40px;
    border-bottom-left-radius : 40px;
    -webkit-border-bottom-left-radius: 40px;
    -moz-border-radius-bottomleft: 40px;
    border-top-right-radius : 0px;
    -webkit-border-top-right-radius: 0px;
    -moz-border-radius-topright: 0px;
    border-bottom-right-radius : 0px;
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-bottomright: 0px;   
}
.contents-list.pdf2 .suggest ul li:last-of-type span{
    border-top-right-radius : 40px;
    -webkit-border-top-right-radius: 40px;
    -moz-border-radius-topright: 40px;
    border-bottom-right-radius : 40px;
    -webkit-border-bottom-right-radius: 40px;
    -moz-border-radius-bottomright: 40px;
    border-top-left-radius : 0px;
    -webkit-border-top-left-radius: 0px;
    -moz-border-radius-topleft: 0px;
    border-bottom-left-radius : 0px;
    -webkit-border-bottom-left-radius: 0px;
    -moz-border-radius-bottomleft: 0px; 
}
/*PC*/
@media screen and (min-width:650px) {
.contents-list.pdf1 .suggest ul li span{
    margin: 20px -5px 0 0;
}
.contents-list.pdf2 .suggest ul li:first-of-type span{
    margin: 20px -5px 0 0;
}   
.contents-list.pdf2 .suggest ul li:last-of-type span{
    margin: 20px 0 0 -5px;
} 
}
/*sp*/
@media screen and (max-width:650px) {
.contents-list{
    width: 70%;
    bottom: 140px;
}

.contents-list .suggest h4,.contents-list .suggest ul li span{
    font-size: .7rem;
}
.contents-list.pdf1 .suggest ul li span{
    margin: 10px -5px 0 0;
}  
.contents-list.pdf2 .suggest ul li:first-of-type span{
    margin: 10px -5px 0 0;
}   
.contents-list.pdf2 .suggest ul li:last-of-type span{
    margin: 10px 0 0 -5px;
}
}