/* =========================================
   さとおや.net リニューアルCSS
   ファイル名：satooya-renewal.css
   ・既存構成は変更しない
   ・見た目のみ軽くリニューアル
   ・背景まわり、外枠、各パーツをやさしく調整
   ========================================= */

/* =========================================
   ページ背景・外枠
   ========================================= */
html {
    background:
        radial-gradient(circle at 20% 20%, rgba(255,255,255,0.9) 0, rgba(255,255,255,0.9) 12px, transparent 13px),
        radial-gradient(circle at 80% 10%, rgba(255,255,255,0.7) 0, rgba(255,255,255,0.7) 10px, transparent 11px),
        linear-gradient(180deg, #fff8ee 0%, #f7f5ee 100%);
    background-size: 220px 220px, 260px 260px, auto;
}

body {
    background: transparent !important;
    color: #5f513d;
}

/* 左右の縦ラインを消して、中央をやわらかい白背景の箱に */
#wrap {
    background: #fffdf9 !important;
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;
    border-bottom: none !important;
    border-radius: 20px !important;
    box-shadow:
        0 0 0 1px rgba(239, 226, 200, 0.9),
        0 8px 26px rgba(120, 90, 40, 0.10) !important;
    margin-top: 18px !important;
    margin-bottom: 24px !important;
    overflow: hidden !important;
}

/* 念のため縦ラインになりそうな指定を解除 */
#container,
#main,
#contents,
#side,
#left,
#right {
    border-left-color: transparent !important;
    border-right-color: transparent !important;
}

/* =========================================
   全体のやさしい雰囲気
   ========================================= */
a {
    color: #8a6632;
}

a:hover {
    color: #b97819;
}

/* =========================================
   ヘッダー
   ========================================= */
header {
    border-bottom: none !important;
}

header #header.header-renewal {
    display: flex !important;
    align-items: center !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto 18px !important;
    padding: 14px 16px !important;
    background: #fffaf0 !important;
    border: none !important;
    border-bottom: none !important;
    border-radius: 0 0 18px 18px !important;
    box-sizing: border-box !important;
    box-shadow: 0 3px 12px rgba(120, 90, 40, 0.12) !important;
    overflow: visible !important;
    background-image: none !important;
}

header #header.header-renewal::after,
header::after {
    display: none !important;
    content: none !important;
}

/* 左：タイトル画像 */
header #header.header-renewal .h_l,
header #header.header-renewal .header-renewal_img {
    float: none !important;
    display: block !important;
    flex: 0 0 46% !important;
    width: auto !important;
    max-width: 46% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    box-sizing: border-box !important;
}

header #header.header-renewal .h_l a,
header #header.header-renewal .header-renewal_img a {
    display: block !important;
    line-height: 0 !important;
}

/* タイトル画像本体 */
header #header.header-renewal .h_l img,
header #header.header-renewal .header-renewal_img img {
    display: block !important;
    width: 100% !important;
    max-width: 444px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    vertical-align: bottom !important;
    box-sizing: border-box !important;
}

/* 右：説明文 */
header #header.header-renewal .h_r,
header #header.header-renewal .header-renewal_text {
    float: none !important;
    display: block !important;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* 説明文 */
header #header.header-renewal .profile_p {
    margin: 0 !important;
    color: #6b5636 !important;
    font-size: 14px !important;
    line-height: 1.8 !important;
}

/* はじめての方へ・質問集 */
header #header.header-renewal .p_first {
    display: inline-block !important;
    margin: 8px 5px 0 0 !important;
    padding: 6px 14px !important;
    color: #fff !important;
    background: #f39a2f !important;
    border-radius: 999px !important;
    text-decoration: none !important;
    font-weight: bold !important;
    line-height: 1.4 !important;
    box-shadow: 0 2px 6px rgba(243, 154, 47, 0.25) !important;
}

header #header.header-renewal .p_first:hover {
    background: #e78618 !important;
    text-decoration: none !important;
}

header #header.header-renewal br.clean {
    display: none !important;
}

/* =========================================
   トップ導入エリア
   ========================================= */
#top_info {
    background: transparent !important;
}

#top_info h1 {
    margin: 0 0 14px !important;
    padding: 12px 16px !important;
    background: #f7fbef !important;
    color: #617534 !important;
    border: 1px solid #d9e7b5 !important;
    border-left: 6px solid #a8c45a !important;
    border-radius: 12px !important;
    font-size: 20px !important;
    line-height: 1.6 !important;
    box-sizing: border-box !important;
}

#top_info > p {
    margin-bottom: 18px !important;
    padding: 12px 16px !important;
    background: #ffffff !important;
    border: 1px solid #f0e5cf !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.06) !important;
}

/* =========================================
   案内ボックス・ボタン
   ========================================= */
.board,
.info_box,
.profile_box {
    background: #fffdf9 !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 16px !important;
    box-shadow: 0 3px 10px rgba(120, 90, 40, 0.07) !important;
}

.board {
    padding: 16px !important;
    margin-bottom: 18px !important;
}

.button a,
.button.radius5 a,
.link_waku a,
#btn-smt-search {
    display: inline-block !important;
    background: linear-gradient(180deg, #ffb14c 0%, #f39a2f 100%) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 999px !important;
    padding: 12px 20px !important;
    text-decoration: none !important;
    font-weight: bold !important;
    box-shadow: 0 4px 10px rgba(243, 154, 47, 0.22) !important;
}

.button a:hover,
.button.radius5 a:hover,
.link_waku a:hover,
#btn-smt-search:hover {
    background: linear-gradient(180deg, #f9a536 0%, #e78618 100%) !important;
    text-decoration: none !important;
}

/* =========================================
   見出し
   ========================================= */
section h2,
#menu_sp h2,
.profile-title {
    padding: 10px 14px !important;
    background: #f7fbef !important;
    color: #617534 !important;
    border-left: 6px solid #a8c45a !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
}

/* =========================================
   募集一覧カード
   ========================================= */
.list_box {
    background: #ffffff !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 16px !important;
    box-shadow: 0 3px 10px rgba(120, 90, 40, 0.06) !important;
    padding: 14px !important;
    margin-bottom: 16px !important;
    box-sizing: border-box !important;
}

.list_box h3 {
    margin: 0 0 10px !important;
    line-height: 1.5 !important;
}

.list_box h3 a {
    color: #7a5a2d !important;
    text-decoration: none !important;
}

.list_box h3 a:hover {
    text-decoration: underline !important;
}

.list_l .img img {
    border-radius: 12px !important;
}

.list_date {
    color: #7d705b !important;
}

/* =========================================
   タグ・ステータス
   ========================================= */
.ribbon-end,
.ribbon-decision {
    border-radius: 999px !important;
    padding: 4px 10px !important;
    font-size: 12px !important;
}

/* =========================================
   フッター
   ========================================= */
.sign,
#footer {
    background: #fffaf0 !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 14px !important;
    box-shadow: 0 3px 10px rgba(120, 90, 40, 0.06) !important;
}

.sign {
    padding: 16px !important;
    margin-bottom: 16px !important;
}

#footer {
    padding: 14px !important;
}

/* =========================================
   スマホ
   ========================================= */
