@charset "utf-8";
*{margin: 0; padding: 0; }
a, a:hover { text-decoration: none;}
ul, li { list-style: none; }
svg{
	fill: currentColor;
}
#navbar{
	background:#181818;
	width: 100%;
	align-items: center;
	display:flex;
	position:fixed;
	justify-content: center;
	height:5vw;
	z-index:999;}
#navbar .logo{
	width:7.5vw;
    cursor: pointer;
	max-width: 160px;}
#navbar .logo img{
	width:100%;}
#navbar .menu-right{
	margin-left: 9vw;}
.menu-right .language{
	text-align: right;
	}
.menu-right .language img{
	margin-left: 20px;
	width: 1.5vw;
	max-width: 20px;
	}
#navbar .menu-list{
	margin-top: 2vh;
	}
#navbar .menu-list a:hover{
	color:#FF0502;
	}
#navbar .menu-list a{
	color:#FEE6A0;
	transition: all 0.2s ease;
	}
.menu-list .menu{
	border-right:1px #FEE6A0 solid;
	padding-right: 2vw;
    margin-right: 2vw;
	}
.menu-list .menu-end{
	border-right:none;
	margin-right:0px;}
main section{
	display:flex;
	height: 100vh;
	flex-direction: column;}
main #banner{
	background:url(../images/bannerbg.png) no-repeat center 5vw;
	flex-direction: row;
    justify-content: center;
    align-items: center;
	}
main #bannercolor{
		background: linear-gradient(90deg, #FF0502, #600D08, #600D08, #FF0502);
		background-size:1200% 300%;
		position:absolute;
		top:0px;
		width:100%;
		height:100%;
		left:0px;
		z-index:-99;
		animation:mymove 8s linear infinite;
	}
@keyframes mymove{
		0% {
			background-position: 0% 0%; }
		50% {
			background-position: 50% 50%; }
		100% {
			 background-position: 100% 100%; }
	}
#banner .banner01{width:26vw;margin-left: 14vw; margin-top:6vh; max-width:501px;}
#banner .banner01 img{width:100%;}
#banner .banner02{width:44.5vw;margin-left: 6vw; margin-top:6vh; max-width:861px;}
#banner .banner02 img{width:100%;}
main #about{
	background:url(../images/aboutbg.jpg) no-repeat top/cover;
	flex-direction: row;
    justify-content: center;
    align-items: center;}
#about .about1{
	width:66vw;
	max-width:1200px;
	display: flex;
	align-items: center;
    justify-content: space-between;}
#about .aboutleft{width:56%;}
#about .aboutleft .about01{
	width:20vw;
	max-width:292px;}
#about .aboutleft .about01 img{
	width:100%;}
#about .aboutleft .about02{
	line-height: 3vh;
    margin-top: 5vh;}
#about .aboutleft .about03{
	margin-top: 10vh; 
	display:flex;
	color: #FDE59F;}
#about .about03 .about03-1{
	display: flex;
    flex-direction: column;
    text-align: center;
    flex-grow: 1;
	padding-top: 2vh;
    padding-bottom: 2vh;
    border-right: 1px solid #969593;}
#about .about03 .about03-1-1{
	display: flex;
    justify-content: center;
	align-items: baseline;}
#about .about03 .about03-1-1-1{font-size: 4rem;}
#about .about03 .about03-1-1-2{font-size: 2rem; margin-left: 10px;}
#about .about03 .about03-1-2{margin-top: 2vh;}
#about .about03 .about03-2{
	display: flex;
    flex-direction: column;
    text-align: center;
    flex-grow: 1;
	padding-top: 2vh;
    padding-bottom: 2vh;
    border-right: 1px solid #969593;}
#about .about03 .about03-2-1{
	display: flex;
    justify-content: center;
	align-items: baseline;}
#about .about03 .about03-2-1-1{font-size: 4rem;}
#about .about03 .about03-2-1-2{font-size: 2rem; margin-left: 10px;}
#about .about03 .about03-2-2{margin-top: 2vh;}
#about .about03 .about03-3{
	display: flex;
    flex-direction: column;
    text-align: center;
    flex-grow: 1;
	padding-top: 2vh;
    padding-bottom: 2vh;
    }
#about .about03 .about03-3-1{
	display: flex;
    justify-content: center;
	align-items: baseline;}
