*{ font-family: Pretendard; margin:0; padding:0; box-sizing: border-box; outline:0 !important;}

html,body,h1,h2,h3,h4,h5,h6,div,p,blockquote,pre,code,address,ul,ol,li,menu,nav,section,article,aside,
dl,dt,dd,table,thead,tbody,tfoot,label,caption,th,td,form,fieldset,legend,hr,input,button,textarea,object,figure,figcaption {margin:0;padding:0;}

ul,li { list-style: none; }

a { text-decoration: none; }
table{ width:100%; border-spacing:0; border-collapse:collapse; }

/* 폰트 px 기준값 설정정*/
/* html, body { font-size: 10px; width:100%; } */
html, body { width:100%; }
body{width:100%; min-width:320px; -webkit-text-size-adjust:none; word-wrap:break-word; word-break:break-all; }
body,input,select,textarea,button { border:none; }

select:focus,
textarea:focus,
input:focus { border: 1px solid #e5e5ec;}

:root {
    /* 컬러 */
    --color-background : #f7f7fb;
    --color-white : #fff;
    --color-black : #111;
    --color-main : #3F96FB;

    /* 폰트 컬러 */
    --font-default : #111;
    --font-sub : #767676;
    --font-disable : #999;

    /* border 컬러 */
    --input-gray : #e5e5ec;

    /* 폰트 사이즈 */
    --fs-10 : 1px;
    --fs-11 : 11px;
    --fs-12 : 12px;
    --fs-13 : 13px;
    --fs-14 : 14px;
    --fs-15 : 15px;
    --fs-16 : 16px;
    --fs-18 : 18px;
    --fs-20 : 20px;
    --fs-22 : 22px;
    --fs-24 : 24px;
    --fs-28 : 28px;
    --fs-32 : 32px;
    --fs-36 : 36px;
    --fs-42 : 42px;
    --fs-48 : 48px;
    --fs-62 : 62px;

    /* 폰트 굵기 */
    --fw-100 : 100;
    --fw-200 : 200;
    --fw-300 : 300;
    --fw-400 : 400;
    --fw-500 : 500;
    --fw-600 : 600;
    --fw-700 : 700;

    /* 여백 관련*/
    --p4 : 4px;
    --p6 : 6px;
    --p8 : 8px;
    --p10 : 10px;
    --p12 : 12px;
    --p16 : 16px;
    --p20 : 20px;
    --p24 : 24px;
    --p28 : 28px;
    --p32 : 32px;
    --p36 : 36px;
    --p40 : 40px;
    --p42 : 42px;
    --p48 : 48px;
}

/* display 관련 */
.d-flex { display: flex !important; }
.flex-d-c { flex-direction: column; }
.flex-d-r { flex-direction: row; }
.d-grid { display: grid; }

.align-c { align-items: center; }
.align-s { align-items: start; }
.align-e { align-items: end; }

.justify-s { justify-content: start; }
.justify-c { justify-content: center; }
.justify-end { justify-content: end; }
.justify-space-between { justify-content: space-between; }
.justify-space-around { justify-content: space-around; }

.g-4 { gap: var(--p4); }
.g-6 { gap: var(--p6);; }
.g-8 { gap: var(--p8) }
.g-10 { gap: var(--p10); }
.g-12 { gap: var(--p12); }
.g-16 { gap: var(--p16); }
.g-20 { gap: var(--p20); }
.g-24 { gap: var(--p24); }
.g-28 { gap: var(--p28); }
.g-32 { gap: var(--p32); }
.g-36 { gap: var(--p36); }
.g-40 { gap: var(--p40); }
.g-42 { gap: var(--p42); }

.f-1 { flex:1; }
.f-2 { flex:2; }
.f-3 { flex:3; }
.f-4 { flex:4; }
.f-5 { flex:5; }
.f-6 { flex:6; }

/* 여백 관련 */
.p-4 { padding: var(--p4); }
.p-6 { padding: var(--p6); }
.p-8 { padding: var(--p8); }
.p-10 { padding: var(--p10); }
.p-12 { padding: var(--p12); }
.p-16 { padding: var(--p16); }
.p-20 { padding: var(--p20); }
.p-24 { padding: var(--p24); }
.p-28 { padding: var(--p28); }
.p-32 { padding: var(--p32); }
.p-36 { padding: var(--p36); }
.p-42 { padding: var(--p42); }

/* 컨텐츠 아이템 관련 */
.c-bg { background-color: var(--color-white); box-shadow: 0px 4px 10px -1px rgba(0,0,0,0.08);}
.c-bg-border { background-color: var(--color-white); border: 1px solid #e5e5ec; }

/* 폰트 관련 */
.fs-10 { font-size: var(--fs-10); }
.fs-11 { font-size: var(--fs-11); }
.fs-12 { font-size: var(--fs-12); }
.fs-13 { font-size: var(--fs-13); }
.fs-14 { font-size: var(--fs-14)!important; }
.fs-16 { font-size: var(--fs-16); }
.fs-18 { font-size: var(--fs-18); }
.fs-20 { font-size: var(--fs-20); }
.fs-24 { font-size: var(--fs-24); }
.fs-28 { font-size: var(--fs-28); }
.fs-32 { font-size: var(--fs-32); }
.fs-36 { font-size: var(--fs-36); }
.fs-42 { font-size: var(--fs-42); }
.fs-48 { font-size: var(--fs-48); }

.fw-100 { font-weight: var(--fw-100); }
.fw-200 { font-weight: var(--fw-200); }
.fw-300 { font-weight: var(--fw-300); }
.fw-400 { font-weight: var(--fw-400); }
.fw-500 { font-weight: var(--fw-500); }
.fw-600 { font-weight: var(--fw-600); }
.fw-700 { font-weight: var(--fw-700); }

/* 사이즈 관련 */
.w-0 { width:0; }
.w-10 { width: 10%; }
.w-20 { width: 20%; }
.w-25 { width: 25%; }
.w-30 { width: 30%; }
.w-33 { width: 33.333%; }
.w-35 { width: 35%; }
.w-40 { width: 40%; }
.w-45 { width: 45%; }
.w-50 { width: 50%; }
.w-55 { width: 55%; }
.w-60 { width: 60%; }
.w-70 { width: 70%; }
.w-80 { width: 80%; }
.w-90 { width: 90%; }
.w-100 { width: 100%; }
.m-w-0 { min-width:0; }

.h-10 { height: 10%; }
.h-20 { height: 20%; }
.h-25 { height: 25%; }
.h-30 { height: 30%; }
.h-40 { height: 40%; }
.h-50 { height: 50%; }
.h-60 { height: 60%; }
.h-70 { height: 70%; }
.h-75 { height: 75%; }
.h-80 { height: 80%; }
.h-90 { height: 90%; }
.h-100 { height: 100%; }
.m-h-0 { min-height:0; }

.custom-btn {
	border: 0;
	outline: 0;
	padding: 4px 10px;
	border: 1px solid var(--input-gray);
	border-radius: 3px;
	background: transparent;	
	display: inline-flex;
    align-items: center;
    gap: 8px;
}

.custom_input {
/*     border: 1px solid #e5e5ec; */
/*     background-color: #fff !important; */
    border-radius: 3px;
    padding: 0 4px;
    font-size: 14px;
    height: 32px;
    outline:0;
}

.readonly {
	background-color: #f7f7f7 !important;
}

.resizer {	
    border-radius: 6px;
   	background: linear-gradient(90deg, #e5e5ec, #dbdbdb, #b0b0b0);
}  

.resizer.horizontal { cursor: ew-resize; width: 8px; }
.resizer.vertical { cursor: n-resize; height: 8px; }

.note-btn.note-btn-primary.note-image-btn { background-color: #4772ad !important; }

.note-editor .note-editable {
    font-family: 'Pretendard'!important;
}

.note-editor .dropdown-menu .note-btn-fontname[data-value="Pretendard"],
.note-current-fontname {
    font-family: 'Pretendard' !important;
}

.dropdown-toggle:after { display: none !important;}