@media screen and (max-width: 768px) {
    html {
        background:
            linear-gradient(180deg, #fff8ee 0%, #f7f5ee 100%);
    }

    #wrap {
        border-radius: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        box-shadow: none !important;
    }

    header #header.header-renewal {
        display: block !important;
        padding: 12px !important;
        margin-bottom: 14px !important;
        border-radius: 0 0 14px 14px !important;
    }

    header #header.header-renewal .h_l,
    header #header.header-renewal .header-renewal_img {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto 10px !important;
        text-align: center !important;
    }

    header #header.header-renewal .h_l img,
    header #header.header-renewal .header-renewal_img img {
        width: 100% !important;
        max-width: 520px !important;
        margin: 0 auto !important;
    }

    header #header.header-renewal .h_r,
    header #header.header-renewal .header-renewal_text {
        width: 100% !important;
        max-width: 100% !important;
    }

    header #header.header-renewal .profile_p {
        font-size: 13px !important;
        line-height: 1.7 !important;
        text-align: left !important;
    }

    header #header.header-renewal .p_first {
        padding: 6px 12px !important;
        font-size: 13px !important;
    }

    #top_info h1 {
        font-size: 17px !important;
        line-height: 1.6 !important;
    }

    .list_box {
        padding: 12px !important;
    }
}


/* =========================================
   ボタン内アイコン重なり対策
   既存CSSの三角・矢印アイコンを消す
   ========================================= */

.board .button a,
.board .button.radius5 a,
.board .button a:link,
.board .button a:visited,
.button.radius5 a,
.button a {
    position: static !important;
    background-image: linear-gradient(180deg, #ffb14c 0%, #f39a2f 100%) !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    text-indent: 0 !important;
    overflow: visible !important;
}

/* 既存CSSの疑似要素アイコンを非表示 */
.board .button a::before,
.board .button a::after,
.board .button.radius5 a::before,
.board .button.radius5 a::after,
.button a::before,
.button a::after,
.button.radius5 a::before,
.button.radius5 a::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
}

/* 投稿ボタンだけを中央に戻す */
.board .button,
.board .button.radius5 {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin: 12px auto 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

.board .button a,
.board .button.radius5 a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 10px 22px !important;
    margin: 0 auto !important;
    color: #fff !important;
    line-height: 1.5 !important;
    white-space: nowrap !important;
    border-radius: 999px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    text-decoration: none !important;
}

/* hover */
.board .button a:hover,
.board .button.radius5 a:hover {
    background-image: linear-gradient(180deg, #f9a536 0%, #e78618 100%) !important;
    text-decoration: none !important;
}

/* スマホでは折り返し可能 */
@media screen and (max-width: 640px) {
    .board .button a,
    .board .button.radius5 a {
        max-width: 100% !important;
        white-space: normal !important;
        padding: 10px 18px !important;
    }
}

/* =========================================
   個別ページ リニューアル
   対象：#page / #detail / #ph_box / #chara など
   ========================================= */

/* 個別ページ全体 */
#page {
    background: transparent !important;
    color: #5f513d !important;
}

/* 個別ページタイトル */
#page > h1 {
    margin: 0 0 12px !important;
    padding: 14px 18px !important;
    background: #f7fbef !important;
    color: #617534 !important;
    border: 1px solid #d9e7b5 !important;
    border-left: 6px solid #a8c45a !important;
    border-radius: 14px !important;
    font-size: 24px !important;
    line-height: 1.5 !important;
    box-sizing: border-box !important;
}

/* 日付・募集期限 */
#page .page_date {
    margin: 0 0 16px !important;
    padding: 10px 14px !important;
    background: #fffdf9 !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 12px !important;
    color: #7d705b !important;
    line-height: 1.7 !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.06) !important;
    box-sizing: border-box !important;
}

#page .page_date .f_F00,
#page .page_date .f_F00 span {
    color: #d95c5c !important;
    font-weight: bold !important;
}

/* 詳細上部：写真＋基本情報 */
#detail {
    display: flex !important;
    gap: 18px !important;
    align-items: flex-start !important;
    margin: 0 0 18px !important;
    padding: 16px !important;
    background: #fffdf9 !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 18px !important;
    box-shadow: 0 3px 12px rgba(120, 90, 40, 0.08) !important;
    box-sizing: border-box !important;
}

/* 写真エリア */
#ph_box {
    float: none !important;
    width: 42% !important;
    max-width: 320px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

#ph_box .ph_main,
#ph_box .main-board {
    margin: 0 0 10px !important;
    padding: 10px !important;
    background: #fffaf0 !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 16px !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.06) !important;
    box-sizing: border-box !important;
}

#ph_box .img {
    position: relative !important;
    text-align: center !important;
}

#ph_box .ph_main img,
#ph_box .main-board img {
    display: block !important;
    width: 100% !important;
    max-width: 260px !important;
    height: auto !important;
    margin: 0 auto !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
}

/* サムネイル */
#ph_box .ph_sub,
#ph_box .thumbnail-board {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 8px 0 0 !important;
    padding: 8px !important;
    background: #ffffff !important;
    border: 1px solid #f0e5cf !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
}

#ph_box .ph_sub a,
#ph_box .thumbnail-board a {
    display: block !important;
    line-height: 0 !important;
}

#ph_box .ph_sub img,
#ph_box .thumbnail-board img {
    display: block !important;
    width: 70px !important;
    height: 70px !important;
    object-fit: cover !important;
    border-radius: 10px !important;
    border: 1px solid #efe2c8 !important;
}

#ph_box .f_pink {
    margin: 8px 0 0 !important;
    color: #d98b9a !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    text-align: center !important;
}

/* 基本情報エリア */
#chara {
    float: none !important;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* 投稿者・地域などの表 */
#chara ul.menu {
    display: grid !important;
    grid-template-columns: 110px 1fr !important;
    gap: 0 !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    background: #ffffff !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.05) !important;
}

#chara ul.menu li {
    display: block !important;
    float: none !important;
    width: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    border: none !important;
    border-bottom: 1px solid #f0e5cf !important;
    box-sizing: border-box !important;
    line-height: 1.6 !important;
}

#chara ul.menu li:nth-child(odd) {
    background: #f7fbef !important;
    color: #617534 !important;
    font-weight: bold !important;
}

#chara ul.menu li:nth-child(even) {
    background: #fff !important;
    color: #5f513d !important;
}

#chara ul.menu li:nth-last-child(1),
#chara ul.menu li:nth-last-child(2) {
    border-bottom: none !important;
}

#chara br.clean {
    display: none !important;
}

/* 個別ページ内のSNS枠 */
#chara .social-area-syncer {
    margin: 12px 0 0 !important;
    padding: 12px !important;
    background: #fffaf0 !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
}

/* 終了しましたなどのボード */
#page > .board {
    margin: 0 0 18px !important;
    padding: 14px 16px !important;
    background: #fff7f7 !important;
    border: 1px solid #f0c9c9 !important;
    border-radius: 14px !important;
    color: #9a4d4d !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.05) !important;
}

/* セクション本文 */
#page section {
    margin: 0 0 18px !important;
}

#page section h2 {
    margin: 0 0 10px !important;
    padding: 10px 14px !important;
    background: #f7fbef !important;
    color: #617534 !important;
    border: 1px solid #d9e7b5 !important;
    border-left: 6px solid #a8c45a !important;
    border-radius: 12px !important;
    font-size: 18px !important;
    line-height: 1.6 !important;
    box-sizing: border-box !important;
}

