

:root{

	--c-bg:            #F7F9FB;
	--c-surface:       #FFFFFF;
	--c-surface-2:     #EFF3F7;
	--c-surface-3:     #E4EAF1;
	--c-fg:            #1B2836;
	--c-fg-2:          #4A5A6C;
	--c-fg-3:          #6E7F91;
	--c-fg-4:          #6E7F91;
	--c-line:          #DDE5ED;
	--c-line-soft:     #E9EFF5;

	--c-primary:       #1B2836;
	--c-primary-deep:  #111B26;
	--c-primary-soft:  #E7EBEF;
	--c-on-primary:    #FFFFFF;

	--c-accent:        #2D6BC4;
	--c-accent-deep:   #23539B;
	--c-accent-soft:   #E6EEFA;
	--c-on-accent:     #FFFFFF;

	--c-deep:          #1B2836;
	--c-deep-2:        #24364A;
	--c-on-deep:       #E8EEF5;
	--c-on-deep-2:     #9DB0C4;
	--c-on-deep-3:     #7D91A6;
	--c-deep-line:     #40505F;
	--c-deep-line-soft:#324250;
	--c-deep-surface-2:#2E3B48;
	--c-deep-surface-3:#3B4855;
	--c-deep-accent:   #8FB6EE;
	--c-deep-accent-soft:rgba(143,182,238,.18);

	--glass-bg:        rgba(252,253,255,.82);
	--glass-solid:     #FFFFFF;
	--glass-line:      rgba(27,40,54,.12);
	--glass-hi:        rgba(255,255,255,.75);
	--glass-hover:     rgba(45,107,196,.09);
	--glass-nav-bg:    rgba(255,255,255,.06);
	--glass-nav-line:  rgba(255,255,255,.14);
	--glass-nav-edge:  rgba(255,255,255,.78);
	--glass-nav-text:  #FFFFFF;
	--glass-nav-sub:   rgba(255,255,255,.88);
	--glass-nav-hover: rgba(255,255,255,.16);

	--glass-nav-top:   rgba(23,35,48,.72);
	--glass-nav-mid:   rgba(20,31,43,.90);
	--glass-nav-btm:   rgba(16,26,38,.97);

	--glass-nav-solid: #131E2A;

	--glass-deep:      rgba(23,35,48,.94);
	--glass-deep-line: rgba(255,255,255,.14);
	--glass-deep-hi:   rgba(255,255,255,.08);

	--ft-line:         rgba(255,255,255,.13);
	--ft-soft:         rgba(255,255,255,.08);

	--scrim-1:         rgba(20,32,46,.72);
	--scrim-2:         rgba(20,32,46,.28);
	--scrim-3:         rgba(16,26,38,.86);
	--scrim-0:         rgba(16,26,38,0);

	--sh-1: 0 2px 6px rgba(27,40,54,.05), 0 10px 24px -12px rgba(27,40,54,.16);
	--sh-2: 0 4px 12px rgba(27,40,54,.06), 0 22px 44px -20px rgba(27,40,54,.22);
	--sh-3: 0 8px 20px rgba(27,40,54,.08), 0 40px 70px -30px rgba(27,40,54,.30);
	--sh-accent: 0 12px 28px -12px rgba(45,107,196,.45);

	--r-card:  0;
	--r-input: 0;
	--r-pill:  0;

	--sp-1: .5rem;  --sp-2: .75rem; --sp-3: 1rem;   --sp-4: 1.5rem;
	--sp-5: 2rem;   --sp-6: 3rem;   --sp-7: 4.5rem; --sp-8: 6.5rem;

	--ff: "Pretendard", "Pretendard Variable", system-ui, sans-serif;
	--fs-hero: clamp(2rem, 5.2vw, 3.5rem);
	--fs-h2:   clamp(1.6rem, 3.4vw, 2.4rem);
	--fs-h3:   clamp(1.1rem, 1.8vw, 1.35rem);
	--fs-body: 1rem;
	--fs-md:   1.125rem;
	--fs-sm:   .875rem;
	--fs-xs:   .8125rem;

	--ez:      cubic-bezier(.22,.61,.36,1);
	--ez-out:  cubic-bezier(.16,1,.3,1);
	--ez-soft: cubic-bezier(.34,.8,.28,1);

	--wrap: 1200px;

	/* 카드 계열 스킨(bdc·ltc·mbc 등)이 사용하는 값입니다. 이 테마의 색과 활자,
	   모서리 기준에 맞추어 위의 기준값과 같게 지정합니다. */
	--devm01-gray-100: #EFF3F7;
	--devm01-gray-200: #DDE5ED;
	--devm01-gray-300: #DDE5ED;
	--devm01-gray-400: #8A9AAC;
	--devm01-gray-500: #6E7F91;
	--devm01-gray-600: #6E7F91;
	--devm01-gray-700: #4A5A6C;
	--devm01-gray-800: #2B3A4A;
	--devm01-gray-900: #1B2836;
	--devm01-dark:     #1B2836;
	--devm01-primary:  var(--c-accent);
	--devm01-red:      #D64545;

	--devm01-radius-btn:  var(--r-input);
	--devm01-radius-card: var(--r-card);
	--devm01-radius-lg:   var(--r-card);
	--devm01-radius-xl:   var(--r-card);
	--devm01-shadow-card:     var(--sh-1);
	--devm01-shadow-floating: var(--sh-3);

	--devm01-font-kr: var(--ff);
	--devm01-font-en: var(--ff);
	--devm01-ease:    var(--ez);
	--devm01-duration: 260ms;

	--devm01-main-width: var(--wrap);
	--devm01-sub-width:  var(--wrap);
	--devm01-inner:      var(--wrap);
	--devm01-header-height: 72px;
	--devm01-mobile-header-height: 64px;

	--devm01-wz-navy:  var(--c-fg);
	--devm01-wz-text:  var(--c-fg);
	--devm01-wz-muted: var(--c-fg-3);
	--devm01-wz-line:  var(--c-line);
	--devm01-wz-blue:  var(--c-accent);
	--devm01-wz-sky:   var(--c-accent);
	--devm01-wz-font:  var(--ff);
	--devm01-wz-ease:  var(--ez);
	--devm01-wz-radius-lg: var(--r-card);
	--devm01-wz-shadow: var(--sh-1);
}
