@charset "utf-8";

/* 중복될수 있는건 앞에 eb- 붙이기 */

body.is-pc .ko { font-variant-numeric: tabular-nums;} /* 숫자 가로 폭 동일하게 */

/* ------------------- 기본 */

:root {

	/*color*/
	--color-text:   #333333;

	--color-black:  #000000;
	--color-white:  #FFFFFF;
	--color-sky:    #87CEEB;
	--color-green:  #008000;

	--color-aqua-l:  #B6FFFF;
	--color-aqua:    #00FFFF;
	--color-aqua-sb: #00EEEE;

	--color-red-l:  #ff3232;
	--color-red:    #ff0000;
	--color-red-b:  #c80000;

	--color-gray-th: #FAFAFA; /* 거의 흰색에 가까운 */
	--color-gray-el: #F5F5F5; /* 흐린line, 흰색배경에 쓸만한정도 */
	--color-gray-l:  #E0E0E0; /* line, 화살표아이콘 등 */
	--color-gray-r:  #CCCCCC; /* 흐린아이콘등에 적합 */
	--color-gray-m:  #999999; /* 텍스트 가능컬러, 회색의경우 날짜등 흐린텍스트, 다른컬러는 원색이 너무 진함으로 m을 많이 사용 */
	--color-gray:    #808080; /* 서브텍스트 */

	--color-blue-th: #F5F9FF; 
	--color-blue-el: #DEEDFF; 
	--color-blue-l:  #90C5FF;
	--color-blue-r:  #00aaff;
	--color-blue-m:  #006eff;
	--color-blue:    #0000FF;

	--color-pink-th: #FFF9FA; 
	--color-pink-el: #FFF6F7; 
	--color-pink-l:  #FFEBEE;
	--color-pink-r:  #FFE4E8;
	--color-pink-m:  #FFD2D9;
	--color-pink:    #FFC0CB;
	--color-pink-sb: #FF97A9;
	--color-pink-b:  #FF6E87;
	--color-pink-eb: #FF4565;
	--color-pink-bl: #FF3054;

	--color-hot-pink-r: #FF78C1;
	--color-hot-pink:   #FF1493;
	--color-hot-pink-b: #DA117E;

	--color-orange-th: #FFFBF6;
	--color-orange-el: #FFF1DA;
	--color-orange-l:  #FFE8C2;
	--color-orange-r:  #FFE0AA;
	--color-orange-m:  #FFC766;
	--color-orange:    #FFA500;
	--color-orange-sb: #FF8F00;
	--color-orange-b:  #FF7800; /* 마알 고유색 */
	--color-orange-eb: #FF6100;

	--color-orangered: #FF4500;

	--color-yellow-th: #FFFEF5;
	--color-yellow-el: #FFFFF0;
	--color-yellow-l:  #FFFFDA;
	--color-yellow-r:  #FFFFCC;
	--color-yellow-m:  #FFFF99;
	--color-yellow:    #FFFF00;
	--color-yellow-b:  #FFEB3B; /* 여길넘어가면 골드임 */

	--color-gold:    #FFD700;
	--color-gold-sb: #DAA520;
	--color-gold-b:  #B8860B;

	--color-mg-l: #E6F9FC;
	--color-mg:   #15D0F2;
	--color-mg-b: #07afcd;
	--color-ma-l: #FFE8C2;
	--color-ma:   #FF7800;
	--color-ma-b: #E66B00;
	--color-im-l: #FEE3EF;
	--color-im:   #E50150;
	--color-im-b: #B1124D;
	--color-eb-l: #DEEDFF;
	--color-eb:   #006eff;
	--color-eb-b: #0032ff;

	/*font-size*/
	--font-size_10: 0.625rem;
	--font-size_11: 0.688rem;
	--font-size_12: 0.75rem;
	--font-size_13: 0.813rem;
	--font-size_14: 0.875rem;
	--font-size_15: 0.938rem;
	--font-size_16: 1rem; 
	--font-size_17: 1.0625rem; 
	--font-size_18: 1.125rem;
	--font-size_19: 1.188rem;
	--font-size_20: 1.25rem;
	--font-size_22: 1.375rem; 
	--font-size_24: 1.5rem; 
	--font-size_26: 1.625rem;
	--font-size_28: 1.75rem; 
	--font-size_30: 1.875rem; 
	--font-size_32: 2rem; 
	--font-size_34: 2.125rem; 
	--font-size_36: 2.25rem; 
	--font-size_38: 2.375rem; 
	--font-size_40: 2.5rem; 
	--font-size_42: 2.625rem; 
	--font-size_44: 2.75rem; 
	--font-size_46: 2.875rem; 
	--font-size_48: 3rem; 
	--font-size_50: 3.125rem;
	--font-size_60: 3.75rem;
	--font-size_70: 4.5rem;
	--font-size_80: 5rem;
	--font-size_90: 5.625rem;
	--font-size_100: 6.25rem;

	/*font-weight*/
	--font-th: 100;
	--font-el: 200;
	--font-l:  300;
	--font-r:  400;
	--font-m:  500;
	--font-sb: 600;
	--font-b:  bold;
 	--font-eb: 800;
	--font-bl: 900;

}