#page .contents {
    margin: 0 !important;
    padding: 16px !important;
    background: #ffffff !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 14px !important;
    color: #5f513d !important;
    line-height: 1.9 !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.05) !important;
    box-sizing: border-box !important;
}

/* 応募される方へのお願い */
.apply-please {
    margin: 0 !important;
    padding: 14px !important;
    background: #fffaf0 !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
}

.apply-title {
    margin: 0 0 10px !important;
    color: #7a5a2d !important;
    font-weight: bold !important;
}

.ul-apply-please {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.ul-apply-please li {
    position: relative !important;
    margin: 0 0 8px !important;
    padding: 8px 10px 8px 30px !important;
    background: #ffffff !important;
    border: 1px solid #f0e5cf !important;
    border-radius: 999px !important;
    line-height: 1.5 !important;
    box-sizing: border-box !important;
}

.ul-apply-please li::before {
    content: "●" !important;
    position: absolute !important;
    left: 12px !important;
    top: 8px !important;
    color: #f39a2f !important;
    font-size: 11px !important;
}

/* 上へ戻る */
#page .fortop a,
.fortop a {
    display: inline-block !important;
    padding: 8px 14px !important;
    background: #fffaf0 !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 999px !important;
    color: #7a5a2d !important;
    text-decoration: none !important;
}

#page .fortop a:hover,
.fortop a:hover {
    background: #f7fbef !important;
    text-decoration: none !important;
}

/* 個別ページ スマホ */
@media screen and (max-width: 768px) {
    #page > h1 {
        font-size: 20px !important;
        padding: 12px 14px !important;
    }

    #detail {
        display: block !important;
        padding: 12px !important;
        border-radius: 16px !important;
    }

    #ph_box {
        width: 100% !important;
        max-width: none !important;
        margin: 0 0 14px !important;
    }

    #ph_box .ph_main img,
    #ph_box .main-board img {
        max-width: 100% !important;
    }

    #chara {
        width: 100% !important;
    }

    #chara ul.menu {
        grid-template-columns: 92px 1fr !important;
    }

    #chara ul.menu li {
        padding: 9px 10px !important;
        font-size: 13px !important;
    }

    #page section h2 {
        font-size: 17px !important;
    }

    #page .contents {
        padding: 14px !important;
        line-height: 1.8 !important;
    }

    .ul-apply-please li {
        border-radius: 12px !important;
    }
}

/* =========================================
   個別ページ：応募される方へのお願い 文字かぶり対策
   ========================================= */

/* セクション直下の説明文 */
#page section > p {
    position: static !important;
    display: block !important;
    clear: both !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 10px !important;
    padding: 0 4px !important;
    line-height: 1.8 !important;
    color: #5f513d !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

/* contents内で文字が重ならないよう通常配置に戻す */
#page .contents {
    position: static !important;
    clear: both !important;
    overflow: visible !important;
}

/* 応募お願いボックス */
#page .contents .apply-please,
.apply-please {
    position: static !important;
    display: block !important;
    clear: both !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 8px 0 0 !important;
    padding: 14px !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

/* 「応募される方へのお願い」のタイトル */
#page .contents .apply-please .apply-title,
.apply-please .apply-title,
p.apply-title {
    position: static !important;
    display: block !important;
    clear: both !important;
    float: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 12px !important;
    padding: 0 0 8px !important;
    line-height: 1.6 !important;
    color: #7a5a2d !important;
    font-weight: bold !important;
    border-bottom: 1px dashed #e8d7b9 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

/* リスト側も上に詰まりすぎないよう調整 */
#page .contents .apply-please .ul-apply-please,
.apply-please .ul-apply-please,
.ul-apply-please {
    position: static !important;
    display: block !important;
    clear: both !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

/* =========================================
   個別ページ：応募される方へのお願い やさしい雰囲気に調整
   ========================================= */

/* 応募お願いボックス全体 */
#page .contents .apply-please,
.apply-please {
    background: #fffdf8 !important;
    border: 1px solid #f0e7d6 !important;
    border-radius: 18px !important;
    box-shadow: none !important;
    padding: 16px !important;
}

/* ボックス内タイトル：オレンジの圧を抑える */
#page .contents .apply-please .apply-title,
.apply-please .apply-title,
p.apply-title {
    color: #6f7f43 !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid #e4edd0 !important;
    margin: 0 0 12px !important;
    padding: 0 0 8px !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
}

/* リスト全体 */
#page .contents .apply-please .ul-apply-please,
.apply-please .ul-apply-please,
.ul-apply-please {
    margin: 0 !important;
    padding: 0 !important;
}

/* 各条件：四角枠感を弱める */
#page .contents .apply-please .ul-apply-please li,
.apply-please .ul-apply-please li,
.ul-apply-please li {
    margin: 0 0 8px !important;
    padding: 9px 12px 9px 30px !important;
    background: #ffffff !important;
    border: 1px solid #edf2df !important;
    border-radius: 14px !important;
    color: #5f513d !important;
    box-shadow: none !important;
    line-height: 1.6 !important;
}

/* オレンジ丸を淡いグリーンに変更 */
#page .contents .apply-please .ul-apply-please li::before,
.apply-please .ul-apply-please li::before,
.ul-apply-please li::before {
    content: "●" !important;
    position: absolute !important;
    left: 12px !important;
    top: 10px !important;
    color: #b7c978 !important;
    font-size: 9px !important;
}

/* 最後だけ余白を消す */
#page .contents .apply-please .ul-apply-please li:last-child,
.apply-please .ul-apply-please li:last-child,
.ul-apply-please li:last-child {
    margin-bottom: 0 !important;
}

/* =========================================
   はじめての方へページ 追加修正
   ・上部の肉球感を減らす
   ・目次番号カラー調整
   ・リンク色の視認性改善
   ・リンク疑似要素の抑制
   ========================================= */

/* -----------------------------------------
   1) 上部の肉球アイコンをやさしい丸アイコンへ変更
   ----------------------------------------- */
#page > h1 + p::before,
#page > h2::before,
#page h3::before,
#page .info_box ul li::before {
    content: "" !important;
    display: block !important;
    border-radius: 50% !important;
    background: #b7c978 !important;
    box-shadow: inset 0 0 0 4px #eef5db !important;
    opacity: 1 !important;
}

#page > h1 + p::before {
    width: 20px !important;
    height: 20px !important;
    left: 18px !important;
    top: 18px !important;
}

#page > h2::before,
#page h3::before {
    width: 16px !important;
    height: 16px !important;
    left: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

#page .info_box ul li::before {
    width: 10px !important;
    height: 10px !important;
    left: 14px !important;
    top: 16px !important;
    box-shadow: none !important;
}

/* board の項目アイコンも肉球感をなくす */
#page .board ul li {
    background-image: none !important;
}

#page .board ul li::before {
    content: "●" !important;
    position: absolute !important;
    left: 12px !important;
    top: 9px !important;
    color: #b7c978 !important;
    font-size: 9px !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* -----------------------------------------
   2) 目次の 1 / 2 / 3 の色をサイトに合わせる
   ----------------------------------------- */
