/*▼ クリップモジュール用css ▼*/
.m-article-clip-btn{
position:relative;
display: inline-block;
width: 25px;
height: 25px;
cursor:pointer;
}
.m-article-clip-btn .background{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
transition: .3s;
background: transparent center center no-repeat;
background-size: 20px auto;
background-image: url(/common/dol/images/v3/icon_clip.png);
transform: rotate(-25deg);
}
.m-article-clip-btn.clipped{
background-color:#ddd;
}
.m-article-clip-btn span::before{
content:"クリップする";
}
.m-article-clip-btn.clipped span::before{
display:none;
}
.m-article-clip-btn:hover{
background-color:transparent;
}
.m-article-clip-btn .c-flag{
position:absolute;
background:rgba(255,255,255,1);
-webkit-box-shadow: 0px 3px 10px rgba(0,0,0,0.9);
        box-shadow: 0px 3px 10px rgba(0,0,0,0.9);
width:220px;
font-size:1.2rem;
text-align:center;
padding:10px 15px;
top: -80px;
left: -95px;
line-height:1.6;
border-radius:10px;
z-index: 2;
display:none;
}

@media screen and (max-width:768px) {
  .m-article-clip-btn .c-flag{
    width:220px;
    height:auto;
    font-size:1.2rem;
    top:-50px;
    left:-190px;
  }
  .bottom-functions .m-article-clip-btn .c-flag{
    left:-100px;
  }
}

.m-article-clip-btn .c-flag .c-flag-inner{
position:relative;
padding:2px 0px;
color:#333;
}
.m-article-clip-btn .c-flag .c-flag-inner a{
display:inline;
color:#0F52A4;
}
.m-article-clip-btn .c-flag .c-close-btn{
position:absolute;
top:-13px;
right:0;
font-size:1rem;
color:#fff;
background-color:#aaa;
text-align:center;
padding:2px 6px;
}
.m-flag .c-close-btn:hover{
color:#fff;
}
m-flag .c-close-btn::before{
content:"X";
}

.m-article-clip-btn .m-guest-flag{
display:none;
}
.m-article-clip-btn.clipped .m-guest-flag{
display:none;
}
.m-article-clip .c-article-clip-btn{
float:right;
margin-right:40px;
}
.m-article-clip .c-article-clip-btn .c-flag{
width:90%;
top:-71px;
left:-8px;
}
.c-delete{
font-size:1.2rem;
color:#999;
cursor:pointer;
}
.c-delete .c-close{
width:18px;
height:14px;
padding:2px 0;
border-radius:9px;
color:#fff;
background-color:#ccc;
display:inline-block;
text-align:center;
font-size:1rem;
margin-right:0.5rem;
}
.c-delete-btn{
  display:none;
}
.c-delete-btn.open{
  display:block;
}
/* iPadでクリップを有効にするため */
.m-article-clip-btn{
cursor:pointer;
}
/* ▲ クリップモジュール用css ▲ */

/* ▼ マイページ用css ▼ */
.article-box{
position:relative;
}
.c-delete-btn{
position:absolute;
background:rgba(255,255,255,1);
-webkit-box-shadow: 0px 3px 10px rgba(0,0,0,0.9);
        box-shadow: 0px 3px 10px rgba(0,0,0,0.9);
width:150px;
font-size:1.4rem;
text-align:center;
padding:20px 15px 10px 15px;
bottom: 40px;
left: 35px;
line-height:1.6;
border-radius:10px;
z-index: 2;
display:none;
}
.c-delete-btn .remove{
display:inline-block;
width:4em;
margin:10px auto;
padding:0.2em;
font-size:1.2rem;
text-align:center;
color:#fff;
background-color:#666;
border-radius:4px;
cursor:pointer;
}

.c-delete-btn .remove:hover{
color:#fff;
background-color:#aaa;
}
.c-delete-btn  .close-btn{
position: absolute;
right: -8px;
top: -10px;
font-size:1.6rem;
line-height:1.6rem;
width:1.6rem;
height:1.6rem;
text-align:center;
display:inline-block;
color:#fff;
vertical-align:text-top;
cursor:pointer;
padding: 1.5rem;
}
.c-delete-btn  .close-btn::before{
  background-color: #aaa;
  width: 20px;
  height: 20px;
  content: "";
  display: block;
  position: absolute;
  top: 13px;
  right: 13px;
  border-radius: .9em;
  z-index: -1;
}
.pagination.clip{
margin-top:20px;
}
.pagination.clip li:not(.current){
cursor:pointer;
}
/* ▲ マイページ用css ▲ */

