/* 콕카 공통 폰트: 로컬 Pretendard를 사용합니다. */
/*
Copyright (c) 2021 Kil Hyung-jin, with Reserved Font Name Pretendard.
https://github.com/orioncactus/pretendard

This Font Software is licensed under the SIL Open Font License, Version 1.1.
This license is copied below, and is also available with a FAQ at:
http://scripts.sil.org/OFL
*/

@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), url('/font/heybrocar/pretendard/Pretendard-Black.woff2') format('woff2'), url('/font/heybrocar/pretendard/Pretendard-Black.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), url('/font/heybrocar/pretendard/Pretendard-ExtraBold.woff2') format('woff2'), url('/font/heybrocar/pretendard/Pretendard-ExtraBold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), url('/font/heybrocar/pretendard/Pretendard-Bold.woff2') format('woff2'), url('/font/heybrocar/pretendard/Pretendard-Bold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), url('/font/heybrocar/pretendard/Pretendard-SemiBold.woff2') format('woff2'), url('/font/heybrocar/pretendard/Pretendard-SemiBold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), url('/font/heybrocar/pretendard/Pretendard-Medium.woff2') format('woff2'), url('/font/heybrocar/pretendard/Pretendard-Medium.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), url('/font/heybrocar/pretendard/Pretendard-Regular.woff2') format('woff2'), url('/font/heybrocar/pretendard/Pretendard-Regular.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), url('/font/heybrocar/pretendard/Pretendard-Light.woff2') format('woff2'), url('/font/heybrocar/pretendard/Pretendard-Light.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), url('/font/heybrocar/pretendard/Pretendard-ExtraLight.woff2') format('woff2'), url('/font/heybrocar/pretendard/Pretendard-ExtraLight.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), url('/font/heybrocar/pretendard/Pretendard-Thin.woff2') format('woff2'), url('/font/heybrocar/pretendard/Pretendard-Thin.woff') format('woff');
}

/********************
// resetcode
********************/
html, body{overflow-x:hidden; }
html, body, div, 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,textarea,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,input,select,button,
time, mark, audio, video {
margin: 0;padding: 0;border: 0;font-size: 16px; line-height:1.5em;  font-family: 'pretendard', sans-serif; 
 font-weight:400; letter-spacing: -0.05em; vertical-align: baseline; color:#2c1e1c;word-break:keep-all; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
img{line-height: 0;}
.inner{width:80%; margin:0 auto;}


td{vertical-align: middle;}
th{vertical-align: middle;}


/********************
// 색상
********************/
.co_black {color:#000}
.co_white{color:#fff;}
.co_red {color:#DA1D1D;}

/** font **/
.co_0{color: #f2f3fc;}
.co_1{color: #daeaff;}
.co_2{color:#b8d8ff;}
.co_3{color:#91c6ff;}
.co_4{color:#5ea6fc;}
.co_5{color:#3882f9;}
.co_6{color:#2263ee;}
.co_7{color:#1a4edb;}
.co_8{color:#1c40b1;}
.co_9{color:#1c3a8c;}
.co_10{color:#162455;}

.coc_0{color: #f5f7fa;}
.coc_1{color: #eaedf4;}
.coc_2{color:#d1d9e6;}
.coc_3{color:#a8b8d1;}
.coc_4{color:#7a92b6;}
.coc_5{color:#59759e;}
.coc_6{color:#455d84;}
.coc_7{color:#394a6b;}
.coc_8{color:#32405a;}
.coc_9{color:#2d384d;}
.coc_10{color:#131720;}

.co_g0{color: #f7f8f8;}
.co_g1{color: #eeeef0;}
.co_g2{color:#d9dade;}
.co_g3{color:#b8bac1;}
.co_g4{color:#91949f;}
.co_g5{color:#737784;}
.co_g6{color:#5d606c;}
.co_g7{color:#4c4e58;}
.co_g8{color:#41424b;}
.co_g9{color:#37383e;}
.co_g10{color:#26272b;}


/** background **/
.bco_white{background:#ffffff;}
.bco_black{background:#000;}
.bco_red{background:#FFF7F7;}

.bco_0{background: #f2f3fc;}
.bco_1{background: #daeaff;}
.bco_2{background:#b8d8ff;}
.bco_3{background:#91c6ff;}
.bco_4{background:#5ea6fc;}
.bco_5{background:#3882f9;}
.bco_6{background:#2263ee;}
.bco_7{background:#1a4edb;}
.bco_8{background:#1c40b1;}
.bco_9{background:#1c3a8c;}
.bco_10{background:#162455;}

.bcoc_0{background: #f5f7fa;}
.bcoc_1{background: #eaedf4;}
.bcoc_2{background:#d1d9e6;}
.bcoc_3{background:#a8b8d1;}
.bcoc_4{background:#7a92b6;}
.bcoc_5{background:#59759e;}
.bcoc_6{background:#455d84;}
.bcoc_7{background:#394a6b;}
.bcoc_8{background:#32405a;}
.bcoc_9{background:#2d384d;}
.bcoc_10{background:#131720;}

.bco_g0{background: #f7f8f8;}
.bco_g1{background: #eeeef0;}
.bco_g2{background:#d9dade;}
.bco_g3{background:#b8bac1;}
.bco_g4{background:#91949f;}
.bco_g5{background:#737784;}
.bco_g6{background:#5d606c;}
.bco_g7{background:#4c4e58;}
.bco_g8{background:#41424b;}
.bco_g9{background:#37383e;}
.bco_g10{background:#26272b;}

/********************
// 추가 공통 규칙: 위 기본 코드로 표현되지 않는 프로젝트 설정
********************/
/* 페이지 전용 계산식·테두리·상태에서 사용하는 별칭. 위 색상표와 동일합니다. */
:root {
  --ink: #2c1e1c;
  --muted: #5d606c; /* co_g6 */
  --soft: #91949f; /* co_g4 */
  --blue: #2263ee; /* co_6 */
  --cta: #2263ee; /* bco_6 */
  --surface: #f5f7fa; /* bcoc_0 */
  --border: #d1d9e6; /* bcoc_2 */
  --title: 48px;
  --label: 20px;
  --body: 16px;
  --large: 24px;
  --gutter: 60px;
  --gap: 60px;
}

/* 가상 요소까지 같은 박스 계산을 적용합니다. */
*, *::before, *::after { box-sizing: border-box; }
html { background: #fff; }
a { text-decoration: none; }
button, summary { cursor: pointer; }

/* 키보드 탐색 시 현재 선택한 조작 요소를 표시합니다. */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 4px;
}

/* 버튼 안의 문구는 부모에 지정한 색상·글자 설정을 따릅니다. */
.header-contact > span,
.button > span {
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
}