.mokuji > ol {
    counter-reset: mokuji-counter !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.mokuji > ol > li {
    counter-increment: mokuji-counter !important;
    position: relative !important;
    margin: 0 0 12px !important;
    padding: 0 0 0 34px !important;
    color: #5f513d !important;
    line-height: 1.7 !important;
}

.mokuji > ol > li::before {
    content: counter(mokuji-counter) !important;
    position: absolute !important;
    left: 0 !important;
    top: 1px !important;
    width: 22px !important;
    height: 22px !important;
    line-height: 22px !important;
    text-align: center !important;
    border-radius: 6px !important;
    background: #9fc6f3 !important;
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: bold !important;
    box-shadow: 0 1px 3px rgba(80, 120, 170, 0.15) !important;
}

.mokuji > ol > li:nth-child(2)::before {
    background: #b7c978 !important;
}

.mokuji > ol > li:nth-child(3)::before {
    background: #f1b56a !important;
}

.mokuji > ol > li > ul {
    margin: 6px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.mokuji > ol > li > ul > li {
    position: relative !important;
    margin: 0 0 6px !important;
    padding-left: 16px !important;
}

.mokuji > ol > li > ul > li::before {
    content: "・" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    color: #b7c978 !important;
    font-weight: bold !important;
}

/* -----------------------------------------
   3) リンク色を見やすくする
   ----------------------------------------- */
#page a:not(.p_first):not(.twitter-share-button) {
    color: #8a6632 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    text-decoration-thickness: 1px !important;
}

#page a:not(.p_first):not(.twitter-share-button):hover {
    color: #b97819 !important;
}

/* 補足リンクや本文リンクも見やすく */
#page .kokuban a,
#page .info_box a,
#page p a,
#page li a {
    color: #8a6632 !important;
}

/* ボタンリンクは除外 */
#page p.link a,
#page .p_first,
#btn-smt-search {
    text-decoration: none !important;
    color: #fff !important;
}

/* -----------------------------------------
   4) 「こちら」などの疑似要素・補助表示を抑制
   ----------------------------------------- */
#page a::after,
#page a::before {
    /* 既存CSSで補助文言が出ている場合に抑える */
    content: none;
}

#page .kokuban a::after,
#page .info_box a::after,
#page p a::after,
#page li a::after {
    content: none !important;
}

/* スマホ微調整 */
@media screen and (max-width: 768px) {
    #page > h1 + p::before {
        width: 18px !important;
        height: 18px !important;
        left: 16px !important;
        top: 16px !important;
    }

    #page > h2::before,
    #page h3::before {
        width: 14px !important;
        height: 14px !important;
        left: 12px !important;
    }

    .mokuji > ol > li {
        padding-left: 32px !important;
    }

    .mokuji > ol > li::before {
        width: 20px !important;
        height: 20px !important;
        line-height: 20px !important;
        font-size: 11px !important;
    }
}

/* =========================================
   はじめての方へページ 目次・リンク色 再調整
   ========================================= */

/* -----------------------------------------
   目次：2段目が重ならないように余白を広げる
   ----------------------------------------- */
.mokuji {
    padding: 20px 22px !important;
}

.mokuji > ol {
    counter-reset: mokuji-counter !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.mokuji > ol > li {
    counter-increment: mokuji-counter !important;
    position: relative !important;
    margin: 0 0 14px !important;
    padding: 0 0 0 42px !important;
    line-height: 1.75 !important;
    color: #5f513d !important;
    box-sizing: border-box !important;
}

.mokuji > ol > li::before {
    content: counter(mokuji-counter) !important;
    position: absolute !important;
    left: 0 !important;
    top: 2px !important;
    width: 26px !important;
    height: 26px !important;
    line-height: 26px !important;
    text-align: center !important;
    border-radius: 8px !important;
    background: #f1b56a !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: bold !important;
    box-shadow: 0 2px 5px rgba(120, 90, 40, 0.12) !important;
}

/* 目次内の2段目 */
.mokuji > ol > li > ul {
    margin: 7px 0 0 !important;
    padding: 0 0 0 6px !important;
    list-style: none !important;
}

.mokuji > ol > li > ul > li {
    position: relative !important;
    margin: 0 0 7px !important;
    padding: 0 0 0 18px !important;
    line-height: 1.7 !important;
    box-sizing: border-box !important;
}

/* 緑の●を使わず、控えめな線に変更 */
.mokuji > ol > li > ul > li::before {
    content: "―" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    color: #c8b38b !important;
    font-weight: normal !important;
    background: none !important;
    box-shadow: none !important;
    width: auto !important;
    height: auto !important;
}

/* 目次リンク色 */
.mokuji a {
    color: #7a5a2d !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

.mokuji a:hover {
    color: #b97819 !important;
}

/* -----------------------------------------
   緑の●を不要箇所から削除
   ----------------------------------------- */

/* ページ冒頭カードや見出しの丸アイコンを非表示 */
#page > h1 + p::before,
#page > h2::before,
#page h3::before {
    display: none !important;
    content: none !important;
}

/* アイコンを消す分、左余白を戻す */
#page > h1 + p {
    padding-left: 18px !important;
}

#page > h2,
#page h3 {
    padding-left: 16px !important;
}

/* board内リストの緑●も消して、テキストだけに近い形へ */
#page .board ul li {
    padding-left: 14px !important;
}

#page .board ul li::before {
    display: none !important;
    content: none !important;
}

/* info_box内の緑・肉球風アイコンも控えめに削除 */
#page .info_box ul li {
    padding-left: 14px !important;
}

#page .info_box ul li::before {
    display: none !important;
    content: none !important;
}

/* -----------------------------------------
   枠の中・手順ボックス内のリンク色を見やすく
   ----------------------------------------- */

/* kokuban・board・info_box内のリンクは背景に負けない濃い青緑に */
#page .kokuban a,
#page .board a,
#page .info_box a,
#page .contents a {
    color: #2f6f73 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    text-decoration-thickness: 1px !important;
    font-weight: bold !important;
}

#page .kokuban a:hover,
#page .board a:hover,
#page .info_box a:hover,
#page .contents a:hover {
    color: #1f5558 !important;
}

/* 黒板色・濃い背景が残っている場合の保険 */
#page .kokuban {
    background: #fffaf0 !important;
    color: #5f513d !important;
}

#page .kokuban li {
    color: #5f513d !important;
}

/* 補足枠内リンクも見やすく */
#page .kokuban .f_y a,
#page .f_y a {
    color: #2f6f73 !important;
    font-weight: bold !important;
}

/* ボタンリンクは白文字維持 */
#page p.link a,
#page .button a,
#page .button.radius5 a {
    color: #ffffff !important;
    text-decoration: none !important;
}

/* スマホ */
@media screen and (max-width: 768px) {
    .mokuji {
        padding: 16px !important;
    }

    .mokuji > ol > li {
        padding-left: 38px !important;
    }

    .mokuji > ol > li::before {
        width: 24px !important;
        height: 24px !important;
        line-height: 24px !important;
    }

    #page > h1 + p {
        padding-left: 14px !important;
    }

    #page > h2,
    #page h3 {
        padding-left: 14px !important;
    }
}

/* =========================================
   はじめての方へページ：手順ボックス（.kokuban）再設計
   見やすさを優先して全面調整
   ========================================= */