#about .about03 .about03-3-1-1{font-size: 4rem;}
#about .about03 .about03-3-1-2{font-size: 2rem; margin-left: 10px;}
#about .about03 .about03-3-2{margin-top: 2vh;}
#about .aboutright{
	width: 25vw;
	max-width:450px;}
#about .aboutright img{width:100%;}
main #glist{
	background:url(../images/glistbg.jpg) no-repeat top/cover;
	justify-content:center;
	align-items: center;}
#glist .glisttitle{width:66vw; max-width:1200px;}
#glist .glisttitle img{width:100%;}
#glist .glist01{
	color:#FDE59F;
	text-align: center;
	margin-top: 3vh;}
main #feedback{
	background:url(../images/feedbackbg.jpg) no-repeat top/cover;
	justify-content:center;
	align-items: center;}
#feedback .feedbacktitle{width:66vw; max-width:1200px;}
#feedback .feedbacktitle img{width:100%;}
#feedback .feedback01{
	color:#FDE59F;
	text-align: center;
	margin-top: 3vh;}
.shadow-effect {
	background: #222;
	padding: 2vw 2vw 4vw;
	border-radius: 0px;
	text-align: center;
	border:1px solid #FEE6A0;
	box-shadow: none;}
#customers-testimonials .shadow-effect p {
	font-family: inherit;
	line-height: 1.5;
	margin: 0 0 17px 0;}
.testimonial-name {
	margin: -17px auto 0;
	display: table;
	width: auto;
	background: #FEE6A0;
	padding: 9px 35px;
	border-radius: 12px;
	text-align: center;
	color: #222;
	box-shadow: none;}
#customers-testimonials .item {
	text-align: center;
	margin-bottom:3vh;
	opacity: .2;
	transform: scale3d(0.8, 0.8, 1);
	transition: all 0.3s ease-in-out;}
#customers-testimonials .owl-item.active.center .item {
	opacity: 1;
	transform: scale3d(1.0, 1.0, 1);}
.owl-carousel .owl-item img {
	transform-style: preserve-3d;
	max-width: 240px;
    margin: 0 auto 17px;}
#customers-testimonials.owl-carousel .owl-dots .owl-dot.active span,
#customers-testimonials.owl-carousel .owl-dots .owl-dot:hover span {
	background: #FEE6A0;
	transform: translate3d(0px, -50%, 0px) scale(0.7);}
#customers-testimonials.owl-carousel .owl-dots{
	display: inline-block;
	width: 100%;
	text-align: center;}
#customers-testimonials.owl-carousel .owl-dots .owl-dot{
	display: inline-block;}
#customers-testimonials.owl-carousel .owl-dots .owl-dot span {
    background: #FEE6A0;
    display: inline-block;
    height: 20px;
    margin: 0 2px 5px;
    transform: translate3d(0px, -50%, 0px) scale(0.3);
    transform-origin: 50% 50% 0;
    transition: all 250ms ease-out 0s;
    width: 20px;
    border-radius: 10px;}
main #feedback{
	background:url(../images/feedbackbg.jpg) no-repeat top/cover;
	justify-content:center;
	align-items: center;}
#feedback .feedbacktitle{width:66vw; max-width:1200px;}
#feedback .feedbacktitle img{width:100%;}
#feedback .feedback01{
	color:#FDE59F;
	margin-top: 3vh;}
main #process{
	background:url(../images/processbg.jpg) no-repeat top/cover;
	justify-content:center;
	align-items: center;}
#process .processtitle{width:66vw; max-width:1200px;}
#process .processtitle img{width:100%;}
#process .process01{
	color:#FDE59F;
	text-align: center;
	margin-top: 3vh;}
#process .process02{
	display:flex;
	justify-content:space-between;
	align-items: center;
	margin-top:4vh;}
#process .process02-all{
	width: 9.5vw;
	max-width:170px;}
#process .process02-all img{
	width: 100%;}
#process .process02-2{padding-top:26vh;}
#process .process02-4{padding-bottom:26vh;}
#process .process02-6{padding-top:26vh;}
main #platform{
	background:url(../images/platformbg.jpg) no-repeat top/cover;
	justify-content:center;
	align-items: center;}
#platform .platform1{width:66vw; max-width:1200px;}
#platform .platformtitle img{width:100%;}
.platform1 .platform02-all a:hover img{
	opacity: 0.5;
	transition: 0.3s;
}
#platform .platform01{
	width:26vw;
	max-width:484px;
	margin-top: 4vh;}
