@charset "utf-8";

@font-face {
  font-family:'Questrial';
  src: url('../fonts/Questrial-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family:'Noto Sans KR';
  src: url('../fonts/kr/noto-sans-kr-korean-400-normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family:'Noto Sans KR';
  src: url('../fonts/kr/noto-sans-kr-korean-500-normal.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family:'Noto Sans KR';
  src: url('../fonts/kr/noto-sans-kr-korean-600-normal.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family:'Noto Sans KR';
  src: url('../fonts/kr/noto-sans-kr-korean-700-normal.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/*
=========================================================================
theme color
=========================================================================
*/
:root {
  /* brand */
  --main:      #C9A96E;
  --main-dark: #B08A4F;

  /* base */
  --white:     #ffffff;
  --text-dark: #1a1a1a;

  /* background tints */
  --bg-cream:  #faf8f3;
  --bg-peach:  #fef3e8;
  --bg-ivory:  #f2efe8;
  --bg-beige:  #f5e9d6;
  --bg-tag:    #f9f0e2;

  /* beige border tone (concern/benefit/hcg 카드류 공용) */
  --border-beige: #e8e0d0;

  /* gray scale (light -> dark) */
  --gray-100: #e8e8e8;
  --gray-200: #dddddd;
  --gray-300: #aaaaaa;
  --gray-400: #999999;
  --gray-500: #888888;
  --gray-600: #777777;
  --gray-700: #666666;
  --gray-800: #555555;

  /* font */
  --f-body:   'Noto Sans KR', sans-serif;
  --f-sub-en: 'Questrial', sans-serif;

  /* layout */
  --max-cont:1400px;
  --min-cont:350px;
}

body,p,div,span,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select {margin:0; padding:0;}
body,input,textarea,button,select {font-family:var(--f-body);}
html,body {font-size:18px; line-height:1.6;}

@media (max-width:960px) {
  html,body{font-size:16.5px;}
}

*,*::before,*::after {box-sizing:border-box;}
body {background:var(--white); color:var(--text-dark); min-height:100vh; overflow-x:hidden; word-break:keep-all;}
h1,h2,h3,h4,h5,h6 {font-size:1em;}
img,fieldset,button {border:0;}
textarea {overflow:auto;}
input[type=submit],input[type=button],button {cursor:pointer; border:none; box-shadow:none; border-radius:0; padding:0; overflow:visible; background:none;}
img {max-width:100%; display:block; width:100%; height:100%; object-fit:cover;}
address,em {font-style:normal;}
table {border-spacing:0; border-collapse:collapse;}
caption {overflow:hidden; line-height:0; text-indent:-2000em;}
legend,.hidden {padding:0; margin:0; overflow:hidden !important; text-indent:100%; white-space:nowrap; font-size:0;}
i {font-style:normal;}
select {background:var(--white);}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
figure {padding:0; margin:0;}
a {color:inherit;}
a:link,a:visited,a:hover,a:active,a:focus {text-decoration:none;}
ul,ol,li {list-style:none;}
input::placeholder,textarea::placeholder {color:var(--gray-400);}
html {scroll-behavior:smooth;}
::-webkit-scrollbar {width:4px;}
::-webkit-scrollbar-track {background:#f0f0f0;}
::-webkit-scrollbar-thumb {background:var(--main); border-radius:2px;}