﻿/*外連字型*/
/*Noto+Sans|Open Sans
@import url('//fonts.googleapis.com/css2?family=Noto+Sans+TC&family=Noto+Serif+TC:wght@200..900&display=swap');
@import url('//fonts.googleapis.com/css2?family=Mulish:wght@200;400;628&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@100&display=swap');
*/


.raleway-100 {
  font-family: "Raleway", sans-serif;
  font-optical-sizing: auto;
  font-weight: 100;
  font-style: normal;
}

.raleway-400 {
	 font-weight: 400;
}

/*全域變數*/

:root{
	--aniFN:cubic-bezier(0.86, 0.04, 0.9, 0.05);
	--shadow-s:drop-shadow(5px 5px 3px rgba(0, 0, 0, .1));
	--shadow:drop-shadow(5px 5px 3px rgba(0, 0, 0, .2));
	--shadowImg:drop-shadow(8px 8px 3px rgba(0, 0, 0, .2));

	--shadowBox:drop-shadow(0px 0px 8px rgba(0, 0, 0, .5));


	/*mask*/
	
	--maskLStart: polygon(0 0, 0 0, 0 100%, 0 100%);
	--maskRStart: polygon(100% 0, 100% 0, 0 100%, 0 100%);

	--maskTStart: polygon(0 0, 100% 0,  100% 0, 0 0);
	--maskBStart: polygon(0 100%, 100% 100%,  100% 100%, 0 100%);

	--maskEnd: polygon(0 0, 100% 0%, 100% 100%, 0 100%);

	/*animate*/
	--easeBack: cubic-bezier(0.02, 1.63, 0.63, 1.19);
	--easeIn: cubic-bezier(0.01, 0.88, 0, 0.94);;

	/*layout*/
	--headerH:80px;
	--hamburgerH:70px;

	--imgCircle:300px;

	/*font*/
	--cn: "Noto Sans TC";
	--cn2: "Noto Serif TC";
	--en: 'Mulish';

	/*color*/
	--gold:#bca779;
	--gold2:#956c2b;
	--gold3:#2a221c;
	--goldTransparent: rgba(149,108,43,.95);

	--org:#e08c2d;
	--org2:#C16102;
	--red:#d33030;

	--green:#3FBF8F;
	--blue:#0085A1;
	--darkBlue:#223250;

	--gray:#303030;


	/*scrollBar:*/
	--scrollBar:#3FBF8F;
	--scrollBarHover:var(--gold);

};