/*
    properties.css

    This file is the "jewelryreformdotnet" properties css.
    繝��繝槭€桂ewelryreformdotnet縲阪�css繝励Ο繝代ユ繧｣��css螟画焚�峨ヵ繧｡繧､繝ｫ

    [CSS List]
    0.reset.css: The new CSS reset - version 1.8.2 (last updated 23.12.2022)
    1.properties.css: A CSS file containing only custom properties.
    2.base.css: A CSS file that describes the specifications of the entire site.
    3.common.css: A CSS file specifies common styles within your site, including headers and footers.
    4.front-page.css: This CSS file specifies styles for the front page only.

*/


/* TABLE OF CONTENTS 荳€隕ｧ陦ｨ
------------------------------------------------------------
* color 濶ｲ
* site 繧ｵ繧､繝亥�菴�
* header 繝倥ャ繝€繝ｼ
* footer 繝輔ャ繧ｿ繝ｼ
------------------------------------------------------------ */

:root {
    /* color 濶ｲ */
    --base-color: #ffffff;
    --primary-color: #1a1311;
    --secondary-color: #eeebe3;
    --tertiary-color: #474545;
    --line-color: #8d89dd;
    --secondary-line-color: #bbbbbb;
    --sp-accent-color: #5e5e5e;

    /* site 繧ｵ繧､繝亥�菴� */
    --site-wide-maxwidth: 81.25rem; /* 1300px */
    --site-narrow-maxwidth: 75.0rem; /* 1200px */

    /* header 繝倥ャ繝€繝ｼ */
    --header-primary-color: var(--primary-color);
    --header-secondary-color: var(--line-color);
    --header-primary-bgcolor: var(--base-color);
    --header-secondary-bgcolor: var(--secondary-color);
    /* --header-innerheight: jQuery縺ｧ蜿門ｾ励☆繧� */
    --header-horipadding: 1.875rem;
    --header-toppadding: 1.5rem;
    --header-btmpadding: 1.0rem;
    --header-height: calc( var(--header-innerheight) + var(--header-toppadding) );
    /* --header-nav-menuList-mainItem-height: jQuery縺ｧ蜿門ｾ励☆繧� */
    --header-nav-menuList-child-marginTop: calc( (var(--header-innerheight) - var(--header-nav-menuList-mainItem-height)) / 2 + var(--header-btmpadding) + 1px );

    /* footer 繝輔ャ繧ｿ繝ｼ */
    --footer-primary-color: var(--base-color);
    --footer-primary-bgcolor: var(--primary-color);
    /* --footer-horipadding: 2.5rem; */
    --footer-toppadding: 5.0rem;
    --footer-btmpadding: 2.5rem;
    --footer-lower-topmargin: 5.0rem;
}

@media screen and (max-width:1300px) {

    :root {
        /* header 繝倥ャ繝€繝ｼ */
        /* --header-nav-left: clamp(20.25rem, -14.25rem + 46vw, 23.125rem); */
    }

}


@media screen and (max-width:1200px) {

    :root {
        /* header 繝倥ャ繝€繝ｼ */
        --header-horipadding: clamp(0.75rem, -1.25rem + 4.1667vw, 1.875rem);
        --header-toppadding: clamp(0.75rem, -0.5833rem + 2.7778vw, 1.5rem);
        --header-btmpadding: clamp(0.75rem, 0.3056rem + 0.9259vw, 1rem);
    }

}

@media screen and (max-width:899px) {

    :root{
        /* footer 繝輔ャ繧ｿ繝ｼ */
        --footer-toppadding: 3.0rem;
    }

}

@media screen and (max-width: 767px) {

    :root{
        /* header 繝倥ャ繝€繝ｼ */
        --header-primary-color: var(--sp-accent-color);
        --header-toppadding: 0.75rem;
        --header-horipadding: 2.5vw;
    }

}

@media screen and (max-width: 599px) {

    :root{
        /* header 繝倥ャ繝€繝ｼ */
    }

}