/* ============================================================================
   keoc.kr 클론 — 디자인 토큰 (단일 소스)
   BRICKS-GUIDE.md 의 Global Colors / Global Typography 등록표와 1:1 대응한다.
   값은 원본 keoc.kr 실측치(_original/analysis.md)에서 추출했다.
   ========================================================================== */
:root{
	/* --- Brand ------------------------------------------------------------ */
	--color-primary:        #0981f1;   /* 링크·활성 메뉴·포인트 (원본 유일한 액센트) */
	--color-primary-alt:    #4f7beb;   /* 보조 블루 */
	--color-navy:           #0c1d4b;   /* 조직도/정보 제목 */
	--color-navy-deep:      #081c4b;

	/* --- Grayscale -------------------------------------------------------- */
	--color-black:          #000000;   /* 섹션 제목, 다크 텍스트 */
	--color-ink:            #111111;   /* 푸터 배경 */
	--color-gray-900:       #222222;
	--color-gray-800:       #333333;
	--color-gray-700:       #444444;   /* 브레드크럼 현재 위치 */
	--color-gray-600:       #555555;   /* 본문 기본 텍스트 */
	--color-gray-500:       #666666;
	--color-gray-450:       #7d7d7d;   /* 기본 링크 색 */
	--color-gray-400:       #9f9f9f;   /* 브레드크럼 */
	--color-gray-350:       #a7a7a7;
	--color-gray-300:       #cccccc;   /* 구분선 */
	--color-gray-200:       #dddddd;
	--color-gray-150:       #efefef;
	--color-gray-100:       #f2f2f2;
	--color-white:          #ffffff;

	/* --- Layout ----------------------------------------------------------- */
	--container:            1280px;    /* .innerwrap  (width 94%) */
	--container-wide:       1740px;    /* .innerwrap2 (width 98%) */
	--container-gutter:     4%;        /* 헤더/푸터 좌우 여백 */
	--header-height:        110px;     /* .pcNav > li > a line-height */
	--header-bar:           120px;     /* #header:after 높이(드롭다운 바 높이) */
	--footer-pad-y:         65px;

	/* --- Breakpoints (문서·Bricks 등록용 / CSS 변수는 MQ 에 쓸 수 없음) --- */
	--bp-pc:                1400px;    /* PC   : min-width 1400 */
	--bp-tablet-min:        813px;     /* 태블릿: 813 ~ 1399 */
	--bp-mobile:            812px;     /* 모바일: max-width 812 */

	/* --- Type scale (실측) ------------------------------------------------ */
	--fs-hero:              6em;       /* 홈 히어로 / 서브비주얼 h2 */
	--fs-sub-title:         62px;      /* 서브 pageTitle h3 */
	--fs-h3:                55px;      /* 섹션 헤드라인 */
	--fs-h4:                48px;
	--fs-card:              38px;      /* 카드 제목 */
	--fs-h2:                31px;      /* 섹션 라벨(Overview/Business …) */
	--fs-lead:              27px;      /* 서브비주얼 부제 */
	--fs-nav:               20px;      /* GNB */
	--fs-body-lg:           19px;      /* 본문/푸터 링크 */
	--fs-body:              17px;
	--fs-sm:                16px;
	--fs-meta:              14px;
	--fs-btn:               14px;      /* .btnMore */
	--fs-sub-nav:           18px;      /* 드롭다운 항목 */

	/* --- Motion ----------------------------------------------------------- */
	--ease-out:             cubic-bezier(.22,1,.36,1);
	--ease-inout:           cubic-bezier(.65,0,.35,1);
	--dur-fast:             .2s;
	--dur-base:             .4s;
	--dur-reveal:           1.2s;
	--dur-bg:               2.5s;

	/* --- Z-index ---------------------------------------------------------- */
	--z-header:             1000;
	--z-overlay-bg:         1000;
	--z-drawer:             2000;
	--z-layerpop:           3000;
}

/* ============================================================================
   Pretendard Variable (SIL OFL 1.1) — 셀프호스팅
   원본은 Google Fonts 의 Poppins / Noto Sans KR / Montserrat 을 @import 했다.
   이 클론은 하우스 규칙에 따라 Pretendard 단일 서체로 통일한다.
   대체에 따른 자간·줄바꿈 차이는 _original/analysis.md 의 '폰트 보정' 항목 참조.
   ========================================================================== */
@font-face{
	font-family:"Pretendard Variable";
	font-weight:45 920;
	font-style:normal;
	font-display:swap;
	src:url("/wp-content/uploads/keoc/assets/fonts/pretendard/PretendardVariable.woff2") format("woff2-variations");
}


/* keoc.kr 클론 — globals.css (디자인 토큰 + 리셋 + Pretendard)
   원본 CSS(common.css)를 역할 기반으로 재구성. 값은 원본과 동일하며
   에셋 경로만 /assets/ 로, 폰트만 Pretendard 로 치환했다. */
/*Common*/
*{margin:0;padding:0;box-sizing:border-box;}
html,body{width:100%;height:100%}
html{overflow-y:scroll}
body{background-color:#fff;word-break:keep-all;
-webkit-text-size-adjust: 100% !important;-moz-text-size-adjust: 100% !important;-ms-text-size-adjust: 100% !important;}
body,h1,h2,h3,h4,h5,h6,th,td,li,dt,dd,a,p,input,textarea,select,option,button{
	color:#555;
	font-family:"Pretendard Variable",Pretendard,"Pretendard Variable","Malgun Gothic",sans-serif;
	font-size:14px;font-weight:normal
}
img,fieldset,iframe{border:0 none}
ul,ol,li{list-style:none}
em,address{font-style:normal}
img,input,select,textarea{vertical-align:middle}
a{color:#7d7d7d;text-decoration:none;cursor:pointer}
a:hover{color:#333;text-decoration:none}
button,label{cursor:pointer;_cursor /**/:hand}
button *{position:relative}
textarea{overflow:auto}
option{padding-right:6px}
.input_text, textarea{*margin:-1px 0;padding-right:1px}
.input_check, .input_radio{width:13px;height:13px}
.blind, legend, caption{text-indent:-9999px;font-size:0;line-height:0;overflow:hidden}
hr{display:none}
legend{*width:0}
:root legend{margin-top:-1px;font-size:0;line-height:0}
caption{*line-height:0}
img{max-width:100%;}

/*test*/
.test1{border:1px solid red}
.test2{background:#4f7beb}

.font1{font-family:"Pretendard Variable";}
.font2{font-family:"Pretendard Variable";}

/*로딩 이미지*/
#loading_img{text-align:center;display:none;width:100%;margin:10px 0px 10px 0px;}

/* popup */
.pop_today_close{padding:1px 7px 3px 7px;color:#ffffff;background:#303030;vertical-align:middle;border:0px;}
.pop_close{padding:1px 7px 3px 7px;color:#ffffff;background:#303030;vertical-align:middle;border:0px;}

@media(max-width:767px){
	/* 메인 레이어 팝업 */
	.main_layer_popup{width:96%!important;left:50%!important;top:50px!important;transform:translateX(-50%)}
	.main_layer_popup .popupContent{height:100%!important}
	.main_layer_popup img{width:100%}
}

/* #wrap{overflow:hidden;} */
