:root {


/*	---------------------------------------------------
	init
	--------------------------------------------------- */
	*
	{
		border-collapse: collapse;
	}


/*	---------------------------------------------------
	padding/margin
	--------------------------------------------------- */
	--xxs: calc(3px + (6 - 3) * ((100vw - 320px) / (1200 - 320)));
	--xs: calc(6px + (12 - 6) * ((100vw - 320px) / (1200 - 320)));
	--sm: calc(12px + (24 - 12) * ((100vw - 320px) / (1200 - 320)));
	--md: calc(18px + (36 - 18) * ((100vw - 320px) / (1200 - 320)));
	--lg: calc(24px + (48 - 24) * ((100vw - 320px) / (1200 - 320)));
	--xl: calc(30px + (60 - 30) * ((100vw - 320px) / (1200 - 320)));
	--xxl: calc(30px + (90 - 30) * ((100vw - 320px) / (1200 - 320)));

	--xxs-max: 6px;
	--xs-max: 12px;
	--sm-max: 24px;
	--md-max: 36px;
	--lg-max: 48px;
	--xl-max: 60px;
	--xxl-max: 90px;

/*	---------------------------------------------------
	gap
	--------------------------------------------------- */
	--gap-xxs: calc(3px + (6 - 3) * ((100vw - 320px) / (1200 - 320)));
	--gap-xs: calc(6px + (12 - 6) * ((100vw - 320px) / (1200 - 320)));
	--gap-sm: calc(12px + (24 - 12) * ((100vw - 320px) / (1200 - 320)));
	--gap-md: calc(18px + (36 - 18) * ((100vw - 320px) / (1200 - 320)));
	--gap-lg: calc(24px + (48 - 24) * ((100vw - 320px) / (1200 - 320)));
	--gap-xl: calc(30px + (60 - 30) * ((100vw - 320px) / (1200 - 320)));
	--gap-xxl: calc(30px + (90 - 30) * ((100vw - 320px) / (1200 - 320)));

	--gap-xxs-max: 6px;
	--gap-xs-max: 12px;
	--gap-sm-max: 24px;
	--gap-md-max: 36px;
	--gap-lg-max: 48px;
	--gap-xl-max: 60px;
	--gap-xxl-max: 90px;

/*	---------------------------------------------------
	width
	--------------------------------------------------- */
	--width-xs: 680px;
	--width-sm: 840px;
	--width-md: 1020px;
	--width-lg: 1200px;
	--width-xl: 1400px;
	--width-xxl: 1600px;
	--width-full: 100%;

/*	---------------------------------------------------
	radius
	--------------------------------------------------- */
	--rad1:5px;
	--rad2:8px;
	--rad3:12px;

/*	---------------------------------------------------
	coloring
	--------------------------------------------------- */
	--light-1-back-col: #fff;
	--light-1-text-col:#000;
	--light-1-link-col:#0095db;
	--light-1-link-decor: none;
	--light-1-link-hover-col: #064771;
	--light-1-link-hover-decor: underline;

	--light-2-back-col: #f1f1f1;
	--light-2-text-col:#000;
	--light-2-link-decor: none;
	--light-2-link-hover-col:#0095db;

	--light-3-back-col: rgb(255,255,255,.7);
	--light-3-text-col:#000;
	--light-3-blur: saturate(180%) blur(5px);
	--light-3-link-col:#0095db;
	--light-3-link-hover-col:#0095db;
	--light-3-link-hover-decor: underline;

	--medium-1-back-col: #ccc;
	--medium-1-text-col:#000;

	--dark-1-back-col: #0095db;
	--dark-1-text-col:#fff;
	--dark-1-link-col:#fff;
	--dark-1-link-hover-col:#fff;
	--dark-1-link-hover-decor: underline;

	--link-col: #064771;
	--link-active-col: #E08000;
	--link-hover-col: #ccc;

	--btn1-col: #399A89;
	--btn1-hover-col: #348C7C;
	--btn1-text-col: #fff;

	--bg-color-green: #B6DFB7;


/*	---------------------------------------------------
	border
	--------------------------------------------------- */
	--border-1: 1px solid #444;




	/* fonts */
	--font-basic:'Source Sans Pro', sans-serif;
	--font-label:'Baloo Chettan 2', sans-serif;

	/* typo sizing */
	--size-p: calc(12px + (18 - 12) * ((100vw - 320px) / (1200 - 320)));
	--size-button: calc(14px + (20 - 14) * ((100vw - 320px) / (1200 - 320)));
	--size-h1: calc(24px + (36 - 24) * ((100vw - 320px) / (1200 - 320)));
	--size-h2: calc(21px + (32 - 21) * ((100vw - 320px) / (1200 - 320)));
	--size-h3: calc(18px + (27 - 18) * ((100vw - 320px) / (1200 - 320)));
	--size-h4: calc(16px + (24 - 16) * ((100vw - 320px) / (1200 - 320)));
	--size-h5: calc(14px + (21 - 14) * ((100vw - 320px) / (1200 - 320)));
	--size-h6: calc(12px + (18 - 12) * ((100vw - 320px) / (1200 - 320)));

	--size-p-min:12px;
	--size-p-max:18px;
	--size-h1-max:36px;
	--size-h2-max:32px;
	--size-h3-max:27px;
	--size-h4-max:24px;
	--size-h5-max:21px;
	--size-h6-max:18px;

	--line-height-p: calc(18px + (28 - 18) * ((100vw - 320px) / (1200 - 320)));
	--line-height-p-min:18px;
	--line-height-p-max:28px;


	--frame-shadow:0px 0px 14px #000;


/*	---------------------------------------------------
	text-marker
	--------------------------------------------------- */
	--marker-yellow:#FFFF3E;




}