@charset "utf-8";

@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);
@font-face {font-family: 'Noto Sans KR'; font-style: normal; font-weight: 900; src: url('./fonts/NotoSansKR-Black.otf');}
@font-face {font-family: 'Noto Sans KR'; font-style: normal; font-weight: 700; src: url('./fonts/NotoSansKR-Bold.otf');}
@font-face {font-family: 'Noto Sans KR'; font-style: normal; font-weight: 500; src: url('./fonts/NotoSansKR-Medium.otf');}
@font-face {font-family: 'Noto Sans KR'; font-style: normal; font-weight: 400; src: url('./fonts/NotoSansKR-Regular.otf');}
@font-face {font-family: 'Noto Sans KR'; font-style: normal; font-weight: 300; src: url('./fonts/NotoSansKR-Light.otf');}
@font-face {font-family: 'Noto Sans KR'; font-style: normal; font-weight: 100; src: url('./fonts/NotoSansKR-Thin.otf');}

/* 색상값, px값 프로젝트마다 변경해서 쓰기 */

body{font-family: var(--font-sans-serif); color: var(--black); line-height: 1.4;}
a{color: var(--black);}
:root{
    --main_border: 1px solid #D9D9D9;
    --top_border: 2px solid #333;
    --font-sans-serif: "Noto Sans KR", -apple-system, Arial,"Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    --deep_blue: #0C3A93;
    --deep_blue_bg: #E6EFF8;
    --dark_blue: #165D94;
    --blue: #1454FF;
    --blue_bg:rgba(20, 84, 255, 0.10);
    --black: #333333;
    --dark_black: #222222;
    --grey :#888888;
	--main_blue: #165D94;
    --dark_grey:#555555;
    --dark_border: 1px solid #555555;
    --orange: #FF6652;
    --deep_grey: #30455D;
}
.bdT{border-top: var(--main_border);}
.bdB{border-top: var(--main_border);}
.bdL{border-top: var(--main_border);}
.bdR{border-top: var(--main_border);}
.taC{text-align: center;}
.taL{text-align: left;}
.taR{text-align: right;}
.vaM{vertical-align: middle;}
.mg_auto{margin: 0 auto;}
.flex{display: flex;}
.flex.ac{display: flex; align-items: center;}
.flex.jc_sb{justify-content: space-between;}
.text_overflow{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.absolute_center{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

/* 가로값 */
.w_800{width: 240px;}
.w_500{width: 240px;}
.w_240{width: 240px;}

/* 여백값 */
.pt30{padding-top: 30px;}
.pb30{padding-bottom: 30px;}
.pl30{padding-left: 30px;}
.pr30{padding-right: 30px;}

.mt30{margin-top: 30px;}
.mb30{margin-bottom: 30px;}
.ml30{margin-left: 30px;}
.mr30{margin-right: 30px;}

/* 셀렉트, 인풋 */
input{font-family: 'Noto Sans KR', sans-serif;}
select::-ms-expand {display: none;}/* IE */
select{ -o-appearance: none; -webkit-appearance: none; -moz-appearance: none; appearance: none;} /* 기존 폼 제거 */
button{border: 0; cursor: pointer; font-family: 'Noto Sans KR', sans-serif;}

img{max-width: 100%;}
.inner{width: 1520px; margin: 0 auto;}
.cont_inner{display: flex; padding: 0 50px;}

body[data-theme="dark-mode"]{
    background: var(--black);
    color: #fff;
}