/************************************************************
*Author: Ken Chang
************************************************************/
@charset "UTF-8";

:root {

	--mainBodyBGColor: rgba(49, 48, 48, 0);
	--mainBodyBGColorPC: rgb(49, 48, 48);

	--fontColorLightGray: rgb(168 168 168 / 10%);
	--fontColorGray: rgb(230, 238, 240);
	--fontColorDarkGray: rgb(136, 139, 139);
	--fontColorWhite: rgb(255, 255, 255);
	--fontColorGreen:#21f344;
	--fontColorBlue:#4d75f7;
	--fontColorBlack:#000000;
}


/*  Ken Chang for RWD*/

/*33%,  25% (超過 3840px)*/
@media (min-width: 3840px) {
	:root {
		--btnTextSize46: 9.5rem;
		--btnTextSize44: 6.5rem;
		--btnTextSize42: 4.5rem;
		--btnTextSize36: 3.9rem;
		--btnTextSize30: 3.4rem;
		--btnTextSize26: 2.9rem;
		--btnTextSize24: 2.7rem;
		--btnTextSize22: 2.5rem;
		--btnTextSize20: 2.3rem;
		--btnTextSize18: 1.8rem;
		--btnTextSize16: 1.6rem;
		--btnTextSize14: 1.4rem;
	}
}

/*67%,  50% (2560~3840)*/
@media (max-width: 3840px) {
	:root {
		--btnTextSize46: 8.5rem;
		--btnTextSize44: 5.5rem;
		--btnTextSize42: 4.5rem;
		--btnTextSize36: 3.9rem;
		--btnTextSize30: 3.4rem;
		--btnTextSize26: 2.9rem;
		--btnTextSize24: 2.7rem;
		--btnTextSize22: 2.5rem;
		--btnTextSize20: 2.3rem;
		--btnTextSize18: 1.8rem;
		--btnTextSize16: 1.6rem;
		--btnTextSize14: 1.4rem;
	}
}

/*75%, 80%,  90% (1920~2560)*/
@media (max-width: 2560px) {
	:root {
		--btnTextSize46: 7.5rem;
		--btnTextSize44: 5.0rem;
		--btnTextSize42: 3.2rem;
		--btnTextSize36: 2.6rem;
		--btnTextSize30: 2.1rem;
		--btnTextSize26: 1.6rem;
		--btnTextSize24: 1.4rem;
		--btnTextSize22: 1.2rem;
		--btnTextSize20: 1.0rem;
		--btnTextSize18: .8rem;
	}
}
/*100%, 110%,  125%, 150%, 175% (1024~1920)*/
@media (max-width: 1920px) {
	:root {
		--btnTextSize46: 7.5rem;
		--btnTextSize44: 4.3rem;
		--btnTextSize42: 3.0rem;
		--btnTextSize36: 2.4rem;
		--btnTextSize30: 2.0rem;
		--btnTextSize26: 1.6rem;
		--btnTextSize24: 1.4rem;
		--btnTextSize22: 1.2rem;
		--btnTextSize20: 1.0rem;
		--btnTextSize18: .8rem;
	}	
}

/*200%  (768~1024)*/
@media (max-width: 1024px) {
	:root {
		--btnTextSize46: 4.2rem;
		--btnTextSize44: 3.2rem;
		--btnTextSize42: 2.8rem;
		--btnTextSize36: 2.2rem;
		--btnTextSize26: 1.6rem;
		--btnTextSize24: 1.4rem;
		--btnTextSize22: 1.2rem;
		--btnTextSize20: 1.0rem;
		--btnTextSize18: 0.8rem;
	}
}

/*250% ~ 500% (425~768)*/
@media (max-width: 768px) {
	:root {
		--btnTextSize46: 2.6rem;
		--btnTextSize44: 2.4rem;
		--btnTextSize42: 2.2rem;
		--btnTextSize36: 2.0rem;
		--btnTextSize30: 1.8rem;
		--btnTextSize26: 1.6rem;
		--btnTextSize24: 1.4rem;
		--btnTextSize22: 1.2rem;
		--btnTextSize20: 1rem;
		--btnTextSize18: .65rem;

	}
}

/*(375~425)*/
@media (max-width: 425px) {	
	:root {
		--btnTextSize46: 2.4rem;
		--btnTextSize44: 2.2rem;
		--btnTextSize42: 2.0rem;
		--btnTextSize36: 1.8rem;
		--btnTextSize30: 1.6rem;
		--btnTextSize26: 1.4rem;
		--btnTextSize24: 1.2rem;
		--btnTextSize22: .9rem;
		--btnTextSize20: .8rem;
		--btnTextSize18: .7rem;

	}
}

/* (375以下)*/
@media (max-width: 375px) {
	:root {
		--btnTextSize46: 2.4rem;
		--btnTextSize44: 2.4rem;
		--btnTextSize42: 2.2rem;
		--btnTextSize36: 1.4rem;
		--btnTextSize30: 1.3rem;
		--btnTextSize26: 1.2rem;
		--btnTextSize24: 1.0rem;
		--btnTextSize22: .8rem;
		--btnTextSize20: .6rem;
		--btnTextSize18: .5rem;
	}
}