@charset "UTF-8";

/* ===============================================================
   basicpolicy.css
   採用活動におけるハラスメント防止のための基本方針（/basicpolicy/）
   設置先: /wp-content/themes/universe_recruit_2025/css/page/basicpolicy.css
   ---------------------------------------------------------------
   ■ 単位の方針（テーマ既存の history ページと同じ）
     ・PC … font-size は px
             （rem だと 1100px 前後の幅で本文が 9px 程度まで縮むため）
     ・SP … font-size / 余白とも rem（1rem = 10px / 375基準）
     ・ページ外周の余白のみ rem（他の下層ページと縦リズムを揃える）
   ■ カラー
     ・キーカラー #E8380D ／ 文字 #000 ／ 罫線 #b5b5b5
   ■ フォント
     ・和文見出し・本文 'Zen Kaku Gothic New' ／ 英数字 'Lato'
   =============================================================== */

#page-basicpolicy {
    position: relative;
    z-index: 2;
    margin-top: 13rem;
    margin-bottom: 20rem;

    @media screen and (max-width: 767px) {
        margin-top: 0;
        margin-bottom: 12rem;
    }

    /* 文章ページなので全要素を左寄せに統一 */
    .wrapper {
        position: relative;
        z-index: 2;
        text-align: left;
    }

    /* -----------------------------------------------------------
       ページ見出し（h2）
       ----------------------------------------------------------- */
    .policy-head {
        padding-bottom: 30px;
        border-bottom: 1px solid #b5b5b5;

        @media screen and (max-width: 767px) {
            padding-bottom: 2rem;
        }
    }

    .policy-company {
        font-family: 'Zen Kaku Gothic New';
        font-weight: 500;
        font-size: 15px;
        line-height: 24px;
        letter-spacing: 0.1em;
        text-align: left;
        color: #E8380D;

        @media screen and (max-width: 767px) {
            font-size: 1.2rem;
            line-height: 2rem;
        }
    }

    .policy-title {
        margin-top: 12px;
        font-family: 'Zen Kaku Gothic New';
        font-weight: 700;
        font-size: 30px;
        line-height: 46px;
        letter-spacing: 0.08em;
        text-align: left;
        color: #000;

        @media screen and (max-width: 767px) {
            margin-top: 1rem;
            font-size: 2rem;
            line-height: 3.2rem;
        }
    }

    /* -----------------------------------------------------------
       本文エリア
       ----------------------------------------------------------- */
    .policy-body {
        margin-top: 50px;
        font-family: 'Zen Kaku Gothic New';
        font-weight: 500;
        font-size: 16px;
        line-height: 32px;
        letter-spacing: 0.08em;
        text-align: left;
        color: #000;

        @media screen and (max-width: 767px) {
            margin-top: 3rem;
            font-size: 1.4rem;
            line-height: 2.6rem;
        }

        & p {
            text-align: left;
        }

        & p + p {
            margin-top: 20px;

            @media screen and (max-width: 767px) {
                margin-top: 1.6rem;
            }
        }

        /* テーマの a{display:inline-block} を打ち消して行内で折り返させる */
        & a {
            display: inline;
            color: #E8380D;
            text-decoration: underline;

            @media (hover: hover) and (pointer: fine) {
                &:hover {
                    text-decoration: none;
                }
            }
        }
    }

    /* リード文：ほんの少しだけ大きく */
    .policy-lead {
        font-size: 17px;
        line-height: 34px;

        @media screen and (max-width: 767px) {
            font-size: 1.5rem;
            line-height: 2.8rem;
        }
    }

    /* ※注記：ぶら下げインデント＋やや小さめ・弱め */
    .policy-note {
        margin-top: 20px;
        padding-left: 1em;
        text-indent: -1em;
        font-size: 14px;
        line-height: 26px;
        color: #555;

        @media screen and (max-width: 767px) {
            margin-top: 1.6rem;
            font-size: 1.2rem;
            line-height: 2.2rem;
        }
    }

    /* -----------------------------------------------------------
       条項セクション
       ----------------------------------------------------------- */
    .policy-section {
        margin-top: 56px;

        @media screen and (max-width: 767px) {
            margin-top: 3.6rem;
        }
    }

    /* 見出し h3：左に細い縦罫のみのシンプルな強調 */
    .policy-heading {
        margin-bottom: 18px;
        padding-left: 16px;
        border-left: 3px solid #E8380D;
        font-family: 'Zen Kaku Gothic New';
        font-weight: 700;
        font-size: 21px;
        line-height: 32px;
        letter-spacing: 0.08em;
        text-align: left;
        color: #000;

        @media screen and (max-width: 767px) {
            margin-bottom: 1.2rem;
            padding-left: 1.2rem;
            border-left-width: 2px;
            font-size: 1.7rem;
            line-height: 2.8rem;
        }

        .num {
            display: inline-block;
            margin-right: 6px;
            font-family: 'Lato';
            font-weight: 700;
            color: #E8380D;

            @media screen and (max-width: 767px) {
                margin-right: 0.5rem;
            }
        }
    }

    /* 見出し h4：太字のみ（罫線なし） */
    .policy-contact-title {
        font-family: 'Zen Kaku Gothic New';
        font-weight: 700;
        font-size: 18px;
        line-height: 28px;
        letter-spacing: 0.08em;
        text-align: left;
        color: #000;

        @media screen and (max-width: 767px) {
            font-size: 1.5rem;
            line-height: 2.4rem;
        }
    }

    /* -----------------------------------------------------------
       箇条書き
       ※テーマの reset で ul{list-style:none} のため ・ を擬似要素で付与
       ----------------------------------------------------------- */
    .policy-list {
        margin-top: 16px;

        @media screen and (max-width: 767px) {
            margin-top: 1.2rem;
        }

        & li {
            position: relative;
            padding-left: 1.5em;
            text-align: left;

            &::before {
                content: "・";
                position: absolute;
                top: 0;
                left: 0.1em;
                color: #E8380D;
            }
        }

        & li + li {
            margin-top: 6px;

            @media screen and (max-width: 767px) {
                margin-top: 0.6rem;
            }
        }
    }

    /* -----------------------------------------------------------
       相談窓口ボックス
       ----------------------------------------------------------- */
    .policy-contact {
        margin-top: 34px;
        padding: 32px 36px;
        background-color: #fff;
        border: 1px solid #E8380D;
        border-radius: 20px;

        @media screen and (max-width: 767px) {
            margin-top: 2.4rem;
            padding: 2rem 1.8rem;
            border-radius: 1.2rem;
        }
    }

    .policy-dl {
        display: grid;
        grid-template-columns: 110px 1fr;
        gap: 10px 0;
        margin-top: 20px;
        text-align: left;

        @media screen and (max-width: 767px) {
            grid-template-columns: 1fr;
            gap: 0;
            margin-top: 1.6rem;
        }

        & dt {
            font-weight: 700;
            text-align: left;

            @media screen and (max-width: 767px) {
                margin-top: 1.2rem;
                font-size: 1.2rem;
                color: #E8380D;
            }
        }

        & dt:first-of-type {
            @media screen and (max-width: 767px) {
                margin-top: 0;
            }
        }

        & dd {
            text-align: left;
        }

        .hours {
            display: inline-block;
            font-size: 14px;

            @media screen and (max-width: 767px) {
                display: block;
                font-size: 1.2rem;
            }
        }
    }
}