@charset "UTF-8";
/* CSS Document */
.rule{
    overflow-wrap: anywhere; /* 収まらない場合に折り返す */
  word-break: normal; /* 単語の分割はデフォルトに依存 */
  line-break: strict;
}
/* ==========================================================================
   ▼ スマートフォン用表示設定（780px以下）
   ========================================================================== */
@media(max-width: 750px){
    /* 1. 最外枠（キャンペーン規約ブロック全体） */
    .rule {
        line-height: 1em;
        background-color: #fff0f2;
        display: block;
        position: relative;
        text-align: center;
		padding-bottom: 1.5em;
        z-index: 5;
    }
    /* 2. サブタイトル（ご応募の前に必ずお読みください） */
    .rule .rule_subtitle {
        color: #682009;
        font-size: 1.5em;
        font-weight: 500;
        margin: 1em auto 1em;
    }
    /* 3. 白背景のスクロール内枠 */
    .rule_inner {
        font-family: YakuHanRP, "Noto Sans JP", sans-serif;
        font-size: 12px;
        font-weight: 400;
        width: 75%;
        height: 500px;
        overflow-y: scroll;
        margin: auto auto 3em;
        border: solid 2px #682009;
        padding: 1em 0px 1em 1em;
        text-align: left;
        border-radius: 15px;
        background-color: #fff;
    }
    /* 3-a. 内枠専用スクロールバー（全体・つまみ・背景の溝） */
    .rule_inner::-webkit-scrollbar {
        width: 35px;
        height: 100%;
        padding: 0px;
        margin: 0px;
    }
    .rule_inner::-webkit-scrollbar-thumb {
        background-size: 22px;
        background-repeat: no-repeat;
        background-position: center;
        background-image: url("../img/scroll.png");
        height: 2px;
    }
    .rule_inner::-webkit-scrollbar-track {
        background-image: linear-gradient(90deg, #fff 39.5%, #f2a3ad 0, #f2a3ad 60.5%, #fff 0);
        border-radius: 48%;
        margin: 10px 0px;
    }
    /* 4. メインタイトル（キャンペーン名 ＜応募要項＞） */
    .rule .rule_inner h1 {
        font-family: "Noto Sans JP", sans-serif;
        font-size: 12px;
        line-height: 1.2em;
        color: #525252;
        text-align: center;
    }
    .rule_inner h1 {
        text-align: center;
        font-size: 18px;
    }
    /* 5. リード文（森永乳業株式会社（以下、「当社」とします）〜） */
    .rule .rule_inner .text_01 {
        font-weight: 500;
    }
    /* 6. スクロール内の標準pタグ */
    .rule_inner p {
        font-size: 12px;
        line-height: 1.3rem;
    }
    /* 7. ナンバリングリスト（ol）全体 */
    .rule ol {
        font-size: 12px;
        color: #525252;
    }
    .rule_list_frame {
        margin-left: -2em;
    }
    .rule_list_frame ul {
        /*list-style: none;*/
    }
    /* 8. リスト各項目のタイトル（1. 景品・当選者数 など） */
    .list01 {
        line-height: 1em;
        margin-bottom: 1em;
        font-weight: 500 !important;

    }
    /* 8-a. リストタイトルの直下にある説明文pタグ */
    .list01 > p {
        line-height: 1.5em;
        margin-top: 0.5em;
    }
    /* 8-b. 個人情報取扱い内のプライバシーポリシーリンク */
    .list01 > p > a {
        text-align: left;
        text-decoration: none;
        color: #303030;
        margin-left: 0px;
    }
    /* 9. 中に入る箇条書きリスト（ul） */
    .list_in01 {
        display: block;
        line-height: 1.5em;
        padding-top: 0.3em;
        padding-left: 1.7em;
    }
    /* 9-a. コース別強調文字（Aコース、Bコースなど） */
    .list_in01 span {
        font-weight: 500 !important;
    }
    /* 10. 中に入る箇条書き子要素（通常のディスク付き） */
    .li_in_in01 {
        line-height: 1.5em;
        margin-bottom: 0.3em;
        list-style: none;
        position: relative;
        padding-left: 1em;
        margin-left: -1.5em;
    }
    .li_in_in01::before {
  content: "・"; /* ディスクの点 */
  font-size: 2em;
  position: absolute;
  left: 0;
  top: 0;
}
    .li_in_in01 > p {
        margin-top: 0px;
    }

    
    /* 11. 番号付き箇条書き子要素（①、②など、リストマークなし） */
    .li_in_in02 {
        list-style: none;
        line-height: 1.5em;
        margin-left: -0.5em;
        text-indent: -1em;
        margin-bottom: 0.3em;
    }
    .li_in_in02.style_num{
        text-indent: -1em;
    }
    .li_in_in02.style_none{
        text-indent: 0px;
        margin-left: -1.7em;
    }
    /* 12. 推奨環境の大枠（●PC、●スマートフォン） */
    .list_in03 {
        margin-left: -3.5em;
        padding-top: 0.5em;
        margin-bottom: 0.5em;
    }
    /* 13. 推奨環境内のOS枠（Windows、Macなど） */
    .list_in04 {
        margin-left: -2.5em;
        margin-top: 0.5em;
    }
    /* 14. 推奨環境内のブラウザ詳細（Chrome、Safariなど） */
    .list_in_in05 {
        list-style: disc;
        line-height: 1.5em;
        margin-left: 1.5em;
    }
    /* 15. ご応募ボタン（aタグおよびその中のimg） */
    .rule_text {
        display: block;
        width: 48.5%;
        max-width: 363px;
        margin: auto;
    }
    
    .rule .go_btn {
        display: block;
        width: 60.4%;
        margin: auto;
    }
    .rule a img {
        width: 100%;
    }
    /* 16. 下部装飾キャラクター画像 */
    .footer_chara {
        display: block;
        width: 53%;
        max-width: 400px;
        margin: 3% auto -11.5%;
    }

    /* 🌟 リスト内本文のウェイト一括制御（300相当の細さに落とす記述） */
    .rule_inner p,
    .list01 > p,
    .list_in01 p,
    .list_in01,
    .li_in_in01,
    .li_in_in01 p,
    .li_in_in02,
    .list_in_in05 {
        font-weight: 400 !important; /* ※font-weight: 400に統一（値が400になっていた部分を修正） */
    }
}

/* ==========================================================================
   ▼ PC用表示設定（781px以上）
   ========================================================================== */
@media(min-width: 751px){
    /* 1. 最外枠（キャンペーン規約ブロック全体） */
    .rule {
        line-height: 1em;
        padding-top: 30px;
        background-color: #FFF0F2;
    }
    /* 2. サブタイトル（ご応募の前に必ずお読みください） */
    .rule .rule_subtitle {
        color: #682009;
        font-size: 1.3em;
        margin-bottom: 1em;
    }
    /* 3. 白背景のスクロール内枠 */
    .rule_inner {
        font-family: YakuHanRP, "Noto Sans JP", sans-serif;
        width: 584px;
        height: 500px;
        overflow-y: scroll;
        margin: auto;
        border: solid 2px #682009;
        padding: 1em 0em 1em 2em;
        text-align: left;
        border-radius: 20px;
        background-color: #fff;
    }
    /* 3-a. 内枠専用スクロールバー（全体・つまみ・背景の溝） */
    .rule_inner::-webkit-scrollbar {
        width: 45px;
        height: 100%;
        padding: 0px;
        margin: 0px;
    }
    .rule_inner::-webkit-scrollbar-thumb {
        background-size: 25px;
        background-repeat: no-repeat;
        background-position: center;
        background-image: url("../img/scroll.png");
        height: 2px;
    }
    .rule_inner::-webkit-scrollbar-track {
        background-color: #EACAA8;
        background-image: linear-gradient(90deg, #fff 38%, #f2a3ad 0, #f2a3ad 62%, #fff 0);
        border-radius: 48%;
        margin: 10px 0px;
    }
    /* 4. メインタイトル（キャンペーン名 ＜応募要項＞） */
    .rule_inner h1 {
        font-family: "Noto Sans JP", sans-serif;
        text-align: center;
        font-size: 20px;
        color: #525252;
    }
    /* 5. リード文（森永乳業株式会社（以下、「当社」とします）〜） */
    .rule .rule_inner p.text_01 {
        font-weight: 500 !important;
        color: #525252;
    }
    /* 6. スクロール内の標準pタグ */
    .rule p {
        font-size: 16px;
    }
    /* 7. ナンバリングリスト（ol）全体 */
    .rule ol {
        font-size: 16px;
        color: #525252;
    }
    /* 8. リスト各項目のタイトル（1. 景品・当選者数 など） */
    .list01 {
        line-height: 1em;
        margin-bottom: 1em;
        font-weight: 500 !important;
    }
    /* 8-a. リストタイトルの直下にある説明文pタグ */
    .list01 > p {
        line-height: 1.5em;
    }
    /* 8-b. 個人情報取扱い内のプライバシーポリシーリンク */
    .list01 > p > a {
        text-align: left;
        text-decoration: none;
        color: #303030;
        margin-left: 0px;
    }
    /* 9. 中に入る箇条書きリスト（ul） */
    .list_in01 {
        display: block;
        line-height: 1.5em;
        padding-top: 0.3em;
        padding-left: 1.5em;
    }
    /* 9-a. コース別強調文字（Aコース、Bコースなど） */
    .list_in01 span {
        font-weight: 500 !important;
    }
    /* 10. 中に入る箇条書き子要素（通常のディスク付き） */
    .li_in_in01 {
        line-height: 1.5em;
        margin-bottom: 0.3em;
        list-style: disc;
    }
    .li_in_in01 > p {
        margin-top: 0px;
    }
    /* 11. 番号付き箇条書き子要素（①、②など、リストマークなし） */
    .li_in_in02 {
        list-style: none;
        line-height: 1.5em;
        margin-left: -0.5em;
        text-indent: -1em;
        margin-bottom: 0.3em;
    }
    /* 12. 推奨環境の大枠（●PC、●スマートフォン） */
    .list_in03 {
        margin-left: -1.5em;
        padding-top: 0.5em;
        margin-bottom: 0.5em;
    }
    /* 13. 推奨環境内のOS枠（Windows、Macなど） */
    .list_in04 {
        margin-left: -1.5em;
        margin-top: 0.5em;
    }
    /* 14. 推奨環境内のブラウザ詳細（Chrome、Safariなど） */
    .list_in_in05 {
        list-style: disc;
        line-height: 1.5em;
        margin-left: 1.5em;
    }

    /* 🌟 リスト内本文のウェイト一括制御（300相当の細さに落とす記述） */
    .rule_inner p,
    .list01 > p,
    .list_in01 p,
    .list_in01,
    .li_in_in01,
    .li_in_in01 p,
    .li_in_in02,
    .list_in_in05 {
        font-weight: 400 !important; /* ※font-weight: 400に統一（値が400になっていた部分を修正） */
    }
}