/* 手順ボックス本体 */
#page .kokuban {
    position: relative !important;
    width: auto !important;
    max-width: 860px !important;
    margin: 22px auto 26px !important;
    padding: 22px !important;
    background: linear-gradient(180deg, #fffdf8 0%, #fffaf1 100%) !important;
    border: 1px solid #eadfc9 !important;
    border-radius: 22px !important;
    box-shadow: 0 6px 18px rgba(120, 90, 40, 0.08) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* 上部ラベル */
#page .kokuban::before {
    content: "手順" !important;
    display: inline-block !important;
    margin: 0 0 16px !important;
    padding: 6px 14px !important;
    background: #f7fbef !important;
    color: #617534 !important;
    border: 1px solid #dfeac7 !important;
    border-radius: 999px !important;
    font-weight: bold !important;
    line-height: 1.5 !important;
    box-shadow: none !important;
}

/* リスト全体 */
#page .kokuban ol {
    counter-reset: kokuban-step !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* 各手順 */
#page .kokuban ol li {
    counter-increment: kokuban-step !important;
    position: relative !important;
    margin: 0 0 14px !important;
    padding: 14px 16px 14px 56px !important;
    background: #ffffff !important;
    border: 1px solid #ebe2d2 !important;
    border-radius: 16px !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.05) !important;
    color: #4f4637 !important;
    line-height: 1.85 !important;
    font-size: 15px !important;
    box-sizing: border-box !important;
}

#page .kokuban ol li:last-child {
    margin-bottom: 0 !important;
}

/* 番号 */
#page .kokuban ol li::before {
    content: counter(kokuban-step) !important;
    position: absolute !important;
    left: 16px !important;
    top: 14px !important;
    width: 28px !important;
    height: 28px !important;
    line-height: 28px !important;
    text-align: center !important;
    background: #b7c978 !important;
    color: #ffffff !important;
    border-radius: 50% !important;
    font-weight: bold !important;
    font-size: 13px !important;
    box-shadow: 0 2px 6px rgba(120, 150, 80, 0.18) !important;
}

/* 手順内のリンク */
#page .kokuban ol li a,
#page .kokuban .f_y a {
    color: #2e6f73 !important;
    font-weight: bold !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    text-decoration-thickness: 1px !important;
}

#page .kokuban ol li a:hover,
#page .kokuban .f_y a:hover {
    color: #1f5558 !important;
}

/* 黄色で見づらかった補足文を補足ボックス化 */
#page .kokuban .f_y {
    display: block !important;
    margin: 10px 0 0 !important;
    padding: 10px 12px !important;
    background: #f7fbef !important;
    border: 1px solid #dfeac7 !important;
    border-left: 4px solid #b7c978 !important;
    border-radius: 12px !important;
    color: #5f513d !important;
    line-height: 1.8 !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
}

/* 補足文の後ろに続く括弧書きも読みやすく */
#page .kokuban .f_y + a,
#page .kokuban .f_y + span,
#page .kokuban .f_y + em {
    color: #2e6f73 !important;
}

/* li内の通常文字色を強制 */
#page .kokuban ol li,
#page .kokuban ol li span,
#page .kokuban ol li strong,
#page .kokuban ol li em {
    color: #4f4637 !important;
}

/* リンクだけ色を戻す */
#page .kokuban ol li a,
#page .kokuban .f_y a {
    color: #2e6f73 !important;
}

/* 枠全体の余白の再設計 */
#page .kokuban + p,
#page .kokuban + .link {
    margin-top: 14px !important;
}

/* スマホ */
@media screen and (max-width: 768px) {
    #page .kokuban {
        max-width: 100% !important;
        margin: 18px 0 22px !important;
        padding: 16px !important;
        border-radius: 18px !important;
    }

    #page .kokuban::before {
        margin-bottom: 14px !important;
        font-size: 14px !important;
    }

    #page .kokuban ol li {
        padding: 12px 12px 12px 48px !important;
        font-size: 14px !important;
        line-height: 1.75 !important;
        border-radius: 14px !important;
    }

    #page .kokuban ol li::before {
        left: 12px !important;
        top: 12px !important;
        width: 24px !important;
        height: 24px !important;
        line-height: 24px !important;
        font-size: 12px !important;
    }

    #page .kokuban .f_y {
        padding: 9px 10px !important;
        font-size: 13px !important;
        line-height: 1.7 !important;
    }
}

/* =========================================
   はじめての方へページ：旧画像見出しの完全リセット
   対象：2006年から運営 / 対象地域は北海道のみ など
   ========================================= */

/* 旧デザインのピンク画像・肉球画像を完全に消す */
#page > h2,
#page h2#riyou,
#page h2#2006,
#page h2#area {
    position: relative !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 30px 0 14px !important;
    padding: 13px 18px 13px 18px !important;
    background: #f7fbef !important;
    background-image: none !important;
    background-color: #f7fbef !important;
    color: #617534 !important;
    border: 1px solid #d9e7b5 !important;
    border-left: 6px solid #a8c45a !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.05) !important;
    font-size: 20px !important;
    font-weight: bold !important;
    line-height: 1.6 !important;
    text-indent: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

/* 旧画像由来・前回調整由来のアイコンを出さない */
#page > h2::before,
#page > h2::after,
#page h2#riyou::before,
#page h2#riyou::after,
#page h2#2006::before,
#page h2#2006::after,
#page h2#area::before,
#page h2#area::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* h2直後の本文を読みやすく */
#page > h2 + p,
#page h2#riyou + p,
#page h2#2006 + p,
#page h2#area + p {
    margin-top: 0 !important;
}

/* 2006年から運営・対象地域の本文ブロックを軽く整える */
#page h2#2006 ~ p,
#page h2#area ~ p {
    line-height: 1.9 !important;
}

/* ただし以降すべてに効きすぎないよう、本文リンクは見やすい色に統一 */
#page h2#2006 ~ p a,
#page h2#area ~ p a {
    color: #2e6f73 !important;
    font-weight: bold !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

/* スマホ */
@media screen and (max-width: 768px) {
    #page > h2,
    #page h2#riyou,
    #page h2#2006,
    #page h2#area {
        margin: 24px 0 12px !important;
        padding: 11px 14px !important;
        border-radius: 12px !important;
        font-size: 17px !important;
        line-height: 1.6 !important;
    }
}

/* =========================================
   はじめての方へページ：旧ピンク見出しの確実なリセット
   id="2006" は数字始まりのため属性セレクタで指定
   ========================================= */

/* h2見出しを一括で再設計 */
body #srap #wrap main#top #page > h2,
body #srap #wrap main#top #page h2[id="riyou"],
body #srap #wrap main#top #page h2[id="2006"],
body #srap #wrap main#top #page h2[id="area"] {
    display: block !important;
    position: relative !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 30px 0 14px !important;
    padding: 13px 18px !important;
    background: #f7fbef !important;
    background-color: #f7fbef !important;
    background-image: none !important;
    background-repeat: no-repeat !important;
    background-position: 0 0 !important;
    background-size: auto !important;
    color: #617534 !important;
    border: 1px solid #d9e7b5 !important;
    border-left: 6px solid #a8c45a !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.05) !important;
    font-size: 20px !important;
    font-weight: bold !important;
    line-height: 1.6 !important;
    text-indent: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

