/*
	[ size component 사용법 ]
    - input text, textarea, selectbox 등 기본 너비가 100%인 태그에 사이즈 조절이 필요할 경우 사용한다.
*/


/* ********** percentage width ********** */

.w-40pct { width: 40% !important; }
.w-50pct { width: 50% !important; }
.w-100pct { width: 100% !important; }


/* ********** px width ********** */

.w-40px { width: 40px !important; }
.w-50px { width: 50px !important; }
.w-60px { width: 60px !important; }
.w-70px { width: 70px !important; }
.w-80px { width: 80px !important; }
.w-100px { width: 100px !important; }
.w-200px { width: 200px !important; }
.w-300px { width: 300px !important; }
.w-400px { width: 400px !important; }

@media (max-width: 550px) {
	table {
		.w-100px,
		.w-200px,
		.w-300px,
		.w-400px {
			width: 100% !important;
		}
	}
}



/* ********** height ********** */
.h-auto { height: auto !important; }
.h-22px { height: 22px !important; }
.h-25px { height: 25px !important; }
.h-30px { height: 30px !important; }
.h-35px { height: 35px !important; }
.h-80vh { height: 80vh !important; }
.h-100vh { height: 100vh !important; }