/* ------------------- 폰트두꼐 */

.fe-th { font-weight: var(--font-th) !important; }
.fe-el { font-weight: var(--font-el) !important; }
.fe-l  { font-weight: var(--font-l)  !important; }
.fe-r  { font-weight: var(--font-r)  !important; }
.fe-m  { font-weight: var(--font-m)  !important; }
.fe-sb { font-weight: var(--font-sb) !important; }
.fe-b  { font-weight: var(--font-b)  !important; }
.fe-eb { font-weight: var(--font-eb) !important; }
.fe-bl { font-weight: var(--font-bl) !important; }


/* ------------------- 폰트컬러 */

.fc-basic, .fc-basic a{ color: var(--color-text)  !important; }

.fc-l,  .fc-l  a{ color: var(--color-basic-l)  !important; }
.fc-r,  .fc-r  a{ color: var(--color-basic-r)  !important; }
.fc-m,  .fc-m  a{ color: var(--color-basic-m)  !important; }
.fc  ,  .fc    a{ color: var(--color-basic)    !important; }
.fc-b,  .fc-b  a{ color: var(--color-basic-b)  !important; }
.fc-eb, .fc-eb a{ color: var(--color-basic-eb) !important; }

.fc-black,  .fc-black  a{ color: var(--color-black) }
.fc-white,  .fc-white  a{ color: var(--color-white) }
.fc-red,    .fc-red    a{ color: var(--color-red) }
.fc-green,  .fc-green  a{ color: var(--color-green) }
.fc-blue,   .fc-blue   a{ color: var(--color-blue) }
.fc-pink,   .fc-pink   a{ color: var(--color-pink) }
.fc-pink-b, .fc-pink-b a{ color: var(--color-pink-b) }
.fc-aqua,   .fc-aqua   a{ color: var(--color-aqua) }
.fc-orange, .fc-orange a{ color: var(--color-orange) }

.fc-yellow,    .fc-yellow    a{ color: var(--color-yellow) }
.fc-yellow-b,  .fc-yellow-b  a{ color: var(--color-yellow-b) }

.fc-gold,    .fc-gold    a{ color: var(--color-gold) }
.fc-gold-b,  .fc-gold-b  a{ color: var(--color-gold-b) }

.fc-orangered, .fc-orangered a{ color: var(--color-orangered) }

.fc-gray-th, .fc-gray-th  a{ color: var(--color-gray-th) }
.fc-gray-el, .fc-gray-el  a{ color: var(--color-gray-el) }
.fc-gray-l,  .fc-gray-l   a{ color: var(--color-gray-l) }
.fc-gray-r,  .fc-gray-r   a{ color: var(--color-gray-r) }
.fc-gray-m,  .fc-gray-m   a{ color: var(--color-gray-m) }
.fc-gray,    .fc-gray     a{ color: var(--color-gray) }

.fc-mg,    .fc-mg     a{ color: var(--color-mg) }
.fc-ma,    .fc-ma     a{ color: var(--color-ma) }
.fc-im,    .fc-im     a{ color: var(--color-im) }

.fc-manager { color:var(--color-mg-manager); }
.fc-manager.fc-manager a { color:var(--color-mg-manager); }

.fc-review { color: var(--color-basic-b); }
.fc-review.fc-review a { color: var(--color-basic-b); }


/* ------------------- 버튼 */