/* 旧画像・肉球・疑似要素を無効化 */
body #srap #wrap main#top #page > h2::before,
body #srap #wrap main#top #page > h2::after,
body #srap #wrap main#top #page h2[id="riyou"]::before,
body #srap #wrap main#top #page h2[id="riyou"]::after,
body #srap #wrap main#top #page h2[id="2006"]::before,
body #srap #wrap main#top #page h2[id="2006"]::after,
body #srap #wrap main#top #page h2[id="area"]::before,
body #srap #wrap main#top #page h2[id="area"]::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* 古いh2画像に合わせた指定が残っている場合の保険 */
body #srap #wrap main#top #page h2 {
    background-image: none !important;
    text-indent: 0 !important;
}

/* h2直後の本文 */
body #srap #wrap main#top #page > h2 + p {
    margin-top: 0 !important;
    line-height: 1.9 !important;
}

/* スマホ */
@media screen and (max-width: 768px) {
    body #srap #wrap main#top #page > h2,
    body #srap #wrap main#top #page h2[id="riyou"],
    body #srap #wrap main#top #page h2[id="2006"],
    body #srap #wrap main#top #page h2[id="area"] {
        margin: 24px 0 12px !important;
        padding: 11px 14px !important;
        border-radius: 12px !important;
        font-size: 17px !important;
        line-height: 1.6 !important;
    }
}

/* =========================================
   はじめての方へページ：リンク画像「こちら」削除＋SNS欄再設計
   ========================================= */

/* -----------------------------------------
   リンクの「こちら」画像を消して、見やすいリンクボタンへ
   対象：p.link / p.link a
   ----------------------------------------- */

/* 旧CSSの「こちら」画像・背景を無効化 */
body #srap #wrap main#top #page p.link,
body #srap #wrap main#top #page p.link a {
    background-image: none !important;
    background-repeat: no-repeat !important;
    background-position: 0 0 !important;
    text-indent: 0 !important;
    overflow: visible !important;
}

/* 疑似要素で「こちら」画像が出ている場合も消す */
body #srap #wrap main#top #page p.link::before,
body #srap #wrap main#top #page p.link::after,
body #srap #wrap main#top #page p.link a::before,
body #srap #wrap main#top #page p.link a::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    background-image: none !important;
    border: 0 !important;
}

/* リンク行全体 */
body #srap #wrap main#top #page p.link {
    margin: 20px 0 26px !important;
    padding: 0 !important;
    text-align: center !important;
    line-height: 1.6 !important;
}

/* リンク本体：見やすいボタン */
body #srap #wrap main#top #page p.link a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    max-width: 100% !important;
    min-height: 0 !important;
    padding: 11px 22px !important;
    margin: 0 auto !important;
    background: linear-gradient(180deg, #ffb14c 0%, #f39a2f 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 10px rgba(243, 154, 47, 0.20) !important;
    font-weight: bold !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    text-align: center !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
}

/* リンク内に軽い矢印だけ追加 */
body #srap #wrap main#top #page p.link a {
    gap: 8px !important;
}

body #srap #wrap main#top #page p.link a span {
    color: inherit !important;
}

body #srap #wrap main#top #page p.link a:hover {
    background: linear-gradient(180deg, #f9a536 0%, #e78618 100%) !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

/* -----------------------------------------
   「よろしければ情報の拡散にご協力お願いします。」欄
   ----------------------------------------- */

body #srap #wrap .social-area-syncer {
    position: relative !important;
    margin: 26px 10px 18px !important;
    padding: 18px 20px !important;
    background: #fffdf8 !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 20px !important;
    box-shadow: 0 4px 14px rgba(120, 90, 40, 0.07) !important;
    text-align: center !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

/* 薄い装飾 */
body #srap #wrap .social-area-syncer::before {
    content: "🐾" !important;
    position: absolute !important;
    left: 18px !important;
    top: 16px !important;
    font-size: 24px !important;
    opacity: 0.12 !important;
    pointer-events: none !important;
}

body #srap #wrap .social-area-syncer::after {
    content: "Share" !important;
    position: absolute !important;
    right: 18px !important;
    bottom: 12px !important;
    color: #b7c978 !important;
    font-size: 20px !important;
    font-weight: bold !important;
    letter-spacing: 0.05em !important;
    opacity: 0.16 !important;
    pointer-events: none !important;
}

body #srap #wrap .social-area-syncer p {
    position: relative !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    color: #6b5636 !important;
    font-size: 14px !important;
    font-weight: bold !important;
    line-height: 1.7 !important;
    text-align: center !important;
}

/* SNSボタンリスト */
body #srap #wrap .social-button-syncer {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

body #srap #wrap .social-button-syncer li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* Tweetボタンの外側 */
body #srap #wrap .social-button-syncer .social {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 34px !important;
    padding: 8px 12px !important;
    background: #f7fbef !important;
    border: 1px solid #dfeac7 !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

/* スマホ */
@media screen and (max-width: 768px) {
    body #srap #wrap main#top #page p.link {
        margin: 18px 0 22px !important;
    }

    body #srap #wrap main#top #page p.link a {
        width: auto !important;
        max-width: 100% !important;
        padding: 10px 18px !important;
        font-size: 14px !important;
        white-space: normal !important;
    }

    body #srap #wrap .social-area-syncer {
        margin: 22px 8px 16px !important;
        padding: 16px 14px !important;
        border-radius: 18px !important;
    }

    body #srap #wrap .social-area-syncer::after {
        display: none !important;
        content: none !important;
    }

    body #srap #wrap .social-area-syncer p {
        font-size: 13px !important;
    }
}

/* =========================================
   はじめての方へページ：sub_title と目次枠の再調整
   ========================================= */

/* -----------------------------------------
   sub_title：ページ全体に合うやさしい見出しへ
   ----------------------------------------- */
body #srap #wrap main#top #page .sub_title {
    position: relative !important;
    display: block !important;
    width: auto !important;
    margin: 26px 0 12px !important;
    padding: 12px 16px !important;
    background: #fffdf8 !important;
    background-image: none !important;
    color: #617534 !important;
    border: 1px solid #d9e7b5 !important;
    border-left: 6px solid #a8c45a !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.05) !important;
    font-size: 17px !important;
    font-weight: bold !important;
    line-height: 1.6 !important;
    text-indent: 0 !important;
    box-sizing: border-box !important;
}

/* 以前の犬アイコン・装飾を消す */
body #srap #wrap main#top #page .sub_title::before,
body #srap #wrap main#top #page .sub_title::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* sub_title直後の本文との余白 */
body #srap #wrap main#top #page .sub_title + p {
    margin-top: 0 !important;
    line-height: 1.9 !important;
}

/* -----------------------------------------
   目次欄：点線枠を消して、すっきりしたカードに
   ----------------------------------------- */
body #srap #wrap main#top #page .mokuji {
    background: #f7fbef !important;
    border: 1px solid #dfeac7 !important;
    border-radius: 20px !important;
    box-shadow: 0 3px 10px rgba(120, 90, 40, 0.06) !important;
    outline: none !important;
    padding: 20px 22px !important;
}

/* 目次内に残っている点線・内枠を消す */
body #srap #wrap main#top #page .mokuji,
body #srap #wrap main#top #page .mokuji * {
    border-style: solid;
}

body #srap #wrap main#top #page .mokuji ol,
body #srap #wrap main#top #page .mokuji ul,
body #srap #wrap main#top #page .mokuji li {
    border: none !important;
    outline: none !important;
    background-image: none !important;
}

