@charset "utf-8"; 

/*========================================================================
Layout
========================================================================*/
/* 웹폰트*/
@font-face {
    font-family: 'PartialSansKR-Regular';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2307-1@1.1/PartialSansKR-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'RixYeoljeongdo_Regular';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2102-01@1.0/RixYeoljeongdo_Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'KBO-Dia-Gothic_bold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2304-2@1.0/KBO-Dia-Gothic_bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Giants-Bold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2307-1@1.1/Giants-Bold.woff2') format('woff2');
    font-weight: 100;
    font-style: normal;
}
/*reset css*/
body { font-family: 'Pretendard', 'Malgun Gothic', sans-serif; }


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
html, body {
  touch-action: manipulation; /* 더블탭 줌 방지 */
}

html {scroll-behavior: smooth;}
body {padding: 0; margin: 0;}
h1, h2, .main-title a {font-family:  'Giants-Bold', sans-serif;}
#wrap {width:100%; }
/* #header {position:relative; width:100%; z-index:101; } */
#header .header-inner {position:relative;width:100%; max-width:1410px; padding:0 5px; margin:0 auto; box-sizing:border-box; }
#container {position:relative; width:100%; padding:0 0 100px; box-sizing:border-box; }
#contents {display:block; width:1200px; padding:0; margin:0 auto; box-sizing:border-box; }
#contents:has(#productList) {width:100%; max-width:1410px; padding:0 5px; }
#footer .footer-inner {position:relative; width:100%; max-width:1410px; padding:0 5px; margin:0 auto; box-sizing:border-box; }

ul{padding: 0; margin: 0;}
ul li{list-style: none;}


/* font */
/* body,code,input,select,textarea,
[class^='btnBasic'], a[class^='btnBasic'],
[class^='btnNormal'], a[class^='btnNormal'],
[class^='btnEm'], a[class^='btnEm'],
[class^='btnSubmit'], a[class^='btnSubmit'] { font-family:'Pretendard','Malgun Gothic', Verdana, Dotum, AppleGothic, sans-serif; } */

/* =====================================
    DESIGN TOKENS
    ===================================== */
:root {
  /* === 라이트 베이스 - 살짝 따뜻한 톤으로 조정 === */
  --base: #FAF6F2;          /* Off White → 살짝 크림 끼 */
  --base-warm: #F5EFE8;     /* 더 따뜻한 톤 (브릿지용) */
  --surface: #FFFFFF;
  --sky: #E8F0F4;           /* 살짝 따뜻해진 sky */
  --sky-deep: #D4E0E8;
  --cream: #FFF8EF;         /* 부드러운 크림 (전환용) */
  --lavender: #F0E8F0;      /* 라벤더 끼 (전환용) */
  --peach: #FFE8DC;         /* 피치 끼 (전환용) */
  
  --text: #1A1A1A;
  --text-sub: #6B6B6B;
  --text-light: #9CA3AF;
  --primary: #0066CC;       /* Cool Blue 메인 유지 */
  --primary-light: #4D94DB;
  --gold: #FFB800;          /* Beer Gold CTA 유지 */
  --gold-deep: #E5A600;
  --coral: #FF5A5F;
  --deep: #003D7A;
  --deep-darker: #002650;
  --line: #E8E2DA;          /* 라인도 살짝 따뜻하게 */
  --line-soft: #F2EDE6;
  
  /* === 2026 포스터 키비주얼 컬러 (Beer Land) === */
  --night: #1A1B3A;
  --night-deep: #0F0E29;
  --purple: #4A2D5E;
  --magenta: #D4377C;
  --magenta-light: #E85D9B;
  --magenta-wine: #A8377C;  /* 톤다운된 마젠타 - 보조 액센트용 */
  --orange: #FF8C42;
  --beer-yellow: #FFCB47;
  
  --font-display: 'Bebas Neue', sans-serif;
  --font-body: 'Pretendard', 'Inter', -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  
  --max-w: 1440px;
  --pad-x: clamp(20px, 5vw, 80px);
  
  --radius: 4px;
  --radius-lg: 12px;
  
  --shadow-sm: 0 2px 8px rgba(0, 61, 122, 0.06);
  --shadow-md: 0 8px 24px rgba(0, 61, 122, 0.10);
  --shadow-lg: 0 20px 60px rgba(0, 61, 122, 0.15);
  --shadow-blue: 0 16px 48px rgba(0, 102, 204, 0.25);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--font-body);
  background: var(--base);
  color: var(--text);
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
img { display: block; max-width: 100%; }