@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Oswald:wght@200..700&display=swap');

/* 	==================
	DEFAULT DEFINITION
	================== */
/* reset to default */
* { font-weight: inherit; font-family: inherit; font-style: inherit; color: inherit; font-size: 100%; border: 0 none; outline: 0; padding: 0; margin: 0; vertical-align: top; box-sizing: inherit; }
* { transition: background 0.4s; }

:root {
	--color-sulu-50: #f2fee7;
	--color-sulu-100: #e2fbcc;
	--color-sulu-200: #c5f89e;
	--color-sulu-300: #9ff066;
	--color-sulu-400: #7ce437;
	--color-sulu-500: #5cc919;
	--color-sulu-600: #45a10f;
	--color-sulu-700: #367a11;
	--color-sulu-800: #2e6113;
	--color-sulu-900: #295215;
	--color-sulu-950: #112d06;

	--color-radical-red-50: #fff1f1;
	--color-radical-red-100: #ffe4e4;
	--color-radical-red-200: #fdced0;
	--color-radical-red-300: #fca5aa;
	--color-radical-red-400: #f9737d;
	--color-radical-red-500: #f24154;
	--color-radical-red-600: #df1f3d;
	--color-radical-red-700: #bc1432;
	--color-radical-red-800: #9d1431;
	--color-radical-red-900: #871430;
	--color-radical-red-950: #4b0615;

	--main-gap: 24px;
	--main-gap-half: 12px;
	--main-gap-trp: 36px;
	--main-gap-double: 48px;

	--section-gap-top: 120px;
	--section-gap-bottom: calc(var(--section-gap-top) - var(--main-gap));
}

body { font: 10px  'Inter', "Inter"; color: var(--baseTextColor); background: #fff; }

strong, .strong { font-weight: 700; }

h1,h2,h3 { margin-bottom: 0px; color: var(--color-sulu-700); font-family: 'Oswald', "Oswald"; font-weight: 200;  }

h1 strong, h1 .strong, 
h2 strong, h2 .strong, 
h3 strong, h3 .strong { font-weight: 400;}

h1 { font-size: 6.4em; margin-bottom: 30px; color: var(--color-sulu-300); }
h2 { font-size: 3em;  margin-bottom: 15px; }
h3 { font-size: 2.2em;  margin-bottom: 15px; }

.heading_small_line { display: block; font-size: 16px; }

@media only screen and (max-width: 960px) {
	h1 { font-size: 4.8em; }
}

@media only screen and (max-width: 768px) {
	h1 { font-size: 3.8em; }
}

p { font-size: 1.8em; line-height: 1.6em; margin-bottom: 30px; }
ul { font-size: 1.8em; line-height: 1.6em; }
a { color: var(--red); }
a:hover { cursor: pointer; text-decoration: none; }

.middle_text p, .middle_text ul { font-size: 1.8em; }

input, textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; }

/* clearing element */
div.clear, div.util, div.cleaner{ display: block; clear: both; font-size: 0px; line-height: 0px; z-index: 2000; }

/* middle div*/
.middle { max-width: 1400px; margin: 0 auto; position: relative; }
.middle_w { max-width: 1800px; margin: 0 auto; position: relative; }
.middle_t, .middle_text { max-width: 960px; margin: 0 auto; position: relative; }

/* HEADER */
header { padding: 0px 0px 0px 0px; position: absolute; top: 0px; left: 0px; width: 100%; z-index: 999; }
.header_page { background: #fff; border-bottom: solid 1px #ececec; }

#tmp_logo_cover { padding: var(--main-gap) var(--main-gap) var(--main-gap) var(--main-gap);  }
#tmp_logo_img { height: 72px; }

/*
	=======================================
	SCROLL UP
	=======================================
*/
#scrollup { position: fixed; bottom: var(--main-gap-half); right: var(--main-gap-half); z-index: 99; }
#scrollup a { display: block; width: 60px; height: 39px; padding-top: 21px;  text-align: center; background: var(--color-sulu-200);; text-decoration: none; border-radius: 90px;; }
#scrollup svg { fill: var(--color-sulu-600); transform: rotate(-90deg); height: 18px; }

/* helpers */
.width_full { width: 100%; box-sizing: border-box; }
.width_fourty{ width: 40%; box-sizing: border-box; }
.width_half{ width: 50%; box-sizing: border-box; }
.width_seventy{ width: 70%; box-sizing: border-box; }
.width_sixty{ width: 60%; box-sizing: border-box; }
.width_thirty{ width: 30%; box-sizing: border-box; }
.width_quad{ width: 25%; box-sizing: border-box; }
.width_twenty{ width: 20%; box-sizing: border-box; }
.width_ten { width: 10%; box-sizing: border-box; }
.width_third{ width: 33.333%; box-sizing: border-box; }
.width_two_third { width: 66.667%; box-sizing: border-box; }
.width_threequad{ width: 75%; box-sizing: border-box; }

@media only screen and (max-width: 960px) {
	.width_fourty, .width_half, .width_sixty, .width_thirty, .width_third, .width_two_third, .width_quad, .width_twenty, .width_threequad, .width_ten, .width_seventy{ width: 100%; }
}

.margin_bottom_base { margin-bottom: var(--main-gap); }
.margin_bottom_half { margin-bottom: var(--main-gap-half); }

.hide { display: none; }
.align_center { text-align: center; }
.align_left { text-align: left; }
.align_right { text-align: right; }
.align_justify { text-align: justify;  }
.float_right { float: right; }
.float_left { float: left; }

@media only screen and (max-width: 960px) { .no_tablet { display: none; } }
@media only screen and (min-width: 960px) { .is_tablet { display: none; } }
@media only screen and (max-width: 768px) { .no_mobile { display: none; } }
@media only screen and (min-width: 768px) { .is_mobile { display: none; } }
@media only screen and (min-width: 960px) { .simulate_line { display: block; } }

sup { font-size: 0.5em; margin-top: -50%; }
sub { font-size: 0.5em; vertical-align: baseline;  }