/* 目次タイトル */
body #srap #wrap main#top #page .mokuji .p_mokuji {
    margin: 0 0 12px !important;
    padding: 6px 14px !important;
    background: #ffffff !important;
    color: #617534 !important;
    border: 1px solid #dfeac7 !important;
    border-radius: 999px !important;
    box-shadow: none !important;
}

/* スマホ */
@media screen and (max-width: 768px) {
    body #srap #wrap main#top #page .sub_title {
        margin: 22px 0 10px !important;
        padding: 11px 14px !important;
        border-radius: 12px !important;
        font-size: 16px !important;
    }

    body #srap #wrap main#top #page .mokuji {
        padding: 16px !important;
        border-radius: 18px !important;
    }
}

/* =========================================
   目次リンクの不要な枠線を削除
   ========================================= */

body #srap #wrap main#top #page .mokuji a,
body #srap #wrap main#top #page .mokuji a:link,
body #srap #wrap main#top #page .mokuji a:visited {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    color: #7a5a2d !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    text-decoration-thickness: 1px !important;
    font-weight: normal !important;
    line-height: inherit !important;
}

body #srap #wrap main#top #page .mokuji a:hover {
    color: #b97819 !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    text-decoration: underline !important;
}

/* 目次内の子項目の青い点も少し控えめに */
body #srap #wrap main#top #page .mokuji > ol > li > ul > li::before {
    content: "・" !important;
    color: #b7c978 !important;
    background: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* =========================================
   質問集ページ リニューアル
   対象：/qa
   ・QAアイコンをサイトに合わせる
   ・ピンク枠系のボックスをやさしいデザインへ
   ========================================= */

/* 質問集ページの冒頭説明 */
body #srap #wrap main#top #page > h1 + p {
    position: relative !important;
    margin: 0 0 18px !important;
    padding: 16px 18px !important;
    background: #fffdf8 !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 18px !important;
    color: #5f513d !important;
    line-height: 1.9 !important;
    box-shadow: 0 3px 10px rgba(120, 90, 40, 0.06) !important;
    box-sizing: border-box !important;
}

/* QAページのQ */
body #srap #wrap main#top #page .qa_q {
    position: relative !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 22px 0 0 !important;
    padding: 13px 16px 13px 54px !important;
    background: #f7fbef !important;
    background-image: none !important;
    border: 1px solid #d9e7b5 !important;
    border-left: 6px solid #a8c45a !important;
    border-radius: 16px 16px 0 0 !important;
    color: #617534 !important;
    font-size: 16px !important;
    font-weight: bold !important;
    line-height: 1.7 !important;
    text-indent: 0 !important;
    box-shadow: 0 3px 10px rgba(120, 90, 40, 0.05) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* Qアイコン */
body #srap #wrap main#top #page .qa_q::before {
    content: "Q" !important;
    position: absolute !important;
    left: 16px !important;
    top: 13px !important;
    width: 26px !important;
    height: 26px !important;
    line-height: 26px !important;
    text-align: center !important;
    background: #a8c45a !important;
    color: #ffffff !important;
    border-radius: 50% !important;
    font-family: Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: bold !important;
    box-shadow: 0 2px 6px rgba(120, 150, 80, 0.18) !important;
}

/* 旧QA画像・疑似要素を無効化 */
body #srap #wrap main#top #page .qa_q::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* QAページのA */
body #srap #wrap main#top #page .qa_a {
    position: relative !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 0 !important;
    padding: 14px 16px 14px 54px !important;
    background: #fffdf8 !important;
    background-image: none !important;
    border: 1px solid #efe2c8 !important;
    border-top: none !important;
    border-radius: 0 0 16px 16px !important;
    color: #5f513d !important;
    font-size: 15px !important;
    font-weight: normal !important;
    line-height: 1.9 !important;
    text-indent: 0 !important;
    box-shadow: 0 3px 10px rgba(120, 90, 40, 0.05) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* Aアイコン */
body #srap #wrap main#top #page .qa_a::before {
    content: "A" !important;
    position: absolute !important;
    left: 16px !important;
    top: 14px !important;
    width: 26px !important;
    height: 26px !important;
    line-height: 26px !important;
    text-align: center !important;
    background: #f1b56a !important;
    color: #ffffff !important;
    border-radius: 50% !important;
    font-family: Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: bold !important;
    box-shadow: 0 2px 6px rgba(200, 130, 50, 0.16) !important;
}

/* 旧A画像・疑似要素を無効化 */
body #srap #wrap main#top #page .qa_a::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* 回答の後に続く補足本文 */
body #srap #wrap main#top #page .qa_a + p {
    margin: 12px 0 18px !important;
    padding: 14px 16px !important;
    background: #ffffff !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 14px !important;
    color: #5f513d !important;
    line-height: 1.9 !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.04) !important;
    box-sizing: border-box !important;
}

/* QAページ内のboard：ピンク枠をサイトに合わせる */
body #srap #wrap main#top #page .board {
    margin: 16px 0 22px !important;
    padding: 16px !important;
    background: #fffdf8 !important;
    background-image: none !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 18px !important;
    box-shadow: 0 3px 10px rgba(120, 90, 40, 0.06) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* board内のリスト */
body #srap #wrap main#top #page .board ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

body #srap #wrap main#top #page .board ul li {
    position: relative !important;
    margin: 0 0 10px !important;
    padding: 11px 14px !important;
    background: #ffffff !important;
    background-image: none !important;
    border: 1px solid #edf2df !important;
    border-radius: 14px !important;
    color: #5f513d !important;
    line-height: 1.7 !important;
    box-sizing: border-box !important;
}

body #srap #wrap main#top #page .board ul li:last-child {
    margin-bottom: 0 !important;
}

/* 余計なアイコンを出さない */
body #srap #wrap main#top #page .board ul li::before,
body #srap #wrap main#top #page .board ul li::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* board内リンク */
body #srap #wrap main#top #page .board a {
    color: #2e6f73 !important;
    font-weight: bold !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

/* h2は既存の爽やか見出しに統一 */
body #srap #wrap main#top #page h2[id="toroku"],
body #srap #wrap main#top #page h2[id="toko"],
body #srap #wrap main#top #page h2[id="oubo"],
body #srap #wrap main#top #page h2[id="hoka"] {
    display: block !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 30px 0 14px !important;
    padding: 13px 18px !important;
    background: #f7fbef !important;
    background-image: none !important;
    color: #617534 !important;
    border: 1px solid #d9e7b5 !important;
    border-left: 6px solid #a8c45a !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(120, 90, 40, 0.05) !important;
    font-size: 20px !important;
    font-weight: bold !important;
    line-height: 1.6 !important;
    text-indent: 0 !important;
    box-sizing: border-box !important;
}

body #srap #wrap main#top #page h2[id="toroku"]::before,
body #srap #wrap main#top #page h2[id="toroku"]::after,
body #srap #wrap main#top #page h2[id="toko"]::before,
body #srap #wrap main#top #page h2[id="toko"]::after,
body #srap #wrap main#top #page h2[id="oubo"]::before,
body #srap #wrap main#top #page h2[id="oubo"]::after,
body #srap #wrap main#top #page h2[id="hoka"]::before,
body #srap #wrap main#top #page h2[id="hoka"]::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* QAページ内リンク色 */
body #srap #wrap main#top #page .qa_a a,
body #srap #wrap main#top #page .qa_q a,
body #srap #wrap main#top #page > p a {
    color: #2e6f73 !important;
    font-weight: bold !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

