.ctaarea{
    border-radius: 8px;  height: 48px; 
    background-image: linear-gradient(to left, #7a8df3, #977bff); display: flex; text-decoration: none; 
    color: inherit; cursor: pointer; align-items: center; text-decoration: none; overflow: hidden; box-sizing: border-box;
}
.desktop-show .ctaarea {
    margin: 20px 1.6rem 0 !important; width:351px;
}
.mobile-shown .ctaarea {
    width:100%; margin-bottom:12px;
}
.left_cta {height:48px; flex: 0 0 48px; }
.right_cta {flex: 1 1 auto; display: flex; min-width: 0; padding: 0 8px; align-items: center; box-sizing: border-box; overflow: hidden;}
.cta_image {display:block; width: 100%; height: 100%; border-radius: 8px 0 0 8px; object-fit: cover}
.cta_detail_left {flex: 1 1 auto; min-width: 0; margin: 0 8px 0 0; color: #fff; overflow: hidden;}
.cta_detail_right {flex: 0 0 auto; margin: 0; display: flex; align-items: center;}
.action_btn {
    color: #977bff; background-color: #fff; font-weight: 500; border-radius: 12px; padding: 2px 8px; font-size: 13px;
    font-family: PingFangTC; white-space: nowrap; text-align: center; display: inline-flex; align-items: center; box-sizing: border-box;
    justify-content: center; line-height: 1;
}
.cta_detail_left .cta_content {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;
    line-height: 1.3; max-height: calc(1.3em * 2); font-size: 13px; font-weight: 500; font-family: PingFangTC;
    word-break: break-word; overflow-wrap: anywhere;
}
.mobile-shown {overflow: hidden; box-sizing: border-box; max-width: 100%;}