.eb-btn-basic,
a.eb-btn-basic {background: var(--color-basic); padding:3px 8px; text-align:center; color:#fff ; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-basic:hover {background: var(--color-basic-b); color:#fff;}

.eb-btn-basic-b,
a.eb-btn-basic-b {background: var(--color-basic-b); padding:3px 8px; text-align:center; color:#fff ; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-basic-b:hover {background: var(--color-basic); color:#fff;}

.eb-btn-black,
a.eb-btn-black {background:#000; padding:3px 8px; text-align:center; color:#fff; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-black:hover {background:#000; color:#fff;}

.eb-btn-white,
a.eb-btn-white {background:#ffffff; padding:2px 8px; text-align:center; color:#333; border:1px solid  var(--color-gray-l); border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-white:hover {background:#000; color:#fff;}

.eb-btn-gray-r,
a.eb-btn-gray-r {background: var(--color-gray-r); padding:3px 8px; text-align:center; color:#fff; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-gray-r:hover {background:#000; color:#fff;}

.eb-btn-gray-m,
a.eb-btn-gray-m {background: var(--color-gray-m); padding:3px 8px; text-align:center; color:#fff; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-gray-m:hover {background:#000; color:#fff;}

.eb-btn-gray,
a.eb-btn-gray {background: var(--color-gray); padding:3px 8px; text-align:center; color:#fff; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-gray:hover {background:#000; color:#fff;}

.eb-btn-gray-el,
a.eb-btn-gray-el {background:  var(--color-gray-el); padding:3px 8px; text-align:center; color:#fff ; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-gray-el:hover {background:#000; color:#fff;}

.eb-btn-red,
a.eb-btn-red {background: var(--color-red); padding:3px 8px; text-align:center; color:#fff; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-red:hover {color:#fff;}

.eb-btn-mg,
a.eb-btn-mg {background: var(--color-mg); padding:3px 8px; text-align:center; color:#fff; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-mg:hover {color:#fff;}

.eb-btn-ma,
a.eb-btn-ma {background: var(--color-ma); padding:3px 8px; text-align:center; color:#fff; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-ma:hover {color:#fff;}

.eb-btn-im,
a.eb-btn-im {background: var(--color-im); padding:3px 8px; text-align:center; color:#fff; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-im:hover {color:#fff;}

.eb-btn-manager,
a.eb-btn-manager {background:var(--color-mg-manager); padding:3px 8px; text-align:center; color:#fff; border-radius:5px;font-weight:var(--font-b); display:inline-block;}
.eb-btn-manager:hover {color:var(--color-yellow);}


/* ------------------- 백그라운드 */

.bg-basic, i.bg-basic, .badge.bg-basic { 
	background-color: var(--color-basic); 
	color: #fff; 
}
.bg-basic-l, i.bg-basic-l, .badge.bg-basic-l { 
	background-color: var(--color-basic-l); 
	color: var(--color-basic-b) !important; 
}
.bg-black, i.bg-black, .badge.bg-black { 
	background-color: var(--color-black); 
	color: #fff; 
}
.bg-white, i.bg-white, .badge.bg-white { 
	background-color: var(--color-white); 
	color: #000; 
}
.bg-red, i.bg-red, .badge.bg-red { 
	background-color: var(--color-red); 
	color: #fff; 
}
.bg-blue, i.bg-blue, .badge.bg-blue { 
	background-color: var(--color-blue); 
	color: #fff; 
}
.bg-pink-th, i.bg-pink-th, .badge.bg-pink-th { 
	background-color: var(--color-pink-th); 
	color: var(--color-pink-b) !important; 
}
.bg-pink, i.bg-pink, .badge.bg-pink { 
	background-color: var(--color-pink); 
	color: #fff; 
}
.bg-pink-b, i.bg-pink-b, .badge.bg-pink-b { 
	background-color: var(--color-pink-b); 
	color: #fff; 
}
.bg-aqua, i.bg-aqua, .badge.bg-aqua { 
	background-color: var(--color-aqua); 
	color: #fff; 
}
.bg-gray-el, i.bg-gray-el, .badge.bg-gray-el { 
	background-color: var(--color-gray-el); 
}
.bg-gray-l, i.bg-gray-l, .badge.bg-gray-l { 
	background-color: var(--color-gray-l); 
}
.bg-gray, i.bg-gray, .badge.bg-gray { 
	background-color: var(--color-gray); 
	color: #fff; 
}
.bg-orange-l, i.bg-orange-l, .badge.bg-orange-l { 
	background-color: var(--color-orange-l); 
	color: var(--color-orange-b) !important; 
}
.bg-orange, i.bg-orange, .badge.bg-orange { 
	background-color: var(--color-orange); 
	color: #fff; 
}
.bg-sky, i.bg-sky, .badge.bg-sky { 
	background-color: var(--color-sky); 
}
.bg-yellow, i.bg-yellow, .badge.bg-yellow { 
	background-color: var(--color-yellow); 
	color: #fff; 
}
.bg-yellow-b, i.bg-yellow-b, .badge.bg-yellow-b { 
	background-color: var(--color-yellow-b); 
	color: #fff; 
}
.bg-orangered, i.bg-orangered, .badge.bg-orangered { 
	background-color: var(--color-orangered); 
	color: #fff; 
}
.bg-mg, i.bg-mg, .badge.bg-mg { 
	background-color: var(--color-mg);
	color: #fff; 
}
.bg-ma, i.bg-ma, .badge.bg-ma { 
	background-color: var(--color-ma); 
	color: #fff; 
}
.bg-im, i.bg-im, .badge.bg-im { 
	background-color: var(--color-im); 
	color: #fff; 
}


/* ------------------- 공간, 미디어별 */

.w33  { width:33% !important; }
.w45  { width:45% !important; }
.w49  { width:49% !important; }
.w50  { width:50% !important; }
.w70  { width:70% !important; }
.w99  { width:99% !important; }
.w100 { width:100%  !important;}
.w200 { width:200px !important; }

.w100px { width:100px !important; }
.w200px { width:200px !important; }

.max-w1000 { max-width:1000px !important; }

@media (min-width: 1024px) { /* 테블릿이상 */

	.lg-start-none { display:none !important} 
	.lg-start-border-top { border-top:1px solid  var(--color-gray-l); }

}

@media (max-width: 1023px) { /* 테블릿까지 */

	.md-end-none { display:none !important} 
	.md-end-flexww { flex-wrap:Wrap} 
	.md-end-w100 { width:100% !important}

}

@media (min-width: 768px) { /* 모바일이상 */

	.sm-br{ display:none !important} 

	.md-start-none { display:none !important} 
	.md-w60px {width:60px !important} 
	.md-w80px {width:80px !important} 
	.md-w100px {width:100px !important} 
	.md-w120px {width:120px !important} 
	.md-w140px {width:140px !important}
}

@media (max-width: 767px) {  /* 모바일이하 */

	.sm-flexww {flex-wrap:Wrap }
	
	.sm-br { display:block !important} 
	.sm-none { display:none !important} 

	.sm-w40px {width:40px !important} 
	.sm-w60px {width:60px !important} 
	.sm-w80px {width:80px !important} 

	.sm-w38 {width:38% !important} 
	.sm-w40 {width:40% !important} 
	.sm-w41 {width:41% !important} 
	.sm-w43 {width:43% !important} 
	.sm-w45 {width:45% !important} 
	.sm-w48 {width:48% !important} 
	.sm-w50 {width:50% !important} 
	.sm-w53 {width:53% !important} 
	.sm-w55 {width:55% !important} 
	.sm-w58 {width:58% !important} 
	.sm-w60 {width:60% !important} 
	.sm-w80 {width:80% !important} 
	.sm-w100 { width:100% !important}

}

@media (min-width: 480px) { /* 480 이상 */

}


@media (max-width: 479px) { /* 479 까지 */

}

@media all and (min-width:480px) and (max-width:1023px) {

}


/* ------------------- 폰트사이즈 */

.fs0 { font-size: 0 !important; }
.fs10 { font-size: var(--font-size_10) !important; }
.fs11 { font-size: var(--font-size_11) !important; }
.fs12 { font-size: var(--font-size_12) !important; }
.fs13 { font-size: var(--font-size_13) !important; }
.fs14 { font-size: var(--font-size_14) !important; }
.fs15 { font-size: var(--font-size_15) !important; }
.fs16 { font-size: var(--font-size_16) !important; }     /* 기준 */
.fs17 { font-size: var(--font-size_17) !important; }
.fs18 { font-size: var(--font-size_18) !important; }
.fs19 { font-size: var(--font-size_19) !important; }
.fs20 { font-size: var(--font-size_20) !important; }
.fs22 { font-size: var(--font-size_22) !important; }
.fs24 { font-size: var(--font-size_24) !important; }
.fs26 { font-size: var(--font-size_26) !important; }
.fs28 { font-size: var(--font-size_28) !important; }
.fs30 { font-size: var(--font-size_30) !important; }
.fs32 { font-size: var(--font-size_32) !important; }
.fs34 { font-size: var(--font-size_34) !important; }
.fs36 { font-size: var(--font-size_36) !important; }
.fs38 { font-size: var(--font-size_38) !important; }
.fs40 { font-size: var(--font-size_40) !important; }
.fs42 { font-size: var(--font-size_42) !important; }
.fs43 { font-size: var(--font-size_43) !important; }
.fs44 { font-size: var(--font-size_44) !important; }
.fs46 { font-size: var(--font-size_46) !important; }
.fs48 { font-size: var(--font-size_48) !important; }
.fs49 { font-size: var(--font-size_49) !important; }
.fs50 { font-size: var(--font-size_50) !important; }
.fs60 { font-size: var(--font-size_60) !important; }
.fs70 { font-size: var(--font-size_70) !important; }
.fs80 { font-size: var(--font-size_80) !important; }
.fs90 { font-size: var(--font-size_90) !important; }
.fs100 { font-size: var(--font-size_100) !important; }


@media (min-width: 1024px) { /* 모바일,테블릿이상 */

	.md-fs10 { font-size: var(--font-size_10) !important; }
	.md-fs11 { font-size: var(--font-size_11) !important; }
	.md-fs12 { font-size: var(--font-size_12) !important; }
	.md-fs13 { font-size: var(--font-size_13) !important; }
	.md-fs14 { font-size: var(--font-size_14) !important; }
	.md-fs16 { font-size: var(--font-size_16) !important; }
	.md-fs18 { font-size: var(--font-size_18) !important; }
	.md-fs20 { font-size: var(--font-size_20) !important; }
	.md-fs22 { font-size: var(--font-size_22) !important; }
	.md-fs24 { font-size: var(--font-size_24) !important; }
	.md-fs26 { font-size: var(--font-size_26) !important; }
	.md-fs28 { font-size: var(--font-size_28) !important; }
	.md-fs30 { font-size: var(--font-size_30) !important; }
	.md-fs32 { font-size: var(--font-size_32) !important; }
	.md-fs34 { font-size: var(--font-size_34) !important; }
	.md-fs36 { font-size: var(--font-size_36) !important; }
	.md-fs38 { font-size: var(--font-size_38) !important; }
	.md-fs40 { font-size: var(--font-size_40) !important; }
	.md-fs50 { font-size: var(--font-size_50) !important; }
	.md-fs60 { font-size: var(--font-size_60) !important; }

}

@media (max-width: 1023px) { /* 모바일,테블릿까지 */

	.sm-fs10 { font-size: var(--font-size_10) !important; }
	.sm-fs11 { font-size: var(--font-size_11) !important; }
	.sm-fs12 { font-size: var(--font-size_12) !important; }
	.sm-fs13 { font-size: var(--font-size_13) !important; }
	.sm-fs14 { font-size: var(--font-size_14) !important; }
	.sm-fs16 { font-size: var(--font-size_16) !important; }
	.sm-fs18 { font-size: var(--font-size_18) !important; }
	.sm-fs20 { font-size: var(--font-size_20) !important; }
	.sm-fs22 { font-size: var(--font-size_22) !important; }
	.sm-fs24 { font-size: var(--font-size_24) !important; }
	.sm-fs26 { font-size: var(--font-size_26) !important; }
	.sm-fs28 { font-size: var(--font-size_28) !important; }
	.sm-fs30 { font-size: var(--font-size_30) !important; }
	.sm-fs32 { font-size: var(--font-size_32) !important; }
	.sm-fs34 { font-size: var(--font-size_34) !important; }
	.sm-fs36 { font-size: var(--font-size_36) !important; }
	.sm-fs38 { font-size: var(--font-size_38) !important; }
	.sm-fs40 { font-size: var(--font-size_40) !important; }
	.sm-fs50 { font-size: var(--font-size_50) !important; }
	.sm-fs60 { font-size: var(--font-size_60) !important; }

}


/* ------------------- margin, padding */

.px1  { padding-left: 1px !important; padding-right: 1px !important; } 
.px2  { padding-left: 2px !important; padding-right: 2px !important; } 
.px3  { padding-left: 3px !important; padding-right: 3px !important; } 
.px4  { padding-left: 4px !important; padding-right: 4px !important; } 
.px5  { padding-left: 5px !important; padding-right: 5px !important; } 
.px6  { padding-left: 6px !important; padding-right: 6px !important; } 
.px7  { padding-left: 7px !important; padding-right: 7px !important; } 
.px8  { padding-left: 8px !important; padding-right: 8px !important; } 
.px9  { padding-left: 9px !important; padding-right: 9px !important; } 
.px10 { padding-left:10px !important; padding-right:10px !important; } 
.px15 { padding-left:15px !important; padding-right:15px !important; } 
.px20 { padding-left:20px !important; padding-right:20px !important; } 
.px25 { padding-left:25px !important; padding-right:25px !important; } 
.px30 { padding-left:30px !important; padding-right:30px !important; } 
.px40 { padding-left:40px !important; padding-right:40px !important; } 
.px50 { padding-left:50px !important; padding-right:50px !important; } 
.px60 { padding-left:60px !important; padding-right:60px !important; } 
.px70 { padding-left:70px !important; padding-right:70px !important; } 
.px80 { padding-left:80px !important; padding-right:80px !important; } 
.px90 { padding-left:90px !important; padding-right:90px !important; } 
.px100 { padding-left:100px !important; padding-right:100px !important; } 

.py1  { padding-top: 1px !important; padding-bottom: 1px !important; } 
.py2  { padding-top: 2px !important; padding-bottom: 2px !important; } 
.py3  { padding-top: 3px !important; padding-bottom: 3px !important; } 
.py4  { padding-top: 4px !important; padding-bottom: 4px !important; } 
.py5  { padding-top: 5px !important; padding-bottom: 5px !important; } 
.py6  { padding-top: 6px !important; padding-bottom: 6px !important; } 
.py7  { padding-top: 7px !important; padding-bottom: 7px !important; } 
.py8  { padding-top: 8px !important; padding-bottom: 8px !important; } 
.py9  { padding-top: 9px !important; padding-bottom: 9px !important; } 
.py10 { padding-top:10px !important; padding-bottom:10px !important; } 
.py15 { padding-top:15px !important; padding-bottom:15px !important; }
.py20 { padding-top:20px !important; padding-bottom:20px !important; }
.py25 { padding-top:25px !important; padding-bottom:25px !important; }
.py30 { padding-top:30px !important; padding-bottom:30px !important; } 
.py40 { padding-top:40px !important; padding-bottom:40px !important; } 
.py50 { padding-top:50px !important; padding-bottom:50px !important; } 
.py60 { padding-top:60px !important; padding-bottom:60px !important; } 
.py70 { padding-top:70px !important; padding-bottom:70px !important; } 
.py80 { padding-top:80px !important; padding-bottom:80px !important; } 
.py90 { padding-top:90px !important; padding-bottom:90px !important; } 
.py100 { padding-top:100px !important; padding-bottom:100px !important; } 

@media (min-width: 1024px) { /* 모바일,테블릿이상 */

  .md-px5  { padding-left:5px  !important; padding-right:5px !important; }
  .md-px10 { padding-left:10px !important; padding-right:10px !important; }
  .md-px15 { padding-left:15px !important; padding-right:15px !important; }
  .md-px20 { padding-left:20px !important; padding-right:20px !important; }
  .md-px25 { padding-left:25px !important; padding-right:25px !important; }
  .md-px30 { padding-left:30px !important; padding-right:30px !important; }

}

@media (max-width: 1023px) { /* 모바일,테블릿까지 */

  .sm-px5  { padding-left:5px  !important; padding-right:5px !important; }
  .sm-px10 { padding-left:10px !important; padding-right:10px !important; }
  .sm-px15 { padding-left:15px !important; padding-right:15px !important; }
  .sm-px20 { padding-left:20px !important; padding-right:20px !important; }
  .sm-px25 { padding-left:25px !important; padding-right:25px !important; }
  .sm-px30 { padding-left:30px !important; padding-right:30px !important; }

}

.pd0 { padding:0px !important; } 
.pd1 { padding:1px !important; } 
.pd2 { padding:2px !important; } 
.pd3 { padding:3px !important; } 
.pd4 { padding:4px !important; } 
.pd5 { padding:5px !important; } 
.pd10 { padding:10px !important; } 
.pd15 { padding:15px !important; } 
.pd20 { padding:20px !important; } 
.pd25 { padding:25px !important; } 
.pd30 { padding:30px !important; } 
.pd40 { padding:40px !important; } 
.pd50 { padding:50px !important; } 

.mg0 { margin:0px !important }
.mg1 { margin:1px !important; } 
.mg2 { margin:2px !important; } 
.mg3 { margin:3px !important; } 
.mg4 { margin:4px !important; } 
.mg5 { margin:5px !important; } 
.mg10 { margin:10px !important; } 
.mg15 { margin:15px !important; } 
.mg20 { margin:20px !important; } 
.mg25 { margin:25px !important; } 
.mg30 { margin:30px !important; } 
.mg35 { margin:35px !important; } 
.mg40 { margin:40px !important; } 
.mg45 { margin:45px !important; } 
.mg50 { margin:50px !important; } 

.mt0 { margin-top:0px !important}
.mt1 { margin-top:1px !important; } 
.mt2 { margin-top:2px !important; } 
.mt3 { margin-top:3px !important; } 
.mt4 { margin-top:4px !important; } 
.mt5 { margin-top:5px !important; }  
.mt10 { margin-top: 10px !important; }  
.mt12 { margin-top: 12px !important; }  
.mt15 { margin-top: 15px !important; } 
.mt18 { margin-top: 18px !important; }  
.mt20 { margin-top: 20px !important; } 
.mt25 { margin-top: 25px !important; } 
.mt30 { margin-top: 30px !important; } 
.mt33 { margin-top: 33px !important; } 
.mt36 { margin-top: 36px !important; } 
.mt40 { margin-top: 40px !important; } 
.mt50 { margin-top: 50px !important; } 
.mt62 { margin-top: 62px !important; } 
.mt70 { margin-top: 70px !important; } 
.mt80 { margin-top: 80px !important; } 
.mt90 { margin-top: 90px !important; } 
.mt100 { margin-top: 100px !important; }
.mt110 { margin-top: 110px !important; }
.mt120 { margin-top: 120px !important; }
.mt130 { margin-top: 130px !important; }
.mt140 { margin-top: 140px !important; }
.mt150 { margin-top: 150px !important; }
.mt200 { margin-top: 200px !important; }

.pt0 { padding-top:0px !important;}
.pt1 { padding-top:1px !important; }
.pt2 { padding-top:2px !important; }
.pt3 { padding-top:3px !important; }
.pt4 { padding-top:4px !important; }
.pt5 { padding-top:5px !important; }
.pt10 { padding-top:10px !important; }
.pt15 { padding-top:15px !important; }
.pt20 { padding-top:20px !important; }
.pt30 { padding-top:30px !important; }
.pt40 { padding-top:40px !important; }
.pt50 { padding-top:50px !important; }
.pt60 { padding-top:60px !important; }
.pt70 { padding-top:70px !important; }
.pt80 { padding-top:80px !important; }
.pt90 { padding-top:90px !important; }
.pt100 { padding-top:100px !important; }

.mr0 { margin-right:0px !important; }
.mr1 { margin-right:1px !important; }
.mr2 { margin-right:2px !important; }
.mr3 { margin-right:3px !important; }
.mr4 { margin-right:4px !important; }
.mr5  { margin-right:5px !important; }
.mr8  { margin-right:8px !important; }
.mr10 { margin-right:10px !important; }
.mr18 { margin-right:18px !important; } 
.mr20 { margin-right:20px !important; }

.pr0 { padding-right:0px !important; }
.pr1 { padding-right:1px !important; }
.pr2 { padding-right:2px !important; }
.pr3 { padding-right:3px !important; }
.pr4 { padding-right:4px !important; }
.pr5 { padding-right:5px !important; }
.pr6 { padding-right:6px !important; }
.pr7 { padding-right:7px !important; }
.pr8 { padding-right:8px !important; }
.pr9 { padding-right:9px !important; }
.pr10 { padding-right:10px !important; }
.pr15 { padding-right:15px !important; }
.pr20 { padding-right:20px !important; }

.mb0 { margin-bottom: 0px !important; }
.mb1 { margin-bottom: 1px !important; }
.mb2 { margin-bottom: 2px !important; }
.mb3 { margin-bottom: 3px !important; }
.mb4 { margin-bottom: 4px !important; }
.mb5 { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb25 { margin-bottom: 25px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb33 { margin-bottom: 33px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb50 { margin-bottom: 50px !important; }
.mb70 { margin-bottom: 70px !important; }
.mb100 { margin-bottom: 100px !important; }
.mb300 { margin-bottom: 300px !important; }

.pb0  { padding-bottom:0 !important;}
.pb1  { padding-bottom:1px !important;}
.pb2  { padding-bottom:2px !important; }
.pb3  { padding-bottom:3px !important; }
.pb4  { padding-bottom:4px !important; }
.pb5  { padding-bottom:5px !important; }
.pb9  { padding-bottom:9px !important; }
.pb10 { padding-bottom:10px !important; }
.pb15 { padding-bottom:15px !important; }
.pb20 { padding-bottom:20px !important; }
.pb30 { padding-bottom:30px !important; }
.pb40 { padding-bottom:40px !important; }
.pb50 { padding-bottom:50px !important; }
.pb100 { padding-bottom:100px !important; }
.pb300 { padding-bottom:300px !important; }

.ml0  { margin-left:0px !important; }
.ml1  { margin-left:1px !important; }
.ml2  { margin-left:2px !important; }
.ml3  { margin-left:3px !important; }
.ml4  { margin-left:4px !important; }
.ml5  { margin-left:5px !important; }
.ml8  { margin-left:8px !important; }
.ml10 { margin-left:10px !important; }
.ml11 { margin-left:11px !important; }
.ml20 { margin-left:20px !important; }
.ml30 { margin-left:30px !important; }
.ml40 { margin-left:40px !important; }
.ml50 { margin-left:50px !important; }
.ml60 { margin-left:60px !important; }
.ml70 { margin-left:70px !important; }
.ml80 { margin-left:80px !important; }
.ml90 { margin-left:90px !important; }
.ml100 { margin-left:100px !important; }

.pl0  { padding-left:0px !important;}
.pl1  { padding-left:1px !important;}
.pl2  { padding-left:2px !important;}
.pl3  { padding-left:3px !important;}
.pl4  { padding-left:4px !important; }
.pl5  { padding-left:5px !important; }
.pl7  { padding-left:7px !important; }
.pl8  { padding-left:8px !important; }
.pl10 { padding-left:10px !important; }

@media (min-width: 1024px) { /* 모바일,테블릿이상 */

	.md-mt0 { margin-top: 0px !important; }
	.md-mt1 { margin-top: 1px !important; }
	.md-mt5 { margin-top: 5px !important; }
	.md-mt10 { margin-top: 10px !important; }
	.md-mt15 { margin-top: 15px !important; }
	.md-mt20 { margin-top: 20px !important; }
	.md-mt25 { margin-top: 25px !important; }
	.md-mt30 { margin-top: 30px !important; }
	.md-mt40 { margin-top: 40px !important; }
	.md-mt50 { margin-top: 50px !important; }
	.md-mt55 { margin-top: 55px !important; }
	.md-mt70 { margin-top: 70px !important; }
	.md-mt80 { margin-top: 80px !important; }
	.md-mt90 { margin-top: 90px !important; }
	.md-mt100 { margin-top: 100px !important; }
	.md-mt150 { margin-top: 150px !important; }
	.md-mt200 { margin-top: 200px !important; }
	.md-mt210 { margin-top: 210px !important; }
	.md-mt220 { margin-top: 220px !important; }
	.md-mt230 { margin-top: 230px !important; }
	.md-mt240 { margin-top: 240px !important; }
	.md-mt250 { margin-top: 250px !important; }

	.md-pt0 { padding-top:0px !important; }
	.md-pt1 { padding-top:1px !important; }
	.md-pt10 { padding-top:10px !important; }
	.md-pb20 { padding-bottom:20px !important; }

	.md-mr18 { margin-right: 18px !important; }

	.md-mb2 { margin-bottom: 2px !important; }
	.md-mb4 { margin-bottom: 4px !important; }
	.md-mb5 { margin-bottom: 5px !important; }
	.md-mb7 { margin-bottom: 7px !important; }
	.md-mb10 { margin-bottom: 10px !important; }
	.md-mb15 { margin-bottom: 15px !important; }
	.md-mb20 { margin-bottom: 20px !important; }
	.md-mb30 { margin-bottom: 30px !important; }
	.md-mb40 { margin-bottom: 40px !important; }
	.md-mb60 { margin-bottom: 60px !important; }

	.md-ml15 { margin-left: 15px !important; }
}

@media (max-width: 1023px) { /* 모바일,테블릿까지 */

	.sm-mt1  { margin-top: 1px !important; }
	.sm-mt2  { margin-top: 2px !important; }
	.sm-mt5  { margin-top: 5px !important; }
	.sm-mt8  { margin-top: 8px !important; }
	.sm-mt10 { margin-top: 10px !important; }
	.sm-mt15 { margin-top: 15px !important; }
	.sm-mt20 { margin-top: 20px !important; }
	.sm-mt25 { margin-top: 25px !important; }
	.sm-mt30 { margin-top: 30px !important; }
	.sm-mt40 { margin-top: 40px !important; }
	.sm-mt50 { margin-top: 50px !important; }
	.sm-mt60 { margin-top: 60px !important; }
	.sm-mt70 { margin-top: 70px !important; }
	.sm-mt80 { margin-top: 80px !important; }
	.sm-mt90 { margin-top: 90px !important; }
	.sm-mt100 { margin-top: 100px !important; }
	.sm-mt110 { margin-top: 110px !important; }
	.sm-mt120 { margin-top: 120px !important; }
	.sm-mt130 { margin-top: 130px !important; }
	.sm-mt140 { margin-top: 140px !important; }
	.sm-mt150 { margin-top: 150px !important; }
	.sm-mt200 { margin-top: 200px !important; }

	.sm-pt1 { padding-top:1px !important; }
	.sm-pt10 { padding-top:10px !important; }
	.sm-pt20 { padding-top:20px !important; }
	.sm-pt40 { padding-top:40px !important; }

	.sm-mr14 { margin-right: 14px !important; }
	.sm-mr16 { margin-right: 16px !important; }
	.sm-mr18 { margin-right: 18px !important; }

	.sm-mb2  { margin-bottom: 2px !important; }
	.sm-mb3  { margin-bottom: 3px !important; }
	.sm-mb5  { margin-bottom: 5px !important; }
	.sm-mb10 { margin-bottom: 10px !important; }
	.sm-mb15 { margin-bottom: 15px !important; }
	.sm-mb20 { margin-bottom: 20px !important; }
	.sm-mb30 { margin-bottom: 30px !important; }
	.sm-mb40 { margin-bottom: 40px !important; }
	.sm-mb60 { margin-bottom: 60px !important; }
	.sm-mb65 { margin-bottom: 65px !important; }
	.sm-mb70 { margin-bottom: 70px !important; }
	.sm-mb80 { margin-bottom: 80px !important; }

	.sm-pb10 { padding-bottom:10px !important; }
	.sm-pb20 { padding-bottom:20px !important; }
}

@media (min-width:1024px) and (max-width:1279px) { /* 노트북 & 테블릿이상까지*/  

	.mdsm-pt1 { padding-top:1px !important; }
}


/* ------------------- line-height 줄간격 */

.lh14 { line-height:14px !important; }
.lh15 { line-height:15px !important; }
.lh20 { line-height:20px !important; }
.lh25 { line-height:25px !important; }
.lh30 { line-height:30px !important; }
.lh35 { line-height:35px !important; }
.lh40 { line-height:40px !important; }
.lh60 { line-height:60px !important; }

.lh0-8 { line-height:0.8;} 
.lh0-9 { line-height:0.9;} 
.lh1   { line-height:1;} 
.lh1-1 { line-height:1.1;} 
.lh1-2 { line-height:1.2;} 
.lh1-3 { line-height:1.3;} 
.lh1-5 { line-height:1.5;} 
.lh1-8 { line-height:1.8;} 
.lh2   { line-height:2;} 
.lh2-2 { line-height:2.2;} 
.lh2-3 { line-height:2.3;} 
.lh2-4 { line-height:2.4;} 

@media (min-width: 768px) {  /* 모바일화면 이상 */

	.md-lh0-8 { line-height:0.8;} 
	.md-lh60 { line-height:60px !important; }

}

@media (max-width: 767px) { /* 모바일기기전용 */

	.sm-lh0-9 { line-height:0.9;} 
	.sm-lh1-1 { line-height:1.1;} 
	.sm-lh40 { line-height:40px !important; }

}