@charset "utf-8";

    /*======================================================================
     * 各種定義
    =====================================================================*/
    :root {
        /*色*/
        --himeji-primary-color: #2d3748;
        --himeji-primary-color-light: #3f4d66;
        --himeji-secondary-color: #e6f3ff;
        --himeji-secondary-color-light: #fff;
        --himeji-accent-color: #3182ce;
        --himeji-accent-color-light: #5393cf;
        --himeji-on-primary-color: #fff;
        --himeji-on-primary-color-light: #fff;
        --himeji-on-secondary-color: #000;
        --himeji-on-secondary-color-light: #000;
        --himeji-on-accent-color: #fff;
        --himeji-on-accent-color-light: #fff;
        --himeji-background-color: #fff;
        --himeji-background-color-hover: #e6f3ff;
        --himeji-on-background-color-hover: #000;
        --himeji-cancel-color: #dc143c;
        --himeji-on-cancel-color: #fff;

        /*文字サイズ*/
        --himeji-fontsize-maintitle: clamp(1rem, 5.7vw, 2rem);
        --himeji-fontsize-subtitle: 1.5rem;
        --himeji-fontsize-normal: 1rem;

        /*要素のサイズ*/
        --himeji-button-height: 3rem;
    }

    /*モバイル用の定義*/
    @media (max-width: 767px) {
        :root {
            /*文字サイズ*/
            --himeji-fontsize-subtitle: 1.2rem;

            /*要素のサイズ*/
            --himeji-button-height: 3rem;
        }
    }