#platform .platform01 img{
	width:100%;}
#platform .platform03{
	width:20vw;
	max-width:394px;
	margin-top: 4vh;}
#platform .platform03 img{
	width:100%;}
#platform .platform02{
	display:flex;
	justify-content:space-between;
	align-items: center;
	margin-top:4vh;}
#platform .platform04{
	display:flex;
	justify-content:space-between;
	align-items: center;
	margin-top:4vh;}
#platform .platform02-all{
	width: 21vw;
	max-width:380px;}
#platform .platform02-all img{
	width: 100%;}
#platform .platform04-all{
	width: 12vw;
	max-width:224px;}
#platform .platform04-all img{
	width: 100%;}
main #contact{
	background:url(../images/contactbg.jpg) no-repeat top/cover;
	justify-content:center;
	align-items: center;}
#contact .contacttitle{width:66vw; max-width:1200px;}
#contact .contacttitle img{width:100%;}
#contact .contact1{width:66vw; max-width:1200px;}
#contact .contact01{
	width:21vw;
	max-width:360px;
	margin-top: 4vh;}
#contact .contact01 img{
	width:100%;}
#contact .contact02{
	display:flex;
	justify-content:space-between;
	align-items: center;
	margin-top:4vh;}
#contact .contact02-all{
	width: 19.8vw;
	max-width:380px;}
#contact .contact02-all img{
	width: 100%;}
#footer{
	background: #171717;
    justify-content: center;
    display: flex;}
#footer .foot{
	width: 66vw;
    max-width: 1200px;
    display: flex;
    padding-bottom: 20px;
    justify-content: space-between;
    padding-top: 20px;
    align-items: center;}
.foot .footleft{
	display: flex;
	width:62%;
	color: #D3D3D3;
    flex-direction: column;}
.foot .footright{}
#footer .menu-list a:hover{
	color:#FF0502;
	}
#footer .menu-list a{
	color:#D3D3D3;
	transition: all 0.2s ease;
	}
#footer .menu-list .menu{
	border-right:1px #D3D3D3 solid;
	padding-right: 1.5vw;
    margin-right: 1.5vw;
	}
#footer .menu-list .menu-end{
	border-right:none;
	margin-right:0px;}

.mt-tabpage {
	width: 66vw;
	margin: 3vh auto 0px;
	max-width:1200px;
}
.mt-tabpage-title {
	font-size: 0;
	width: 100%;
	display:flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}
.mt-tabpage-title a:hover img{
	opacity: 0.5;
	transition: 0.3s;
}
.mt-tabpage-title .mt-tabpage-item {
	display: inline-block;
	font-size: 0px;
	max-width: 112px;
	width:8vw;
	margin-right: 1vw;
	margin-top: 1vw;
}
.mt-tabpage-title .mt-tabpage-item:hover{
}
.mt-tabpage-title .mt-tabpage-item-cur {
	font-size: 0px;
}
.mt-tabpage-count {
	position: relative;
	width: 100%;
	height: 27vh;
	overflow: hidden;
}
.mt-tabpage-cont__wrap {
	position: absolute;
	width:100%;
}
.mt-tabpage-count .mt-tabpage-item {
	flex-direction: row;
    display: flex;
	height: 27vh;
	justify-content: space-between;
	align-items: flex-start;}
.mt-tabpage-item .glistleft{float:left; width:35%; max-width:400px;}
.mt-tabpage-item .glistleft img{width:100%; padding-top:5px;}
.mt-tabpage-item .glistright{
    width: 64%;
	display: flex;
    flex-direction: column;}
.glistright .righttitle{
	color: #FDE59F;
    font-size: 1.5rem;}
.glistright .rightcontent{
    margin-top: 2vh;}
.glistright .rightps{
    margin-top: 2vh;}
.mt-tabpage-title img{width:100%;}
@media screen and (max-width: 600px) {
main #banner {
    background: url(../images/bannerbg.png) no-repeat 78% 5vw;
}
#navbar {
    height: 16vw;}
#navbar .logo {
    width: 16vw;   }
#navbar .menu-right {
    margin-left: 3vw;
	display:flex;
	flex-direction: row-reverse;}
.menu-right .language {
    display: flex;
    align-items: center;}
