*,:after,:before {
box-sizing: inherit
}
body,html {
background: var(--color-page);
color: var(--color-text-dark);
font-family: var(--font-family-sans);
font-size: 16px;
line-height: 1.5;
scroll-behavior: smooth;
scroll-padding-block-start: 80px;
}
a {
color: var(--color-text-dark)
}
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* 蝓ｺ貅悶せ繧ｿ繧､繝ｫ縺ｮ險ｭ螳� */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
:root {
--base-padding: 20px;
--border-color-regular: rgba(0, 0, 0, 0.08);
--text-color-extra-light: rgba(0, 0, 0, 0.2);
--text-color-light: rgba(0, 0, 0, 0.4);
--text-color-medium: rgba(0, 0, 0, 0.6);
--text-color-dark: rgba(17, 17, 17, 1);
--text-color-regular: rgba(4, 4, 4, 1);
--spacing-xs: 20px;
--spacing-s: 40px;
--spacing-m: 40px;
--spacing-l: 60px;
--spacing-xl: 60px
--z-index-popup: 500;
--z-index-mobile-nav: 200;
--z-index-header: 100;
--typography-serif-1000-regular-letter-spacing: -0.025em;
--typography-serif-1000-regular-font-weight: 400;
--typography-serif-1000-regular-line-height: 1.0684931506849316;
--typography-serif-1000-regular-font-size: 4.5625rem;
--typography-serif-900-regular-letter-spacing: -0.02em;
--typography-serif-900-regular-font-weight: 400;
--typography-serif-900-regular-line-height: 1.0833333333333333;
--typography-serif-900-regular-font-size: 3.75rem;
--typography-serif-800-regular-letter-spacing: -0.02em;
--typography-serif-800-regular-font-weight: 400;
--typography-serif-800-regular-line-height: 1.14;
--typography-serif-800-regular-font-size: 3.125rem;
--typography-serif-700-regular-letter-spacing: -0.015em;
--typography-serif-700-regular-font-weight: 400;
--typography-serif-700-regular-line-height: 1.1627906976744187;
--typography-serif-700-regular-font-size: 2.6875rem;
--typography-serif-600-regular-letter-spacing: -0.01em;
--typography-serif-600-regular-font-weight: 400;
--typography-serif-600-regular-line-height: 1.1764705882352942;
--typography-serif-600-regular-font-size: 2.125rem;
--typography-serif-500-regular-letter-spacing: -0.01em;
--typography-serif-500-regular-font-weight: 400;
--typography-serif-500-regular-line-height: 1.1333333333333333;
--typography-serif-500-regular-font-size: 1.875rem;
--typography-serif-400-regular-letter-spacing: -0.005em;
--typography-serif-400-regular-font-weight: 400;
--typography-serif-400-regular-line-height: 1.2083333333333333;
--typography-serif-400-regular-font-size: 1.5rem;
--typography-serif-350-regular-font-weight: 400;
--typography-serif-350-regular-line-height: 1.6;
--typography-serif-350-regular-font-size: 1.25rem;
--typography-serif-300-regular-font-weight: 400;
--typography-serif-300-regular-line-height: 1.3888888888888888;
--typography-serif-300-regular-font-size: 1.125rem;
--typography-serif-200-regular-font-weight: 400;
--typography-serif-200-regular-line-height: 1.5;
--typography-serif-200-regular-font-size: 1rem;
--typography-sans-1000-bold-letter-spacing: -0.0335em;
--typography-sans-1000-bold-font-weight-variable: 672;
--typography-sans-1000-bold-font-weight: 700;
--typography-sans-1000-bold-line-height: 1.0196078431372548;
--typography-sans-1000-bold-font-size: 4.78125rem;
--typography-sans-900-bold-letter-spacing: -0.0315em;
--typography-sans-900-bold-font-weight-variable: 671;
--typography-sans-900-bold-font-weight: 700;
--typography-sans-900-semibold-letter-spacing: -0.0315em;
--typography-sans-900-semibold-font-weight-variable: 620;
--typography-sans-900-semibold-font-weight: 600;
--typography-sans-900-semibold-line-height: 1.0655737704918034;
--typography-sans-900-semibold-font-size: 3.8125rem;
--typography-sans-800-bold-letter-spacing: -0.0307em;
--typography-sans-800-bold-font-weight-variable: 669;
--typography-sans-800-bold-font-weight: 700;
--typography-sans-800-semibold-letter-spacing: -0.0282em;
--typography-sans-800-semibold-font-weight-variable: 620;
--typography-sans-800-semibold-font-weight: 600;
--typography-sans-800-semibold-line-height: 1.0943396226415094;
--typography-sans-800-semibold-font-size: 3.3125rem;
--typography-sans-700-bold-letter-spacing: -0.0269em;
--typography-sans-700-bold-font-weight-variable: 669;
--typography-sans-700-bold-font-weight: 700;
--typography-sans-700-semibold-letter-spacing: -0.0272em;
--typography-sans-700-semibold-font-weight-variable: 628;
--typography-sans-700-semibold-font-weight: 600;
--typography-sans-700-semibold-line-height: 1.0888888888888888;
--typography-sans-700-semibold-font-size: 2.8125rem;
--typography-sans-600-bold-letter-spacing: -0.0236em;
--typography-sans-600-bold-font-weight-variable: 669;
--typography-sans-600-bold-font-weight: 700;
--typography-sans-600-semibold-letter-spacing: -0.0224em;
--typography-sans-600-semibold-font-weight-variable: 620;
--typography-sans-600-semibold-font-weight: 600;
--typography-sans-600-semibold-line-height: 1.1111111111111112;
--typography-sans-600-semibold-font-size: 2.25rem;
--typography-sans-500-bold-letter-spacing: -0.0208em;
--typography-sans-500-bold-font-weight-variable: 667;
--typography-sans-500-bold-font-weight: 700;
--typography-sans-500-semibold-letter-spacing: -0.022em;
--typography-sans-500-semibold-font-weight-variable: 620;
--typography-sans-500-semibold-font-weight: 600;
--typography-sans-500-semibold-line-height: 1.1333333333333333;
--typography-sans-500-semibold-font-size: 1.875rem;
--typography-sans-400-bold-letter-spacing: -0.0168em;
--typography-sans-400-bold-font-weight-variable: 666;
--typography-sans-400-bold-font-weight: 700;
--typography-sans-400-semibold-letter-spacing: -0.0185em;
--typography-sans-400-semibold-font-weight-variable: 618;
--typography-sans-400-semibold-font-weight: 600;
--typography-sans-400-medium-letter-spacing: -0.0175em;
--typography-sans-400-medium-font-weight-variable: 525;
--typography-sans-400-medium-font-weight: 500;
--typography-sans-400-regular-letter-spacing: -0.014em;
--typography-sans-400-regular-font-weight-variable: 428;
--typography-sans-400-regular-font-weight: 400;
--typography-sans-400-regular-line-height: 1.25;
--typography-sans-400-regular-font-size: 1.5rem;
--typography-sans-300-bold-letter-spacing: -0.0072em;
--typography-sans-300-bold-font-weight-variable: 666;
--typography-sans-300-bold-font-weight: 700;
--typography-sans-300-semibold-letter-spacing: -0.0079em;
--typography-sans-300-semibold-font-weight-variable: 605;
--typography-sans-300-semibold-font-weight: 600;
--typography-sans-300-medium-letter-spacing: -0.0075em;
--typography-sans-300-medium-font-weight-variable: 529;
--typography-sans-300-medium-font-weight: 500;
--typography-sans-300-regular-letter-spacing: -0.0085em;
--typography-sans-300-regular-font-weight-variable: 448;
--typography-sans-300-regular-font-weight: 400;
--typography-sans-300-regular-line-height: 1.3333333333333333;
--typography-sans-300-regular-font-size: 1.125rem;
--typography-sans-200-bold-letter-spacing: -0.001em;
--typography-sans-200-bold-font-weight-variable: 664;
--typography-sans-200-bold-font-weight: 700;
--typography-sans-200-semibold-letter-spacing: -0.00075em;
--typography-sans-200-semibold-font-weight-variable: 616;
--typography-sans-200-semibold-font-weight: 600;
--typography-sans-200-medium-letter-spacing: -0.0015em;
--typography-sans-200-medium-font-weight-variable: 533;
--typography-sans-200-medium-font-weight: 500;
--typography-sans-200-regular-letter-spacing: 0.0005em;
--typography-sans-200-regular-font-weight-variable: 450;
--typography-sans-200-regular-font-weight: 400;
--typography-sans-200-regular-line-height: 1.4375;
--typography-sans-200-regular-font-size: 1rem;
--typography-sans-150-bold-letter-spacing: 0.0013em;
--typography-sans-150-bold-font-weight-variable: 662;
--typography-sans-150-bold-font-weight: 700;
--typography-sans-150-semibold-letter-spacing: 0.0025em;
--typography-sans-150-semibold-font-weight-variable: 615;
--typography-sans-150-semibold-font-weight: 600;
--typography-sans-150-medium-letter-spacing: 0.0015em;
--typography-sans-150-medium-font-weight-variable: 533;
--typography-sans-150-medium-font-weight: 500;
--typography-sans-150-regular-letter-spacing: 0.0009em;
--typography-sans-150-regular-font-weight-variable: 455;
--typography-sans-150-regular-font-weight: 400;
--typography-sans-150-regular-line-height: 1.4666666666666666;
--typography-sans-150-regular-font-size: 0.9375rem;
--typography-sans-100-bold-letter-spacing: 0.0045em;
--typography-sans-100-bold-font-weight-variable: 661;
--typography-sans-100-bold-font-weight: 700;
--typography-sans-100-semibold-letter-spacing: 0.0037em;
--typography-sans-100-semibold-font-weight-variable: 619;
--typography-sans-100-semibold-font-weight: 600;
--typography-sans-100-medium-letter-spacing: 0.0035em;
--typography-sans-100-medium-font-weight-variable: 554;
--typography-sans-100-medium-font-weight: 500;
--typography-sans-100-regular-letter-spacing: 0.0075em;
--typography-sans-100-regular-font-weight-variable: 456;
--typography-sans-100-regular-font-weight: 400;
--typography-sans-100-regular-line-height: 1.4074074074074074;
--typography-sans-100-regular-font-size: 0.84375rem;
--typography-sans-50-bold-letter-spacing: 0.0071em;
--typography-sans-50-bold-font-weight-variable: 660;
--typography-sans-50-bold-font-weight: 700;
--typography-sans-50-semibold-letter-spacing: 0.0072em;
--typography-sans-50-semibold-font-weight-variable: 619;
--typography-sans-50-semibold-font-weight: 600;
--typography-sans-50-medium-letter-spacing: 0.0074em;
--typography-sans-50-medium-font-weight-variable: 556;
--typography-sans-50-medium-font-weight: 500;
--typography-sans-50-regular-letter-spacing: 0.0078em;
--typography-sans-50-regular-font-weight-variable: 459;
--typography-sans-50-regular-font-weight: 400;
--typography-sans-50-regular-line-height: 1.4166666666666667;
--typography-sans-50-regular-font-size: 0.75rem;
--shadow-filter: 0 4px 18px rgba(0,0,0,.3);
--shadow-level-300: 0px 36px 89px rgb(0 0 0/4%),0px 23.3333px 52.1227px rgba(0,0,0,.03),0px 13.8667px 28.3481px rgba(0,0,0,.024),0px 7.2px 14.4625px rgb(0 0 0/2%),0px 2.93333px 7.25185px rgba(0,0,0,.016),0px 0.666667px 3.50231px rgba(0,0,0,.01);
--shadow-level-200: 0px 4px 18px rgb(0 0 0/4%),0px 2.025px 7.84688px rgba(0,0,0,.027),0px 0.8px 2.925px rgb(0 0 0/2%),0px 0.175px 1.04062px rgba(0,0,0,.013);
--shadow-level-100: 0px 3px 9px rgb(0 0 0/3%),0px 0.7px 1.4625px rgba(0,0,0,.015);
--font-family-emoji: "Apple Color Emoji","Segoe UI Emoji",NotoColorEmoji,"Noto Color Emoji","Segoe UI Symbol","Android Emoji",EmojiSymbols;
--font-family-mono: iawriter-mono,Nitti,Menlo,Courier,monospace;
--font-family-handwriting: permanent-marker,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,"Apple Color Emoji",Arial,sans-serif,"Segoe UI Emoji","Segoe UI Symbol";
--font-family-serif: Lyon-Text,Georgia,YuMincho,"Yu Mincho","Hiragino Mincho ProN","Hiragino Mincho Pro","Songti TC","Songti SC","SimSun","Nanum Myeongjo",NanumMyeongjo,Batang,serif;
--font-family-sans: inter-var,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,"Apple Color Emoji",Arial,sans-serif,"Segoe UI Emoji","Segoe UI Symbol";
--color-alpha-dark-200: hsla(0,0%,100%,.18);
--color-alpha-dark-100: hsla(0,0%,100%,.15);
--color-alpha-light-200: rgba(0,0,0,.06);
--color-alpha-light-100: rgba(0,0,0,.03);
--color-legacy-cream-darkest: #f1ede9;
--color-legacy-light: #fff;
--color-legacy-white: #fff;
--color-black-900: #000;
--color-black-800: #1a1a1a;
--color-black-700: #333;
--color-black-600: #4d4d4d;
--color-black-500: #666;
--color-black-400: grey;
--color-black-300: #999;
--color-black-200: #bfbfbf;
--color-black-100: #e6e6e6;
--color-dark-600: #000;
--color-dark-500: #1a1a1a;
--color-dark-400: #a6a6a6;
--color-dark-300: hsla(0,0%,100%,.2);
--color-dark-200: #fff;
--color-purple-900: #562772;
--color-purple-800: #6e239a;
--color-purple-700: #8029b3;
--color-purple-600: #8f2dc8;
--color-purple-500: #9d34da;
--color-purple-400: #bd73e8;
--color-purple-300: #cb87f2;
--color-purple-200: #d59ef5;
--color-purple-100: #f0e1f9;
--color-blue-900: #004f80;
--color-blue-800: #076097;
--color-blue-700: #086faf;
--color-blue-600: #097cc3;
--color-blue-500: #0a85d1;
--color-blue-400: #4a98c9;
--color-blue-300: #57b5ef;
--color-blue-200: #8accf4;
--color-blue-100: #e2ecf3;
--color-teal-900: #1e716e;
--color-teal-800: #207976;
--color-teal-700: #238582;
--color-teal-600: #27918d;
--color-teal-500: #2a9d99;
--color-teal-400: #6cc1be;
--color-teal-300: #93cccb;
--color-teal-200: #a8d6d5;
--color-teal-100: #e3f2f2;
--color-yellow-900: #960;
--color-yellow-800: #d68f00;
--color-yellow-700: #f5a300;
--color-yellow-600: #faa700;
--color-yellow-500: #fb3;
--color-yellow-400: #f0c266;
--color-yellow-300: #ffe175;
--color-yellow-200: #ffeca8;
--color-yellow-100: #fff6d6;
--color-orange-900: #a3450a;
--color-orange-800: #e75e08;
--color-orange-700: #f16209;
--color-orange-600: #f8701b;
--color-orange-500: #f8792a;
--color-orange-400: #f28e50;
--color-orange-300: #f5a675;
--color-orange-200: #f7bc97;
--color-orange-100: #fce7d9;
--color-red-900: #7d1e17;
--color-red-800: #a7271b;
--color-red-700: #d73223;
--color-red-600: #e14133;
--color-red-500: #ea4e43;
--color-red-400: #e1645b;
--color-red-300: #ff8080;
--color-red-200: #ffa8a8;
--color-red-100: #fce9e8;
--color-base-800: #121212;
--color-base-780: #333;
--color-base-760: #404040;
--color-base-400: hsla(0,0%,100%,.4);
--color-base-300: #fffdfa;
--color-base-250: #f1efee;
--color-base-200: #f6f5f4;
--color-base-140: #fafafa;
--color-base-120: #fcfcfc;
--color-base-100: #fff;
--color-gray-800: #050505;
--color-gray-600: #121212;
--color-gray-500: rgba(0,0,0,.6);
--color-gray-400: rgba(0,0,0,.4);
--color-gray-300: rgba(0,0,0,.2);
--color-gray-200: rgba(0,0,0,.1);
--border-radius-700: 0.75rem;
--border-radius-500: 0.5rem;
--border-radius-400: 0.375rem;
--border-radius-300: 0.3125rem;
--border-radius-200: 0.25rem;
--z-index-tooltip: 500;
--z-index-lightbox: 500;
--typography-serif-1000-regular-font-family: var(--font-family-serif);
--typography-serif-900-regular-font-family: var(--font-family-serif);
--typography-serif-800-regular-font-family: var(--font-family-serif);
--typography-serif-700-regular-font-family: var(--font-family-serif);
--typography-serif-600-regular-font-family: var(--font-family-serif);
--typography-serif-500-regular-font-family: var(--font-family-serif);
--typography-serif-400-regular-font-family: var(--font-family-serif);
--typography-serif-350-regular-font-family: var(--font-family-serif);
--typography-serif-300-regular-font-family: var(--font-family-serif);
--typography-serif-200-regular-font-family: var(--font-family-serif);
--typography-sans-1000-bold-font-family: var(--font-family-sans);
--typography-sans-900-bold-line-height: 1.0655737704918034;
--typography-sans-900-bold-font-size: var(--typography-sans-900-semibold-font-size );
--typography-sans-900-bold-font-family: var(--font-family-sans);
--typography-sans-900-semibold-font-family: var(--font-family-sans);
--typography-sans-800-bold-line-height: 1.0943396226415094;
--typography-sans-800-bold-font-size: var(--typography-sans-800-semibold-font-size );
--typography-sans-800-bold-font-family: var(--font-family-sans);
--typography-sans-800-semibold-font-family: var(--font-family-sans);
--typography-sans-700-bold-line-height: 1.0888888888888888;
--typography-sans-700-bold-font-size: var(--typography-sans-700-semibold-font-size );
--typography-sans-700-bold-font-family: var(--font-family-sans);
--typography-sans-700-semibold-font-family: var(--font-family-sans);
--typography-sans-600-bold-line-height: 1.1111111111111112;
--typography-sans-600-bold-font-size: var(--typography-sans-600-semibold-font-size );
--typography-sans-600-bold-font-family: var(--font-family-sans);
--typography-sans-600-semibold-font-family: var(--font-family-sans);
--typography-sans-500-bold-line-height: 1.1333333333333333;
--typography-sans-500-bold-font-size: var(--typography-sans-500-semibold-font-size );
--typography-sans-500-bold-font-family: var(--font-family-sans);
--typography-sans-500-semibold-font-family: var(--font-family-sans);
--typography-sans-400-bold-line-height: 1.25;
--typography-sans-400-bold-font-size: var(--typography-sans-400-regular-font-size );
--typography-sans-400-bold-font-family: var(--font-family-sans);
--typography-sans-400-semibold-line-height: 1.25;
--typography-sans-400-semibold-font-size: var(--typography-sans-400-regular-font-size );
--typography-sans-400-semibold-font-family: var(--font-family-sans);
--typography-sans-400-medium-line-height: 1.25;
--typography-sans-400-medium-font-size: var(--typography-sans-400-regular-font-size );
--typography-sans-400-medium-font-family: var(--font-family-sans);
--typography-sans-400-regular-font-family: var(--font-family-sans);
--typography-sans-300-bold-line-height: 1.3333333333333333;
--typography-sans-300-bold-font-size: var(--typography-sans-300-regular-font-size );
--typography-sans-300-bold-font-family: var(--font-family-sans);
--typography-sans-300-semibold-line-height: 1.3333333333333333;
--typography-sans-300-semibold-font-size: var(--typography-sans-300-regular-font-size );
--typography-sans-300-semibold-font-family: var(--font-family-sans);
--typography-sans-300-medium-line-height: 1.3333333333333333;
--typography-sans-300-medium-font-size: var(--typography-sans-300-regular-font-size );
--typography-sans-300-medium-font-family: var(--font-family-sans);
--typography-sans-300-regular-font-family: var(--font-family-sans);
--typography-sans-200-bold-line-height: 1.4375;
--typography-sans-200-bold-font-size: var(--typography-sans-200-regular-font-size );
--typography-sans-200-bold-font-family: var(--font-family-sans);
--typography-sans-200-semibold-line-height: 1.4375;
--typography-sans-200-semibold-font-size: var(--typography-sans-200-regular-font-size );
--typography-sans-200-semibold-font-family: var(--font-family-sans);
--typography-sans-200-medium-line-height: 1.4375;
--typography-sans-200-medium-font-size: var(--typography-sans-200-regular-font-size );
--typography-sans-200-medium-font-family: var(--font-family-sans);
--typography-sans-200-regular-font-family: var(--font-family-sans);
--typography-sans-150-bold-line-height: 1.4666666666666666;
--typography-sans-150-bold-font-size: var(--typography-sans-150-regular-font-size );
--typography-sans-150-bold-font-family: var(--font-family-sans);
--typography-sans-150-semibold-line-height: 1.4666666666666666;
--typography-sans-150-semibold-font-size: var(--typography-sans-150-regular-font-size );
--typography-sans-150-semibold-font-family: var(--font-family-sans);
--typography-sans-150-medium-line-height: 1.4666666666666666;
--typography-sans-150-medium-font-size: var(--typography-sans-150-regular-font-size );
--typography-sans-150-medium-font-family: var(--font-family-sans);
--typography-sans-150-regular-font-family: var(--font-family-sans);
--typography-sans-100-bold-line-height: 1.4074074074074074;
--typography-sans-100-bold-font-size: var(--typography-sans-100-regular-font-size );
--typography-sans-100-bold-font-family: var(--font-family-sans);
--typography-sans-100-semibold-line-height: 1.4074074074074074;
--typography-sans-100-semibold-font-size: var(--typography-sans-100-regular-font-size );
--typography-sans-100-semibold-font-family: var(--font-family-sans);
--typography-sans-100-medium-line-height: 1.4074074074074074;
--typography-sans-100-medium-font-size: var(--typography-sans-100-regular-font-size );
--typography-sans-100-medium-font-family: var(--font-family-sans);
--typography-sans-100-regular-font-family: var(--font-family-sans);
--typography-sans-50-bold-line-height: 1.4166666666666667;
--typography-sans-50-bold-font-size: var(--typography-sans-50-regular-font-size );
--typography-sans-50-bold-font-family: var(--font-family-sans);
--typography-sans-50-semibold-line-height: 1.4166666666666667;
--typography-sans-50-semibold-font-size: var(--typography-sans-50-regular-font-size );
--typography-sans-50-semibold-font-family: var(--font-family-sans);
--typography-sans-50-medium-line-height: 1.4166666666666667;
--typography-sans-50-medium-font-size: var(--typography-sans-50-regular-font-size );
--typography-sans-50-medium-font-family: var(--font-family-sans);
--typography-sans-50-regular-font-family: var(--font-family-sans);
}
@media screen and (min-width: 600px) {
:root {
--base-padding:40px;
--spacing-l: 80px;
--spacing-xl: 80px
}
}
@media screen and (min-width: 1025px) {
:root {
--base-padding:60px
}
}
@media screen and (min-width: 1440px) {
:root {
--spacing-m:60px;
--spacing-l: 120px;
--spacing-xl: 160px
}
}
.product_home__1P4ov {
contain: paint;
width: 100%;
min-height: 100vh;
height: auto;
}
.menu{
min-width: 180px
}
.base_theme__0aOTs {
--color-alpha-active: var(--color-alpha-light-200);
--color-alpha-hover: var(--color-alpha-light-100);
--color-ui-icon: var(--color-dark-600);
--color-text-medium: var(--color-gray-500);
--color-text-light: var(--color-gray-400);
--color-text-dark: var(--color-gray-800);
--color-text: var(--color-gray-600);
--color-secondary: var(--color-dark-600);
--color-primary: var(--color-red-500);
--color-page: var(--color-base-100);
--color-navigation-dropdown-hover: var(--color-base-200);
--color-navigation-dropdown: var(--color-base-100);
--color-navigation: var(--color-base-200);
--color-logo: var(--color-red-500);
--color-link-hover-from-inherited: var(--color-blue-500);
--color-link-hover: var(--color-blue-800);
--color-link: var(--color-blue-500);
--color-icon: var(--color-red-500);
--color-checkbox-icon-checked: var(--color-base-100);
--color-checkbox-border-checked: var(--color-base-800);
--color-checkbox-border-hover: var(--color-base-800);
--color-checkbox-border-active: var(--color-base-800);
--color-checkbox-border: var(--color-base-780);
--color-checkbox-background-checked: var(--color-base-800);
--color-checkbox-background: var(--color-base-100);
--color-button-tertiary-text: var(--color-base-800);
--color-button-tertiary-hover: var(--color-base-200);
--color-button-tertiary-active: var(--color-base-200);
--color-button-tertiary: var(--color-base-100);
--color-button-secondary-text: var(--color-base-800);
--color-button-secondary-hover: var(--color-base-120);
--color-button-secondary-active: var(--color-base-140);
--color-button-secondary: var(--color-base-100);
--color-button-primary-text: var(--color-base-100);
--color-button-primary-hover: var(--color-base-780);
--color-button-primary-active: var(--color-base-760);
--color-button-primary: var(--color-base-800);
--color-border-hover: var(--color-gray-200);
--color-border: var(--color-gray-200);
--color-block-border: var(--color-gray-200);
--color-block-hover: var(--color-base-250);
--color-block: var(--color-base-200);
--color-banner: var(--color-base-400);
}
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* 繝懊ち繝ｳ繧ｹ繧ｿ繧､繝ｫ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.hoverable{
display: block;
-webkit-border-radius: var(--border-radius-300);
-moz-border-radius: var(--border-radius-300);
border-radius: var(--border-radius-300);
padding: 0px 0px;
text-decoration: none;
background: none;
border: 0;
text-align: inherit
}
.hoverable:hover,.hoverable:focus-within {
background: var(--color-alpha-hover);
outline: none;
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
transition: none
}
.hoverable:focus,.clickable:active {
background: var(--color-alpha-active);
outline: none;
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
transition: none
}
.is-active{
background: var(--color-gray-200);
-webkit-transition: 150ms background linear;
-moz-transition: 150ms background linear;
-o-transition: 150ms background linear;
transition: 150ms background linear
}
.full-width{
width: 100%
}
.has-action{
cursor: pointer
}
.has-border{
border: 1px solid var(--color-gray-200)
}
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* Header style*/
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.dialog.mobile-nav-open {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
max-height: 100vh;
overflow-y: auto;
z-index: var(--z-index-header)
}
.dialog.mobile-nav-open~* {
display: none!important
}
.header {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-webkit-flex-direction: column-reverse;
-moz-box-orient: vertical;
-moz-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
background: var(--color-page)
}
.has-page-nav .header {
background: var(--color-navigation)
}
.mobile-nav-open .header {
background: var(--color-page)
}
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* 繝翫ン繧ｲ繝ｼ繧ｷ繝ｧ繝ｳ繝｡繝九Η繝ｼ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.menu {
width: auto;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex
}
.menu-section:not(:first-child) {
border-left: 1px solid var(--color-border)
}
/* */
.nav-section{
padding: 4px;
min-width: auto
}
.nav-section-title{
padding: 0 8px;
margin: 8px 0
}
.nav-list{
list-style: none
}
.nav-item{
text-align: left;
line-height: 1.5
}
.nav-item-inner{
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center
}
.nav-item-before{
padding-right: 10px
}
.nav-item-icon{
width: 40px;
height: 40px;
margin-left: -3px;
margin-right: 7px;
margin-bottom: 3px;
-webkit-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0
}
.nav-item-icon.dark-mode{
-webkit-filter: grayscale(1)invert(1);
filter: grayscale(1)invert(1)
}
.label{
font-weight: var(--typography-sans-200-medium-font-weight);
font-size: 16px;
white-space: nowrap
}
.label.jsx-826997213:hover {
font-weight: var(--typography-sans-800-bold-font-weight);
}
.badge{
margin-left: 6px;
position: relative;
bottom: 2px
}
.description{
margin-top: -2px;
display: block;
color: var(--color-text-medium);
font-weight: var(--typography-sans-400-regular-font-weight);
font-size: var(--typography-sans-100-regular-font-size)
}
.menu {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
min-width: 480px
}
.menu-section {
-webkit-box-flex: 1;
-webkit-flex-grow: 1;
-moz-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
min-width: 240px
}
.menu-section:not(:first-child) {
border-left: 1px solid var(--color-border)
}
.product-page-item {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
align-items: center;
gap: 8px
}
/* 2112324044*/
.hoverable{
display: block;
-webkit-border-radius: var(--border-radius-300);
-moz-border-radius: var(--border-radius-300);
border-radius: var(--border-radius-300);
padding: 0px 0px;
text-decoration: none;
background: none;
border: 0;
text-align: inherit
}
.hoverable:hover,.hoverable:focus-within {
background: var(--color-alpha-hover);
outline: none;
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
transition: none
}
.hoverable:focus,.clickable:active {
background: var(--color-alpha-active);
outline: none;
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
transition: none
}
.is-active{
background: var(--color-gray-200);
-webkit-transition: 150ms background linear;
-moz-transition: 150ms background linear;
-o-transition: 150ms background linear;
transition: 150ms background linear
}
.full-width{
width: 100%
}
.has-action{
cursor: pointer
}
.has-border{
border: 1px solid var(--color-gray-200)
}
/* f4adb663131852e5 */
.smallcaps {
display: block;
color: var(--color-text-medium);
text-transform: uppercase;
font-size: 11px;
line-height: 1;
letter-spacing: .06em;
font-weight: var(--typography-sans-200-medium-font-weight)
}
/* 3498630025 */
.nav-section {
padding: 4px;
min-width: 300px
}
.nav-section-title {
padding: 0 8px;
margin: 8px 0
}
.nav-list {
list-style: none
}
.nav-item {
text-align: left;
line-height: 1.5
}
.nav-item-inner {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center
}
.nav-item-before {
padding-right: 10px
}
.nav-item-icon {
width: 40px;
height: 40px;
margin-left: -3px;
margin-right: 7px;
margin-bottom: 3px;
-webkit-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0
}
.nav-item-icon.dark-mode {
-webkit-filter: grayscale(1)invert(1);
filter: grayscale(1)invert(1)
}
.label {
font-weight: var(--typography-sans-200-medium-font-weight);
font-size: var(--typography-sans-150-regular-font-size);
white-space: nowrap
}
.badge {
margin-left: 6px;
position: relative;
bottom: 2px
}
.description {
margin-top: -2px;
display: block;
color: var(--color-text-medium);
font-weight: var(--typography-sans-400-regular-font-weight);
font-size: var(--typography-sans-100-regular-font-size)
}
/* 3522851139 */
.nav-section {
padding: 4px;
min-width: 180px
}
.nav-section-title {
padding: 0 8px;
margin: 8px 0
}
.nav-list {
list-style: none
}
.nav-item {
text-align: left;
line-height: 1.5
}
.nav-item-inner {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center
}
.nav-item-before {
padding-right: 10px
}
.nav-item-icon {
width: 40px;
height: 40px;
margin-left: -3px;
margin-right: 7px;
margin-bottom: 3px;
-webkit-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0
}
.nav-item-icon.dark-mode {
-webkit-filter: grayscale(1)invert(1);
filter: grayscale(1)invert(1)
}
.label {
font-weight: var(--typography-sans-200-medium-font-weight);
font-size: var(--typography-sans-150-regular-font-size);
white-space: nowrap
}
.badge {
margin-left: 6px;
position: relative;
bottom: 2px
}
.description {
margin-top: -2px;
display: block;
color: var(--color-text-medium);
font-weight: var(--typography-sans-400-regular-font-weight);
font-size: var(--typography-sans-100-regular-font-size)
}
.menu {
width: auto;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex
}
.menu-section:not(:first-child) {
border-left: 1px solid var(--color-border)
}
/* bfc18ca12fb5954b */
.nav-list{
list-style: none;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
margin: 0
}
/* */
.nav-right{
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 100%;
position: relative
}
.divider{
width: 1px;
background: var(--color-border);
height: 20px;
margin: 0 10px
}
.nav-list{
list-style: none;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
margin: 0
}
.cta-item{
padding-left: 10px
}
.non-english.nav-list-sales.jsx-4212776476,.non-english.divider{
display: none
}
@media screen and (min-width: 1440px) {
.non-english.nav-list-sales{
display:-webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex
}
.non-english.divider{
display: block
}
}
/* */
.nav {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: space-between;
-webkit-justify-content: space-between;
-moz-box-pack: space-between;
-ms-flex-pack: space-between;
justify-content: space-between;
width: 100%;
height: 100%
}
.nav-left[hidden] {
display: none
}
.nav-left {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 2px
}
.nav-right {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
gap: 2px;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 100%;
position: relative
}
.nav-menu-resources-container>* {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
gap: 4px
}
.download-button-item {
margin-top: 30px;
padding: 0 8px
}
.nav-menu-solutions-container>* {
display: grid;
grid-template-columns: 1fr 1fr;
-webkit-column-gap: 12px;
-moz-column-gap: 12px;
column-gap: 12px
}
.nav-menu-solutions-container>*>*:not(:nth-last-child(-n+2)) {
grid-column: 1/span 2
}
.divider {
width: 1px;
background: var(--border-color-regular);
height: 16px;
margin: 0 8px
}
.login-get-notion-container {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 10px
}
/**/
.menu-toggle {
border: 0;
background: 0;
cursor: pointer;
width: 24px;
height: 24px;
padding: 11px;
margin: -11px;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
-ms-flex-pack: center;
justify-content: center
}
/* */
.nav-item{
margin: 0;
padding: 0
}
.nav-itema{
display: block;
padding: 4px 0;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
width: 100%;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
white-space: nowrap;
text-decoration: none
}
.icon{
margin-right: 8px
}
.label{
font-weight: var(--typography-sans-400-regular-font-weight);
font-size: var(--typography-sans-200-regular-font-size)
}
.badge{
margin-left: 6px;
position: relative;
bottom: 2px
}
/* */
.nav-section {
margin: 8px 0
}
.nav-section-title {
margin: 20px 0 10px
}
.nav-list {
list-style: none;
padding: 0 0 4px 0;
margin: 0
}
/* */
.download-wrap{
margin-top: 16px;
margin-bottom: 30px
}
/* */
.section{
border-bottom: 1px solid var(--color-border)
}
.section-label-link{
text-decoration: none
}
.section-label{
display: block;
text-decoration: none;
font-size: var(--typography-sans-200-regular-font-size);
font-weight: var(--typography-sans-600-bold-font-weight);
height: 60px;
line-height: 60px;
cursor: pointer;
position: relative;
background: none;
border: 0;
padding: 0;
width: 100%;
text-align: left
}
.has-menu.section-label::after {
content: "";
display: block;
width: 12px;
height: 8px;
background: url(/front-static/shared/icons/mobile-nav-caret.svg);
position: absolute;
top: 50%;
margin-top: -4px;
right: 3px;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-transition: -webkit-transform 250ms;
-moz-transition: -moz-transform 250ms;
-o-transition: -o-transform 250ms;
transition: -webkit-transform 250ms;
transition: -moz-transform 250ms;
transition: -o-transform 250ms;
transition: transform 250ms
}
.has-menu.dark-mode.section-label::after {
-webkit-filter: grayscale(1)invert(1);
filter: grayscale(1)invert(1)
}
.is-open.section-label::after {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg)
}
.menu-drawer{
margin-top: -20px;
padding: 8px 0
}
/* */
.mobile-nav{
width: 100%;
height: -webkit-calc(100vh - 62px);
height: -moz-calc(100vh - 62px);
height: calc(100vh - 62px);
display: none;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
z-index: var(--z-index-mobile-nav);
background: var(--color-page)
}
.mobile-nav-inner{
height: 100%
}
.mobile-nav-inner.jsx-4685d03d38d88513::before {
content: "";
display: block;
margin: 0 16px;
height: 1px;
background: var(--border-color-regular)
}
.mobile-nav-scrollable{
overflow-y: auto;
height: 100%;
padding: 0 16px;
padding-bottom: 140px
}
.is-open{
display: block
}
.actions{
padding-top: 26px;
display: grid;
grid-gap: 16px
}
/* */
.dialog.mobile-nav-open {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
max-height: 100vh;
overflow-y: auto;
z-index: var(--z-index-header)
}
.dialog.mobile-nav-open~* {
display: none!important
}
.has-page-nav .header {
background: var(--color-navigation)
}
.mobile-nav-open .header {
background: var(--color-page)
}
.header::after {
position: absolute;
content: "";
bottom: 0;
left: 16px;
right: 16px;
height: 1px;
background: #000;
opacity: 0;
-webkit-transition: opacity 200ms;
-moz-transition: opacity 200ms;
-o-transition: opacity 200ms;
transition: opacity 200ms
}
.is-scrolled .header::after {
opacity: 1
}
.dialog.position-sticky,.dialog.mobile-nav-open .header {
top: 0;
position: -webkit-sticky;
position: sticky;
z-index: var(--z-index-header)
}
.notification-internal {
display: none
}
/* */
.grid-item {
grid-column: span 12;
margin-bottom: 16px;
position: relative
}
.span-1,.span-2 {
grid-column: span 6
}
.no-row-gap {
margin-bottom: 0
}
@media screen and (min-width: 712px) {
.grid-item {
margin-bottom:24px
}
.no-row-gap {
margin-bottom: 0
}
.span-1,.span-2,.span-3 {
grid-column: span 4
}
.span-3,.span-4,.span-5,.span-6,.span-7,.span-8,.span-9 {
grid-column: span 6
}
.span-10,.span-11,.span-12 {
grid-column: span 12
}
}
@media screen and (min-width: 942px) {
.span-1 {
grid-column:span 1
}
.span-2 {
grid-column: span 2
}
.span-3 {
grid-column: span 3
}
.span-4 {
grid-column: span 4
}
.span-5 {
grid-column: span 5
}
.span-6 {
grid-column: span 6
}
.span-7 {
grid-column: span 7
}
.span-8 {
grid-column: span 8
}
.span-9 {
grid-column: span 9
}
.span-10 {
grid-column: span 10
}
.span-11 {
grid-column: span 11
}
.span-12 {
grid-column: span 12
}
}
/* */
.rounded-media.jsx-2759891967 {
-webkit-border-radius: var(--border-radius-400);
-moz-border-radius: var(--border-radius-400);
border-radius: var(--border-radius-400);
border: 1px solid rgba(0,0,0,.1);
overflow: hidden;
position: relative;
background: var(--color-page);
-webkit-box-shadow: var(--shadow-level-300);
-moz-box-shadow: var(--shadow-level-300);
box-shadow: var(--shadow-level-300);
-webkit-transform: translatez(0);
-moz-transform: translatez(0);
transform: translatez(0);
width: 100%;
height: auto;
display: block;
position: relative;
margin: 0 auto;
-webkit-align-self: flex-start;
-ms-flex-item-align: start;
align-self: flex-start
}
.dark-mode.jsx-2759891967 {
border: 1px solid rgba(255,255,255,.2)
}
@media screen and (min-width: 600px) {
.rounded-media.jsx-2759891967 {
-webkit-border-radius:var(--border-radius-700);
-moz-border-radius: var(--border-radius-700);
border-radius: var(--border-radius-700)
}
}
.highlight-border.jsx-2759891967 {
border: 1px solid var(--color-blue-400);
-webkit-border-radius: var(--border-radius-400);
-moz-border-radius: var(--border-radius-400);
border-radius: var(--border-radius-400)
}
.highlight-border.jsx-2759891967:after {
content: "";
z-index: 1;
border: 2px solid var(--color-blue-400);
position: absolute;
top: -1px;
left: -1px;
right: -1px;
bottom: -1px;
pointer-events: none;
-webkit-border-radius: var(--border-radius-400);
-moz-border-radius: var(--border-radius-400);
border-radius: var(--border-radius-400)
}
/* */
/* */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* 1576385507 繝｡繝九Η繝ｼnav-item
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.nav-item{
font-weight: var(--typography-sans-200-medium-font-weight);
font-size: var(--typography-sans-150-regular-font-size);
position: relative
}
.label{
display: block;
padding: 0 10px;
height: 30px;
line-height: 31px
}
.has-menu.label{
padding-right: 24px
}
.has-menu.label::after {
content: "";
display: block;
width: 8px;
height: 6px;
background: url(/front-static/shared/icons/nav-caret.svg);
position: absolute;
top: 50%;
margin-top: -2px;
right: 10px
}
.has-menu.dark-mode.label::after {
-webkit-filter: grayscale(1)invert(1);
filter: grayscale(1)invert(1)
}
.popup{
-webkit-box-shadow: var(--shadow-level-200);
-moz-box-shadow: var(--shadow-level-200);
box-shadow: var(--shadow-level-200);
-webkit-border-radius: var(--border-radius-300);
-moz-border-radius: var(--border-radius-300);
border-radius: var(--border-radius-300);
background: var(--color-navigation-dropdown);
position: absolute;
left: 0;
top: 100%;
text-align: left;
z-index: 1000;
visibility: hidden;
visibility: 0;
opacity: 0;
-webkit-transform: scale(.97);
-moz-transform: scale(.97);
-ms-transform: scale(.97);
-o-transform: scale(.97);
transform: scale(.97);
-webkit-transition: visibility 0s,opacity 150ms ease,-webkit-transform 150ms ease;
-moz-transition: visibility 0s,opacity 150ms ease,-moz-transform 150ms ease;
-o-transition: visibility 0s,opacity 150ms ease,-o-transform 150ms ease;
transition: visibility 0s,opacity 150ms ease,-webkit-transform 150ms ease;
transition: visibility 0s,opacity 150ms ease,-moz-transform 150ms ease;
transition: visibility 0s,opacity 150ms ease,-o-transform 150ms ease;
transition: visibility 0s,opacity 150ms ease,transform 150ms ease;
-webkit-transform-origin: top left;
-moz-transform-origin: top left;
-ms-transform-origin: top left;
-o-transform-origin: top left;
transform-origin: top left
}
.nav-item:hover .popup,.nav-item:focus-within .popup{
visibility: visible;
opacity: 1;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1)
}
.has-menu:hover .label::after {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg)
}
@media(prefers-reduced-motion) {
.popup{
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
transition: none
}
}
/* jsx-bfc18ca12fb5954b*/
.nav-list{
list-style: none;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
margin: 0
}
/* 4212776476*/
.nav-right{
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 100%;
position: relative
}
.divider{
width: 1px;
background: var(--color-border);
height: 20px;
margin: 0 10px
}
.nav-list{
list-style: none;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
margin: 0
}
.cta-item{
padding-left: 10px
}
.non-english.nav-list-sales.jsx-4212776476,.non-english.divider{
display: none
}
@media screen and (min-width: 1440px) {
.non-english.nav-list-sales{
display:-webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex
}
.non-english.divider{
display: block
}
}
/* 3798395750*/
.nav {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: space-between;
-webkit-justify-content: space-between;
-moz-box-pack: space-between;
-ms-flex-pack: space-between;
justify-content: space-between;
width: 100%;
height: 100%;
}
.nav-left[hidden] {
display: none
}
.nav-left {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 2px
}
.nav-right {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
gap: 2px;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 100%;
position: relative
}
.nav-menu-resources-container>* {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
gap: 4px
}
.download-button-item {
margin-top: 30px;
padding: 0 8px
}
.nav-menu-solutions-container>* {
display: grid;
grid-template-columns: 1fr 1fr;
-webkit-column-gap: 12px;
-moz-column-gap: 12px;
column-gap: 12px
}
.nav-menu-solutions-container>*>*:not(:nth-last-child(-n+2)) {
grid-column: 1/span 2
}
.divider {
width: 1px;
background: var(--border-color-regular);
height: 16px;
margin: 0 8px
}
.dialog.mobile-nav-open {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
max-height: 100vh;
overflow-y: auto;
z-index: var(--z-index-header)
}
.dialog.mobile-nav-open~* {
display: none!important
}
.header {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-webkit-flex-direction: column-reverse;
-moz-box-orient: vertical;
-moz-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
background: var(--color-page)
}
.has-page-nav .header {
background: var(--color-navigation)
}
.mobile-nav-open .header {
background: var(--color-page)
}
.dialog.position-sticky,.dialog.mobile-nav-open .header {
top: 0;
position: -webkit-sticky;
position: sticky;
background-color: #fff;
z-index: var(--z-index-header)
}
.notification-internal {
display: none
}
.is-redesigned .inner {
max-width: none;
height: 50px;
}
.wordmark_wordmark__1k7VM {
display: block;
height: 36px;
}
.logo {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
}
.desktop-actions {
display: none;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-flex: 1;
-webkit-flex-grow: 1;
-moz-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
margin-left: 12px;
}
.mobile-actions {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 24px;
}
.mobile-actions[hidden] {
display: none;
}
.mobile-cta {
display: none;
}
.is-scrolled .mobile-cta {
display: initial
}
@media screen and (min-width: 1250px) {
.header {
-webkit-box-orient:vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-moz-box-orient: vertical;
-moz-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column
}
.notification {
display: none;
}
.desktop-actions {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
}
.mobile-actions {
display: none
}
.notification-internal {
display: initial
}
}
.menu ul {
display: table;
padding: 0;
font-size: 16px;
line-height: 2.5;
list-style: none;
color: #f4f5f7;
}
.open_in_new_icon{
height: 16px;
}
main {
background-color: rgb(255, 255, 255);
color: rgb(9, 9, 9);
min-height: calc(100vh - 150px); /* Adjust as needed for header and footer heights */
display: flex;
align-items: center;
justify-content: center;
}
.grid-container {
display: grid;
grid-gap: 20px;
max-width: 800px; /* Adjust as needed */
padding: 20px;
}
.item {
background-color: #f2f2f2;
padding: 20px;
text-align: center;
border-radius: 5px;
}
footer {
background-color: #121212;
color: white;
text-align: center;
padding: 20px;
}
/* Responsive Design */
/* For Tablets */
@media only screen and (max-width: 400px) {
.grid-container {
grid-template-columns: repeat(1, 1fr);
}
}
.inner {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
width: 100%;
padding: 15px 26px;
margin: 0 auto;
-webkit-transition: 250ms height;
-moz-transition: 250ms height;
-o-transition: 250ms height;
transition: 250ms height;
max-width: 1424px;
}
@media screen and (min-width: 767px){
.header {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-moz-box-orient: vertical;
-moz-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
/* For Mobile Phones */
@media only screen and (max-width: 480px) {
.grid-container {
grid-template-columns: repeat(1, 1fr);
padding: 10px;
}
.item {
padding: 10px;
line-height: 0%;
}
}
.label-msg{
color: #121212;
font-size: small;
line-height: 20px;
}
.label-emoji{
font-size: 18px;
}
.mobile-actions {
display: none;
--textColor: #000000;
--backgroundColor: #FFFFFF;
color: #121212;
background: #ffffff;
}
@media (max-width: 1250px){
.mobile-actions {
display: block;
}}