/* カスタムCSS */



/* マーカー風の装飾（少し太めのアンダーライン） */
.hwl-marker {
    background: linear-gradient(transparent 60%, #e3f2fd 60%); /* 薄い水色のマーカー */
    /* https://hana-weblab.com/のアクセントカラー #db3498 を薄く透過させた色 (#db349826 相当) */
    background: linear-gradient(transparent 60%, rgba(219, 52, 152, 0.15) 60%);
    font-weight: bold;
    padding: 0 2px;
}

/* ブログ記事下のPRセクション */
.hwl-footer-pr {
    border-top: 2px dotted #e0e0e0;
    margin-top: 40px;
    padding-top: 30px;
    font-size: 0.95em;
    color: #444;
    line-height: 1.8;
}

.hwl-footer-pr__thanks {
    margin-bottom: 20px;
    font-weight: bold;
    color: #888;
}

/* 囲み枠(PR全体) */
.hwl-footer-pr__inner {
    background-color: #fff;
    border: 2px dotted #db3498;
    border-radius: 10px;
    padding: 25px;
    margin-bottom: 20px;
}

/* 「あなたのそばのシステム屋さん」を強調 */
.hwl-footer-pr__lead {
    display: inline-block;
    color: #1a237e; /* 濃いネイビー（信頼感） */
    border-bottom: 3px solid #db3498; /* 下線で強調 */
    font-size: 1.2em;
    padding: 0.5em 2em 0 0;
    font-weight: bold;
}

.hwl-footer-pr__body p {/*SANGO設定を上書き*/
    margin-bottom: 1em;
}

.hwl-footer-pr__body a,
.hwl-footer-pr__contact a {
    color: #337ab7;
    text-decoration: underline;
    font-weight: bold;
}

/* お悩み箇所のリストアップを見やすく */
.hwl-footer-pr__problems {
    margin: 15px 0;
    line-height: 2;
}

.hwl-footer-pr__contact {
    margin-top: 25px;
    padding: 15px;
    background-color: #f9f9f9; /* 少し背景色をつけて「窓口」感を出す */
    border-radius: 8px;

    margin-top: 20px;
    padding: 15px;
    background-color: #f0f0f0; /* 囲みより少し濃いグレーで差別化 */
    border-radius: 6px;
    text-align: center;        /* ボタンを中央寄せにして「窓口」感をアップ */
}

.hwl-footer-pr__contact p {
    margin-bottom: 5px;
}

/* リンクボタンを少しボタンぽくしてアクセントに */
.hwl-btn-link {
    display: inline-block;
    background-color: #337ab7; /* SANGOに近いブルー */
    background-color: #db3498; /* メインサイトと同じ色 */
    color: #fff !important;
    padding: 5px 15px;
    border-radius: 4px;
    border-radius: 30px; /* 角を丸くするとピンクの優しさが引き立ちます */
    text-decoration: none !important;
    transition: 0.3s;

    font-weight: bold;
    box-shadow: 0 4px 15px rgba(219, 52, 152, 0.3); /* ほんのり影 */
}
.hwl-btn-link:hover {
    background-color: #1a237e;
    background-color: #b02677; /* 少し濃くしてホバー効果 */
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(219, 52, 152, 0.4);
}