#navbar .menu-list {
    margin-top: 0vh;
}
.menu-list .menu-1{
    display:none;
}
.menu-list .menu-2{
    display:none;
}
.menu-list .menu-4{
    display:none;
}
.menu-list .menu-6{
    display:none;
}
.menu-right .language img {
    margin-left: 3vw;
    width: 20px;
}
main #banner {
    flex-direction: column;
}
#banner .banner01 {
    width: 80vw;
    margin-left: 0;
    margin-top: 0;
}
#banner .banner02 {
    width: 94vw;
    margin-left: 0;
}
#about .about1 {
    width: 96vw;
}
#about .aboutleft {
    width: 100%;
}
#about .aboutleft .about01 {
    width: 70vw;
}
#about .aboutright {
    display: none;
}
#about .aboutleft .about03 {
    margin-top: 0vh;
	align-items: center;
    flex-direction: column;
}
#about .aboutleft .about02 {
    margin-top: 3vh;
}
#about .about03 .about03-1 {
    border-bottom: 1px solid #969593;
	border-right: none;
	width:60%;
	padding-top: 1vh;
    padding-bottom: 2vh;
}
#about .about03 .about03-2 {
    border-bottom: 1px solid #969593;
	border-right: none;
	width:60%;
	padding-top: 1vh;
    padding-bottom: 2vh;
}
#about .about03 .about03-3 {
	width:60%;
	padding-top: 1vh;
    padding-bottom: 1vh;
}
#about .about03 .about03-1-2 {
    margin-top: 0vh;
}
#about .about03 .about03-2-2 {
    margin-top: 0vh;
}
#about .about03 .about03-3-2 {
    margin-top: 0vh;
}
#glist .glisttitle {
    width: 180vw;
}
#glist .glist01 {
    margin-top: 1vh;
    width: 96vw;
}
.mt-tabpage {
    width: 96vw;
    margin: 1vh auto 0px;
}
.glistright .rightcontent {
    display:none;
}
.mt-tabpage-count .mt-tabpage-item {
    flex-direction: column;
	height: 36vh;
	justify-content: center;
	align-items: center;
}
.glistright .rightps {
    margin-top: 1vh;
}
.mt-tabpage-count {
    height: 36vh;
}
.mt-tabpage-item .glistleft img {
    padding-top: 0px;
}
.mt-tabpage-item .glistright {
    width: 100%;
	margin-top: 1vh;
}
.mt-tabpage-title .mt-tabpage-item {
    width: 12vw;
}
.mt-tabpage-item .glistleft {
    width: 70%;
}
#feedback .feedbacktitle {
    width: 180vw;
}
#feedback .feedback01 {
    margin-top: 1vh;
    width: 96vw;
}
.container {
  width:66vw;
}
#process .processtitle {
    width: 180vw;
}
#process .process01 {
    margin-top: 2vh;
    width: 96vw;
}
#process .process02 {
    margin-top: 0vh;
	flex-wrap: wrap;
	justify-content: space-around;
}
#process .process02-2 {
    padding-top: 0vh;
}
#process .process02-4 {
    padding-bottom: 0vh;
}
#process .process02-6 {
    padding-top: 0vh;
}
#process .process02-all {
    width: 30vw;
	margin-top:2vh;
    max-width: 170px;
}
#platform .platform1 {
    width: 96vw;
}
.platform1 .platformtitle{
	display: flex;
    justify-content: center;
}
#platform .platformtitle img {
    width: 180%;
    flex-shrink: 0;
}
#platform .platform01 {
    width: 70vw;
    margin-top: 1vh;
}
#platform .platform02 {
    margin-top: 1vh;
	flex-wrap: wrap;
	justify-content: center;
}
#platform .platform02-all {
    width: 60vw;
	margin: 1vh 0px;
}
#platform .platform03 {
    width: 55vw;
    margin-top: 1vh;
}
#platform .platform04 {
	flex-wrap: wrap;
    justify-content: space-around;
    margin-top: 0vh;
}
#platform .platform04-all {
    width: 30vw;
	margin-top:1vh;
}
#contact .contacttitle {
    width: 180vw;
}
#contact .contact1 {
    width: 96vw;
}
#contact .contact01 {
    width: 60vw;
    margin-top: 1vh;
}
#contact .contact02 {
    justify-content: space-around;
    margin-top: 1vh;
	flex-wrap: wrap;
}
#contact .contact02-all {
    width: 46vw;
	margin-top:1vh;
}
.foot .footright {
	display:none;
}
.foot .footleft {
    width: 100%;
}
#footer .foot {
    width: 96vw;
}
}