@charset: 'UTF-8';

/*アンカーボタン*/
.mkcp_anc {
    padding: 5% 0 0;
}
.mkcp_anc .anc_box{
    max-width: 100%;
}
.mkcp_anc .anc_box > a{
    background-color: var(--bk-ksgray)!important;
    border-bottom: solid 5px #363636!important;
    border-radius: 7px!important;
    @media screen and (max-width: 598px){
        width: calc((100% - 15px) / 2)!important; 
        font-size: 1.6rem;
    }
}

/*キャンペーンブロック*/
.sp_wrapper_title > h3 {
    font-size: 2.4rem;
}
.mkcp_block{
    font-size: 1.4rem;
}
.sp_wapper_block .cp_tittle{
    margin: 0 0 20px;
    padding: 10px 5px 5px 10px;
    border-left: solid 5px #63666a;
    background-color: var(--bk-white);
    box-shadow: 3px 3px 4px rgb(187, 187, 187);
}
.sp_wapper_block .cp_tittle span.mk_name{
    display: block;
}
.sp_wapper_block .cp_tittle span.cp_name{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}
.sp_wapper_block .cp_img{
    margin: 0 0 20px;
    border: solid 1px var(--bk-gray)!important;
}
.sp_wapper_block .cp_period .period_tit{
    background-color: var(--bk-lgray);
    text-align: center;
    margin: 0 0 20px;
    font-weight: bold;
    padding: 7px 5px;
    position: relative;
    &::before{
        content: "";
        position: absolute;
        border-top: solid 15px #f2f2f2;
        border-left: solid 10px transparent;
        border-right: solid 10px transparent;
        bottom: -22px;
        left: 50%;
        transform: translate(0, -50%);
    }
}
.sp_date{
   text-align: center;
}
.cp_link{
    display: flex;
    flex-wrap: wrap;
    gap: 0 2%;
    margin: 15px 0 0;
}
.cp_link .maker_lbox,
.cp_link .store_lbox{
    background-color: #959595!important;
    border: 5px outset #8a8a8a!important;
    border-radius: 5px;
    font-size: 14px;
    text-decoration: none!important;
    color: #fff!important;
    padding: 0 20px 0 5px;
    height: 55px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.3!important;
    width: 49%;
    &::after{
        position: absolute;
        content: "≫";
        top: 50%;
        right: 5%;
        transform: translateY(-50%);
        font-size: 21px;
    }
    &:hover{
        opacity: .5;
    }
}
.cp_link .maker_lbox{
    background-color: #fff!important;
    border: 5px outset #626262!important;
    color: #000!important;
    line-height: 1.3!important;
}