/* スマホ */
@media screen and (max-width: 768px) {
    body #srap #wrap main#top #page .qa_q {
        padding: 12px 12px 12px 48px !important;
        font-size: 15px !important;
        border-radius: 14px 14px 0 0 !important;
    }

    body #srap #wrap main#top #page .qa_q::before {
        left: 12px !important;
        top: 12px !important;
        width: 24px !important;
        height: 24px !important;
        line-height: 24px !important;
        font-size: 13px !important;
    }

    body #srap #wrap main#top #page .qa_a {
        padding: 12px 12px 12px 48px !important;
        font-size: 14px !important;
        border-radius: 0 0 14px 14px !important;
    }

    body #srap #wrap main#top #page .qa_a::before {
        left: 12px !important;
        top: 13px !important;
        width: 24px !important;
        height: 24px !important;
        line-height: 24px !important;
        font-size: 13px !important;
    }

    body #srap #wrap main#top #page .board {
        padding: 14px !important;
        border-radius: 16px !important;
    }

    body #srap #wrap main#top #page .board ul li {
        padding: 10px 12px !important;
        border-radius: 12px !important;
    }
}

/* =========================================
   質問集ページ：Q左側の緑ラインを削除
   ========================================= */

body #srap #wrap main#top #page .qa_q {
    border-left: 1px solid #d9e7b5 !important;
    padding-left: 54px !important;
}

/* Qアイコン位置はそのまま */
body #srap #wrap main#top #page .qa_q::before {
    left: 16px !important;
}

/* スマホ */
@media screen and (max-width: 768px) {
    body #srap #wrap main#top #page .qa_q {
        border-left: 1px solid #d9e7b5 !important;
        padding-left: 48px !important;
    }

    body #srap #wrap main#top #page .qa_q::before {
        left: 12px !important;
    }
}

/* =========================================
   お問い合わせフォーム：確認ボタン調整
   対象：#form-registry .form-panel .button
   ========================================= */

/* フォーム全体のボタン枠をリセット */
body #srap #wrap main#top #form-registry .form-panel .button,
body #srap #wrap main#top #form-registry .form-panel .button.radius5 {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 18px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-align: center !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

/* 確認ボタン本体 */
body #srap #wrap main#top #form-registry .form-panel .button a,
body #srap #wrap main#top #form-registry .form-panel .button.radius5 a,
body #srap #wrap main#top #form-registry .form-panel #link-submit {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 220px !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 11px 24px !important;
    background: linear-gradient(180deg, #ffb14c 0%, #f39a2f 100%) !important;
    background-image: linear-gradient(180deg, #ffb14c 0%, #f39a2f 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 10px rgba(243, 154, 47, 0.22) !important;
    font-weight: bold !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    text-align: center !important;
    text-indent: 0 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* 既存CSSの三角・矢印・画像アイコンを消す */
body #srap #wrap main#top #form-registry .form-panel .button a::before,
body #srap #wrap main#top #form-registry .form-panel .button a::after,
body #srap #wrap main#top #form-registry .form-panel #link-submit::before,
body #srap #wrap main#top #form-registry .form-panel #link-submit::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* hover */
body #srap #wrap main#top #form-registry .form-panel .button a:hover,
body #srap #wrap main#top #form-registry .form-panel #link-submit:hover {
    background: linear-gradient(180deg, #f9a536 0%, #e78618 100%) !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

/* フォーム入力欄も少しだけサイトになじませる */
body #srap #wrap main#top #form-registry .form-panel {
    background: #fffdf8 !important;
    border: 1px solid #efe2c8 !important;
    border-radius: 18px !important;
    box-shadow: 0 3px 10px rgba(120, 90, 40, 0.06) !important;
    padding: 18px !important;
    box-sizing: border-box !important;
}

body #srap #wrap main#top #form-registry .form-control,
body #srap #wrap main#top #form-registry input[type="text"],
body #srap #wrap main#top #form-registry input[type="name"],
body #srap #wrap main#top #form-registry input[type="email"],
body #srap #wrap main#top #form-registry textarea {
    border: 1px solid #d8d8d8 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

body #srap #wrap main#top #form-registry .form-control:focus,
body #srap #wrap main#top #form-registry input[type="text"]:focus,
body #srap #wrap main#top #form-registry input[type="name"]:focus,
body #srap #wrap main#top #form-registry input[type="email"]:focus,
body #srap #wrap main#top #form-registry textarea:focus {
    border-color: #b7c978 !important;
    box-shadow: 0 0 0 3px rgba(183, 201, 120, 0.18) !important;
    outline: none !important;
}

/* 必須ラベル */
body #srap #wrap main#top #form-registry .necessary {
    display: inline-block !important;
    margin-left: 5px !important;
    padding: 2px 7px !important;
    background: #f3a6b4 !important;
    color: #ffffff !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
}

/* スマホ */
@media screen and (max-width: 768px) {
    body #srap #wrap main#top #form-registry .form-panel {
        padding: 14px !important;
        border-radius: 16px !important;
    }

    body #srap #wrap main#top #form-registry .form-panel .button a,
    body #srap #wrap main#top #form-registry .form-panel #link-submit {
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        padding: 10px 18px !important;
        font-size: 14px !important;
        white-space: normal !important;
    }
}

/* =========================================
   スマホ：条件から募集を絞り込むボタンの枠崩れ対策
   対象：.button.radius5.onsp
   ========================================= */

/* 古い白枠・影・固定幅をリセット */
body #srap #wrap .button.radius5.onsp,
body #srap #wrap .pd10 .button.radius5.onsp,
body #srap #wrap main#top .button.radius5.onsp {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 18px auto !important;
    padding: 0 !important;
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-align: center !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

/* ボタン本体 */
body #srap #wrap .button.radius5.onsp a,
body #srap #wrap .pd10 .button.radius5.onsp a,
body #srap #wrap main#top .button.radius5.onsp a,
body #srap #wrap #btn-smt-search {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 11px 22px !important;
    background: linear-gradient(180deg, #ffb14c 0%, #f39a2f 100%) !important;
    background-image: linear-gradient(180deg, #ffb14c 0%, #f39a2f 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 10px rgba(243, 154, 47, 0.22) !important;
    font-weight: bold !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    text-align: center !important;
    text-indent: 0 !important;
    text-decoration: none !important;
    white-space: normal !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* 既存CSSの三角・矢印・画像を消す */
body #srap #wrap .button.radius5.onsp a::before,
body #srap #wrap .button.radius5.onsp a::after,
body #srap #wrap #btn-smt-search::before,
body #srap #wrap #btn-smt-search::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* スマホでは横幅を画面に合わせて自然に */
@media screen and (max-width: 768px) {
    body #srap #wrap .button.radius5.onsp,
    body #srap #wrap .pd10 .button.radius5.onsp,
    body #srap #wrap main#top .button.radius5.onsp {
        margin: 18px 10px !important;
        text-align: center !important;
    }

    body #srap #wrap .button.radius5.onsp a,
    body #srap #wrap .pd10 .button.radius5.onsp a,
    body #srap #wrap main#top .button.radius5.onsp a,
    body #srap #wrap #btn-smt-search {
        max-width: 100% !important;
        padding: 10px 18px !important;
        font-size: 14px !important;
    }
}
