/* global variables */

:root {
    --fontsize: calc(0.3125rem + ((1vw - 3.6px) * 0.4965));
}

:root {
    /* add fluid rem function */
    font-size: max(37.5%, min(var(--fontsize), 62.5%));
    /* RWD */
    --media-tablet: (min-width: 992px);
    --media-pc: (min-width: 1300px);
    --global-width: min(calc(320px + ((1vw - 3.6px) * 100)), 129.7rem);
    /* --global-width--small: min(calc(320px + ((1vw - 3.6px) * 88)), 80.8rem); */
    /*small

    /* colors */
    --color-white: #fff;
    --color-black: #000;
    --color-002336: #002336;
    --color-E5E5E5: #E5E5E5;
    --color-FBF8F2: #FBF8F2;
    --color-D0D0D0: #D0D0D0;
    --color-535A5E: #535A5E;
    --color-6D6D6D: #6D6D6D;
    --color-CCD3D7: #CCD3D7;
    --color-EBEBEB: #EBEBEB;
    --color-FF5A00: #FF5A00;
    --color-1A394A: #1A394A;
    --color-334F5E: #334F5E;
    --color-7C7C7C: #7C7C7C;
    --color-868E96: #868E96;
    --color-8B8B8B: #8B8B8B;
    --color-FC6A4A: #FC6A4A;
    --color-231F20: #231F20;


    /* fonts */
    --font-family-main: "Inter", sans-serif;
    --font-size-13: max(13px, 1.3rem);
    --font-size-15: max(15px, 1.5rem);
    --font-size-16: max(15px, 1.6rem);
    --font-size-17: max(16px, 1.7rem);
    --font-size-18: max(16px, 1.8rem);
    --font-size-20: max(18px, 2rem);
    --font-size-22: max(20px, 2.2rem);
    --font-size-24: max(22px, 2.4rem);
    --font-size-28: max(24px, 2.8rem);
    --font-size-38: max(30px, 3.8rem);
    --font-size-42: max(33px, 4.2rem);
    --font-size-50: max(36px, 5rem);
    --font-size-64: max(38px, 6.4rem);
    --font-size-80: max(40px, 8rem);
    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    /* effects */
    --transition-duration: 0.3s;
    --transition-timing_function: ease;
    /* mr_menu */
    --mr_menu-hover_in_timeout: 100;
    --mr_menu-hover_out_timeout: 350;
    --mr_menu-menu-transition-property: opacity;
    --mr_menu-menu-transition-property-closed_value: 0;
    --mr_menu-menu-transition-property-open_value: 1;
    --mr_menu-submenu-transition-property: opacity;
    --mr_menu-submenu-transition-property-closed_value: 0;
    --mr_menu-submenu-transition-property-open_value: 1;
    --mr_menu-menu-icon-open: "☰";
    --mr_menu-menu-icon-close: "×";
    --mr_menu-submenu-icon-open: "☰";
    --mr_menu-submenu-icon-close: "×";
}

@media(min-width: 2048px) {
    :root {
        font-size: 85%;
    }
}

@media(min-width: 3840px) {
    :root {
        font-size: 140%;
    }
}