@import url('https://fonts.googleapis.com/css2?family=Mulish&display=swap');

html,body,td,th {
	font-family: 'Mulish', sans-serif;
	font-size:16px;
	color:#333;
	padding:0;
	margin:0;
	height:100%;
}

A:link		 { color:#333; text-decoration:none;}
A:visited	 { color:#333; text-decoration:none;}
A:hover		 { color:#333; text-decoration:none;}

.scrollable {
	max-width: 100%;
    height: 350px;
    overflow: auto;
    direction: ltr;
    text-align: left;
	padding:0px 20px 0px 20px;
	overflow-y: scroll;
}

.scrollable_long {
	max-width: 100%;
    height: 500px;
    overflow: auto;
    direction: ltr;
    text-align: left;
	padding:0px 20px 0px 20px;
	overflow-y: scroll;
}

.push_height {
	height:100% !important;
}

.blank_h {
	width:100%;
	height:100px;
}

.push_bottom {
	top:-100px;
	position:relative;
}

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 10px;
}
::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background-color: #d4d4d4;
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}


	/*video*/

	header {
	  position: relative;
	  top:0;
	  width: 100%;
	  height: 100%;
	  overflow: hidden;
	}
	
	header video {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  min-width: 100%;
	  min-height: 100%;
	  width: auto;
	  height: auto;
	  z-index: 0;
	  -ms-transform: translateX(-50%) translateY(-50%);
	  -moz-transform: translateX(-50%) translateY(-50%);
	  -webkit-transform: translateX(-50%) translateY(-50%);
	  transform: translateX(-50%) translateY(-50%);
	}
	
	/*/////*/

.main {
	width:100%;
	position:relative;
	top:0px;
}

.bg_white {
	background-color:#fff !important;
}

.bg_grey {
	background-color:#f3f3f5 !important;
}

.content {
	width:100%;
	height:100%;	
}

.posi {
	 position:relative !important;
}

.top_bg {
	width:100%;
	position:fixed;
	top:0;
	z-index:997;
}

.table {
	display:table !important;
}

.logo_main {
	padding:2px 5px 2px 5px;
	z-index:2;
	position:relative;
	text-align:center;
	display:table;
	width:500px;
	margin-bottom:20px;
}

.logo {
	padding:20px 20px 20px 20px;
	z-index:2;
	position:relative;
	text-align:center;
	display:table;
	width:220px;
}

.logo:hover {
	color:#333 !important;
}

.logo_m {
	font-size:24px;
	letter-spacing:.21em;
	font-weight:100;
}

.logo_c {
	font-size:16px;
	font-weight:100;
	letter-spacing:normal;
	margin-top:10px;
	color:#bbb;
}

.logo_desktop {
	width:200px;
	padding:0px;
	z-index:2;
	position:relative;
}

.box_center {
	width:95%;
}

.box_full_center {
	width:100%;
}

.bottom_full_center {
	width:70%;
}

.box_icon {
	float:left;
	margin-right:10px;
	height:36px;
}

.check_icon {
	height:20px;
	position:relative;
	top:3px;
	margin-left:5px;
}

.box_icon_left {
	float:left;
	margin-right:10px;
	height:36px;
}

.pro_button {
	position:absolute;
	bottom:5%;
	width:100%;
	left:5%;
}

.h1_icon_left {
	float:left;
	margin-right:10px;
	height:50px;
}

.box_100 {
	padding:1% 3% 6% 3%;
}

.box_100 {
	width:94%;
	padding:1% 3% 3% 3%;
}

.box_50 {
	float:left;
	width:60%;
	padding:3%;
}

.box_30 {
	float:left;
	width:45%;
	padding:1% 2% 2% 2%;
}

.href_block {
	display:block;
	padding:10px;
	margin:10px;
}

.nomore {
	display:none;
}

.ans_cont {
	padding:10px 10px 20px 10px;
	color:#666;
}

.nopadding {
	padding:3px !important;
	margin:3px !important;
}

.box_25 {
	float:left;
	width:26%;
	padding:3%;
}

.gear_width {
	width:200px;
}

.box {
	float:left;
	width:26%;
	padding:3%;
}

.box_w {
	width:100% !important;
}

.box_br {
	width:100%;
	padding:5% 0% 1% 0%;
}

.box_title {
	font-size:28px;
	float:left;
}

.box_content {
	font-size:14px;
	margin-top:10px;
	width:90%;
}

.hb {
	float:left;
	width:2%;
	margin-top:-10px;
}

.hbb {
	float:left;
	width:2%;
	margin-top:40px;
}

.top_left {
	float:left;
	width:225px;
	position:absolute;
}

.nofloat {
	float:none !important;
}

.normal_img {
	width:70%;
}

.gallery_img_01 {
	width:30%;
	border:0;
	z-index:97;
	position:relative;
	margin-left:10%;
}

.gallery_img_small_01 {
	width:15%;
	border:0;
	z-index:98;
	position:relative;
	margin-left:-40%;
	margin-bottom:-4%;
}

.gallery_img_small_02 {
	width:15%;
	border:0;
	z-index:99;
	position:relative;
	margin-left:20%;
	margin-bottom:4%;
}

.top_center {
	float:left;
	width:100%;
	position:absolute;
	background-image:url(../images/h_bg.png);
	height:82px;
	padding-top:26px;
	background-repeat:repeat-x;
}

.font_small {
	font-size:12px;
}

.no_margin_top {
	margin-top:0 !important;
}

.t_title {
	padding:15px;
	background-color:#ccc;
}

.t_bg {
	background-color:#f0f0f0 !important;
}

.t_bg_soft {
	background-color:#f5f5f5 !important;
}

.t_content {
	padding:15px;
}

.margin_right {
	margin-right:10px !important;
}

.margin_top_xs { margin-top:20px; }
.margin_top_xxs { margin-top:10px; }
.margin_top { margin-top:40px; }
.margin_top_xl { margin-top:80px; }
.margin_top_xxl { margin-top:100px; }
.margin_top_xxxl { margin-top:150px; }
.margin_top_xxxxl { margin-top:250px; }
.margin_bottom_xs { margin-bottom:20px; }
.margin_bottom { margin-bottom:40px; }
.margin_bottom_xl { margin-bottom:80px; }

.m_button {
	font-size:18px;
	color:#333 !important;
	padding:15px 40px 15px 40px;
	margin:0px 0px 0px 0px;
	display:block;
	text-align:left;
	letter-spacing:.21em;
}

.m_button:hover {
	opacity:0.5;
}

.t_button {
	font-size:12px;
	color:#333 !important;
	padding:15px 10px 15px 10px;
	letter-spacing:.21em;
	line-height:24px;
}

.t_button:hover {
	opacity:0.5;	
}

.b_button {
	font-size:12px;
	color:#333 !important;
	padding:5px 10px 5px 10px;
	display:inline-table;
}

.b_button:hover {
	color:#333 !important;
}

.imenu {
	position:fixed !important;
	display:none;
	width:94%;
	height:100%;
	background-color:#fff;
	padding:3% 3% 3% 3%;
	z-index:998;
}

.index {
	position:relative;
	z-index:999;
}

.hand {
    cursor:pointer;
}

.cross {
    cursor:default;
}

.bold {
	font-weight:bold !important;
}

.about_bg {
	width:100%;
	height:100%;
	background-color:#FFFFFF;
}

.about_width {
	width:33%;
}

.con_width {
	width:50%;
}

.cer_width {
	width:75%;
}

.left {
	text-align:left !important;
}

.w_right {
	text-align:right !important;
}

.center {
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

.middle {
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}

.button {
	-webkit-appearance:none;
	color:#333 !important;
	padding:5px 20px 7px 20px;
	font-size:14px;
	text-align:center;
	font-weight:normal;
	outline:none;
	border:2px solid #333;
	display:inline-table;
	border-radius:50px;
}

.button:hover {
	-webkit-appearance:none;
	background-color:#333;
	border:2px solid #333;
	color:#fff !important;
}

.button_white {
	-webkit-appearance:none;
	color:#fff !important;
	padding:5px 20px 7px 20px;
	font-size:14px;
	text-align:center;
	font-weight:normal;
	outline:none;
	border:2px solid #fff;
	display:inline-table;
	border-radius:50px;
}

.button_white:hover {
	-webkit-appearance:none;
	background-color:#fff;
	border:2px solid #fff;
	color:#333 !important;
}

.button_purewhite {
	-webkit-appearance:none;
	color:#333 !important;
	padding:5px 20px 7px 20px;
	font-size:14px;
	text-align:center;
	font-weight:normal;
	outline:none;
	border:2px solid #fff;
	display:inline-table;
	border-radius:50px;
	background-color:#fff;
}

.button_purewhite:hover {
	-webkit-appearance:none;
	background-color:#333;
	border:2px solid #333;
	color:#fff !important;
}

.footer {
	width:98%;
	background-color:#fff;
	position:absolute;
	bottom:0;
	padding:1%;
}

.social_icon {
	height:25px;
	padding:3px 6px 3px 6px;
	position:relative;
}

.f_left {
	float:left;
}

.hr {
	width:20%;
	height:1px;
	background-color:#d7d7d7;
	margin-top:10px;
	margin-bottom:10px;
}

.clear {
	clear:both;
}

.d_none {
	opacity:0;
}

.icon_height {
	height:36px;
}

.padd {
	margin:10px;
}

.input {
    font-family:'Mulish', sans-serif;
    font-size:14px;
    background-color:#f0f0f0;
    border:0;
    height:45px;
    width:360px;
    padding:10px;
    outline:none;
    margin-top:5px;
    margin-bottom:5px;
}

.textarea {
    font-family:'Mulish', sans-serif;
    font-size:14px;
    background-color:#f0f0f0;
    border:0;
    height:140px;
    width:360px;
    padding:10px;
    outline:none;
    margin-top:5px;
    margin-bottom:5px;
}

.slogan_bottom {
	text-align:right;
	float:right;
	width:100%;
}

.slogan_bottom_text {
	float:right;
	width:45%;
	padding:0% 5% 0% 0%;
}

.slogan_menu {
	position:relative;
	top:0;
	width:100%;
	margin-top:16%;
}

.company_bg {
	width:100%;
	height:100%;
	background-position:center;
	background-size:cover;
}

.com_width {
	width:50%;
}

.slogan_content {
	position:relative;
	top:0;
	margin-top:10%;
}

h1 {
	font-size:14px;
	font-weight:normal;
	margin:75px 5px 50px 5px;
	padding:0;
	letter-spacing: .5em;
}

h2 {
	font-size:36px;
	line-height:36px;
	font-weight:normal;
	margin:0px;
	padding:0;
}

.pro_bg_white {
	float:left;
	width:50%;
	min-height:100%;
	background-color:#fff;
}

.left_bg_white {
	float:left;
	width:50%;
	min-height:100%;
	background-color:#fff;
}

.left_bg_white_small {
	float:left;
	width:65%;
	min-height:100%;
	background-color:#fff;
}

.wl_bg {
	float:left;
	width:40%;
}

.wr_bg {
	float:right;
	width:60%;
}

.left_content {
	padding:0% 5% 5% 5%;
	text-align:left;
}

.pro_bg {
	float:left;
	width:50%;
	background-size:cover;
	background-position:25% center;
	background-repeat:no-repeat;
	min-height:100%;
}

.pro_bg_r {
	float:left;
	width:50%;
	background-size:cover;
	background-position:75% center;
	background-repeat:no-repeat;
	min-height:100%;
}

.right_bg {
	float:left;
	width:50%;
	background-size:cover;
	background-position:25% center;
	background-repeat:no-repeat;
	min-height:100%;
}

.right_bg_right {
	float:left;
	width:50%;
	background-size:cover;
	background-position:75%;
	background-repeat:no-repeat;
	min-height:100%;
}

.right_bg_right_small {
	float:left;
	width:35%;
	background-size:cover;
	background-position:75%;
	background-repeat:no-repeat;
	min-height:100%;
}

.center_bg {
	background-size:cover;
	background-position:center;
	width:100%;
	min-height:100%;
}

.pos_center {
	position:absolute;
	width:100%;
	height:100%;
	display:table;
}

.gif_bg {
	width:160px;
	height:160px;
	border-radius:160px;
	background-size:cover;
	background-position:center;
	float:left;
	margin-right:20px;
	margin-top:20px;
	box-shadow: 0px 0px 25px #e0e0e0;
	border:10px solid #fff;
	position:relative;
}

.b_bg {
	width:100%;
	height:100%;
	border-radius:100%;
}

.b_grey {
	filter: grayscale(100%);
}

.b_content {
	background-color:#333;
	padding:10px;
	width:60px;
	height:60px;
	border-radius:60px;
	display:inline-table;
}

.push_bg {
	background-position:center top !important;
}

.push_bg_b {
	background-position:right bottom !important;
}

.center_content {
	padding:0% 15% 0% 15%;
	text-align:center;
	background-color:#fff;
	width:70%;
}

.center_content_nobg {
	padding:0% 15% 0% 15%;
	text-align:center;
	width:70%;
}

.blue_bg {
	background-color:#333 !important;
}

.white {
	color:#fff !important;
}

.big_slogan {
	font-size:75px;
	padding:10%;
	color:#fff;
	line-height:75px;
	font-weight:bold;
	margin:0;
	padding:6% 6% 3% 6% !important;
}

.img_width {
	width:200px;
}


@media (max-width: 1100px) {

	html,body,td,th {
		font-size:14px !important;
	}
	
	.main {
		top:0px !important;
	}
	
	.left_content {
		padding:5% 5% 5% 5% !important;
	}
	
	.about_width {
		width:43% !important;
	}
	
	.com_width {
		width:60% !important;
	}
	
	.check_icon {
		height:16px;
		position:relative;
		top:3px;
		margin-left:5px;
	}
	
	.gallery_img_01 {
		width:40%;
		margin-left:10%;
	}
	
	.gallery_img_small_01 {
		width:17%;
		margin-left:-50%;
		margin-bottom:-4%;
	}
	
	.gallery_img_small_02 {
		width:17%;
		margin-left:25%;
		margin-bottom:4%;
	}

	.gear_width {
		width:150px !important;
	}
	
	.con_width {
		width:75% !important;
	}
	
	.gif_bg {
		width:120px !important;
		height:120px !important;
		border-radius:120px !important;
		margin-right:20px !important;
		margin-top:20px !important;
		border:7px solid #fff !important;
	}
	
	.b_content {
		padding:10px !important;
		width:50px !important;
		height:50px !important;
		border-radius:50px !important;
	}
	
	.content {
		width:90% !important;
	}
	
	.box_center {
		width:95%;
	}
	
	.box_icon {
		float:left;
		margin-right:10px;
		height:24px;
	}
	
	.box_icon_left {
		float:left;
		margin-right:10px;
		height:24px;
	}
	
	.h1_icon_left {
		margin-right:10px !important;
		height:38px !important;
	}
	
	.box_title {
		font-size:24px;
		float:left;
	}

	.hb {
		float:left;
		width:2%;
		margin-top:-10px;
	}
	
	.slogan_menu {
		width:90% !important;
		margin-top:26% !important;
	}
	
	.box_w {
		width:100% !important;
	}
	
	.box_br {
		padding:8% 0% 2% 0% !important;
	}
	
	.w_right {
		text-align:inherit !important;
	}
	
	.center_content {
		padding:4% 5% 4% 5%;
		text-align:center;
		background-color:#fff;
		width:90.5%;
	}
	
	.center_content_nobg {
		padding:4% 5% 4% 5%;
		text-align:center;
		width:90.5%;
	}
	
	.slogan_content {
		margin-top:15% !important;
	}
	
	.big_slogan {
		font-size:60px !important;
		padding:10% 10% 3% 10% !important;
		color:#fff !important;
		line-height:60px !important;
		font-weight:bold !important;
		margin:0 !important;
	}
	
	.slogan_bottom_text {
		width:70% !important;
		padding:3% 5% 0% 0% !important;
	}
	
	.left_bg_white_small {
		width:100% !important;
	}
	
	.right_bg_right_small {
		width:0% !important;
	}
	
	.img_width {
		width:150px !important
	}
	
	.wl_bg {
		float:none !important;
		width:100%;
		height:auto !important;
	}
	
	.wr_bg {
		float:none !important;
		width:100%;
		height:auto !important;
	}
	
	.normal_img {
		width:50% !important;
	}
	
	.top_left {
		float:normal;
		width:100%;
		position:absolute;
		background-image:url(../images/h_bg.png);
		background-repeat:repeat-x;
		background-position:top center;
		height:100px;
		display:table;
	}

}



@media (max-width: 600px) {

	.top_bg {
		width:100%;
	}
	
	html,body,td,th {
		font-size:12px !important;
	}
	
	.gallery_img_01 {
		width:60% !important;
		margin-left:10% !important;
	}
	
	.gallery_img_small_01 {
		width:30% !important;
		margin-left:-70% !important;
		margin-bottom:-20% !important;
	}
	
	.gallery_img_small_02 {
		width:30% !important;
		margin-left:20% !important;
		margin-bottom:4% !important;
	}
	
	.gear_width {
		width:100px !important;
	}
	
	.margin_top_xs { margin-top:15px !important; }
	.margin_top_xxs { margin-top:10px !important; }
	.margin_top { margin-top:20px !important; }
	.margin_top_xl { margin-top:40px !important; }
	.margin_top_xxl { margin-top:80px; !important; }
	.margin_bottom_xs { margin-top:15px !important; }
	.margin_bottom { margin-bottom:20px !important; }
	.margin_bottom_xl { margin-bottom:40px !important; }

	.logo {
		width:normal;
	}
	
	.check_icon {
		height:12px !important;
		position:relative;
		top:2px !important;
		margin-left:5px;
	}
	
	.t_title {
		padding:7px !important;
	}
	
	.t_content {
		padding:7px !important;
	}
	
	.smaller {
		font-size:11px !important;
	}
	
	.cer_width {
		width:95% !important;
	}
	
	.com_width {
		width:80% !important;
	}
	
	.gif_bg {
		width:80px !important;
		height:80px !important;
		border-radius:80px !important;
		margin-right:5px !important;
		margin-top:5px !important;
		border:5px solid #fff !important;
	}
	
	.con_width {
		width:75% !important;
	}
	
	.b_content {
		padding:5px !important;
		width:40px !important;
		height:40px !important;
		border-radius:40px !important;
		font-size:10px !important;
	}
	
	.about_width {
		width:53% !important;
	}
	
	.img_width {
		width:100px !important
	}
	
	.imenu {
		padding:9% 3% 3% 3%;
	}
	
	.input {
		width:90%;
	}
	
	.textarea {
		width:90%;
	}
	
	.slogan_menu {
		width:90% !important;
		margin-top:46% !important;
	}
	
	header {
		top:0;
	}
	
	.box_icon {	
		float:left;
		margin-right:5px;
		height:24px;
	}
	
	.box_title {
		font-size:16px;
		float:left;
		margin-top:2px;
	}
	
	.h1_icon_left {
		margin-right:5px !important;
		height:30px !important;
	}
	
	.box_content {
		font-size:12px;
		margin-top:10px;
	}
	
	.slogan_content {
		margin-top:34% !important;
	}	
	
	.box_w {
		width:100% !important;
	}
	
	.button {
		font-size:12px !important;
	}
	
	.button_white {
		font-size:12px !important;
	}
	
	.button_purewhite {
		font-size:12px !important;
	}
	
	.box_25 {
		float:none !important;
		width:94% !important;
		padding:3% !important;
	}
	
	.hbb {
		display:none !important;
	}
	
	.box_50 {
		float:none !important;
		width:94% !important;
		padding:1% 3% 6% 3% !important;
	}
	
	.box_30 {
		float:left !important;
		width:47% !important;
		padding:1% 1% 2% 1% !important;
	}
	
	.left_bg_white {
		width:65% !important;
	}

	.left_bg {
		width:65% !important;
	}
	
	.right_bg {
		width:35% !important;
	}
	
	.right_bg_right {
		width:35% !important;
	}
	
	.big_slogan {
		font-size:40px !important;
		padding:10% 10% 3% 10% !important;
		color:#fff !important;
		line-height:40px !important;
		font-weight:bold !important;
		margin:0 !important;
	}
	
	.footer {
		width:91% !important;
		bottom:0px;
		position:absolute;
		padding:3% 5% 3% 5%;
	}
	
	.slogan_bottom_text {
		width:70% !important;
		padding:6% 5% 0% 0% !important;
	}
	
	.pro_button {
		bottom:2% !important;
	}
	
	.normal_img {
		width:60% !important;
	}
	
	.scrollable {
		height: 250px !important;
	}
	
	.scrollable_long {
		height: 400px !important;
	}
	
	.logo_main {
		width:80% !important;
	}
	
	.logo_c {
		font-size:12px !important;
	}
	
	.t_button {
		/*font-size:10px;*/
	}
	
}	



@media (max-width: 300px) {

	.gif_bg {
		width:60px !important;
		height:60px !important;
		border-radius:60px !important;
		margin-right:5px !important;
		margin-top:5px !important;
		border:5px solid #fff !important;
	}
	
	.normal_img {
		width:60% !important;
	}
	
	.scrollable {
		height: 200px !important;
	}
	
	.scrollable_long {
		height: 300px !important;
	}
	
	.left_content {
		padding:5% 5% 5% 5% !important;
	}
	
}