/* CSS Document */
#header {
	position: fixed;
	color:#ffffff;
	width:100vw;
	z-index:99;
	backdrop-filter: blur(12px);
	height:70px;
	top:0;
	display: flex;
}
footer{
	background-color:#232323;
	width:100vw;
}
.headerbg {
	position:absolute;
	width:100vw;
	height:70px;
	background-color:#ffffff;
	display: block;
	z-index:110;
	filter: opacity(0.8);
	/*transition: all .5s ease;*/
}

#header a{
	color:#ffffff;
	text-decoration:none;
}
.headerDiv {
	position: absolute;
	height: 70px;
	z-index:120;
	width: 100vw;
	overflow: hidden;
	box-shadow: 0 4px 5px 0px rgba(0, 0, 0, 0.1);
}
.headerDivInner {
	width:1200px;
	margin:0 auto;
}
.logoDiv{
	float:left;
	width:220px;
}
.topmenu{
	float:left;
	display: flex;
}
.wocyberLogo {
	padding-top:0;
}
.topRight{
	float:right;
	margin-right:12px;
}
.topmenu a{
	font-size: 16px;
	display: inline-table;
	text-decoration:none;
	padding:24px 12px;
	margin:0 5px;
}
.topmenu a:hover {
	color:#009fe7;
	background-color:rgba(0, 0, 0, 0.05);
}
.topLink {
	color:#333333;
}
.topLink:hover {
}
.getRes{
	font-size:12px;
	display:inline-table;
	background-color:#009FE7;
	line-height:22px;
	border-radius:15px;
	padding:3px 15px;
	margin:20px 18px 0 0;
}
.getRes:hover {
	background-color:#2bbdff;
}
.submenu {
	position: fixed; 
	top: 70px;
	background-color: #ffffff; 
	width: 100vw; 
	min-height: 90px;
	/*backdrop-filter: blur(6px);*/
	z-index: 999;
	display: none;
	opacity: 1;
	/*transition: 0.3s;*/
	filter:opacity(1);
	border-top: 1px solid #eee;
	box-shadow: 0 4px 5px 0px rgba(0, 0, 0, 0.1);
}	
.submenu a {
	color: #383838;
	font-size: 14px;
	display: block;
	padding: 0 12px 0 20px;
	margin: 5px 10px;
}
.submenu a:hover {
	color: #009fe7;
}
.dropMenuDiv {
	width: 1100px;
	margin: 0 auto;
	min-height: 280px;
	color: #383838;
}
.dropMenuDivLeft {
	width: 200px;
	height:360px;
	padding: 20px 0;
	float: left;
	background-color: #f5f5f6;
}
.dropMenuDivRight {
	width: 850px;
	max-height: 300px;
	float: right;
	overflow: auto;
}
.dropMenuDivLeft  a {
	display: block;
	padding: 3px;
	width: 120px;
	margin: 20px auto;
	text-align: center;
	font-size: 16px;
	border-bottom: 2px solid transparent;
}
.dropMenuDivLeft  a.ac {
	color: #009fe7;
	border-bottom: 2px solid #009fe7;
}
.dropMenuDivLeft  a:hover {
	color: #009fe7;
	border-bottom: 2px solid #009fe7;
}
.dropMenuRightItem {
	display: none;
	clear: both;
	margin: 20px 0;
}
#productList1 {
	display: block;
}

.dropMenuRightItem a{
	display: block;
	float: left;
	width: 180px;
	margin: 0 35px 20px 0;
	text-align: center;
	padding: 0px;
}
.dropMenuRightItem a:nth-child(4n){
	margin-right: 0;
}
.dropMenuRightItem img{
	width: 180px;
	height: 110px;
	margin-bottom: 8px;
	border-radius: 6px;
	display: block;
}
.productListTitle {
	display: block;
	clear: both;
	font-size: 20px;
	font-weight: bold;
	color: #666666;
	padding:20px 0 10px 0;
	margin-left: 75px;
	border-bottom: 1px solid #dddddd;
}
.productList {
	clear: both;
	margin: 20px 0 0 75px;
	display: flex;
}
.productList a{
	color: #333333;
	text-align: center;
	display: block;
	float: left;
	width: 180px;
	margin: 0 35px 20px 0;
	padding: 0px;
}
.productList a:hover{
	color: #009ee6;
}
.productList img{
	width: 180px;
	height: 110px;
	margin-bottom: 8px;
	border-radius: 6px;
	display: block;
}
.productAnchor {
	margin-top: -70px; 
	position: absolute;
}
.subMenuItem {
	display: table-cell;
	width: 180px;
	text-align: center;
}
.subMenuItem img {
	width: 72px;
	display: block;
	margin: 5px auto;
}






.footerDiv {
	width:1200px;
	color:#888888;
	font-size:12px;
	line-height:200%;
	margin:0 auto;
	padding:50px 0;
	display: table;
}
.footerDiv a{
	color:#888888;
	padding:4px 10px;;
	margin: -4px -10px;
	text-decoration:none;
}

.footerDiv p{
	display:inline-table;
	margin-right:20px;
}
.footerDiv a:hover{
	color:#ffffff;
	border-radius:4px;
	background-color:#444444;
	transition: all .3s ease;
}
.cellDiv {
	display:table-cell;
	vertical-align:top;
}
.footerLink {
	 width:200px;
}
.footerLink li{
	display:block;
}

.footerLinkTitle {
	font-size:14px;
	font-weight: bold;
	display:block;
	color:#999999;
}
.onlineStore {
	display: block;
}
.mallIcon {
	height: 72px;
	margin-right: 20px;
	object-fit: cover;
	cursor: pointer;
	position: absolute;
	transition: all 0.3s ease;
	transform-origin: left bottom;
}
.onlineStore a:hover {
	background-color: transparent;
}
#videoWrapper {
	position: relative;
	width:100vw;
	overflow: hidden;
	clear: both;
}
#startvideo {
	width:100vw; 
	display: block;
}
.videoMask {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100vw; 
	background: -webkit-linear-gradient(0, transparent 0%, transparent 30%, #000 100%);
	background: -o-linear-gradient(0, transparent 0%, transparent 30%, #000 100%);
	background: -moz-linear-gradient(0, transparent 0%, transparent 30%, #000 100%);
	background: linear-gradient(0, transparent 0%, transparent 30%, #000 100%);
	z-index: 1;
}
.videoTextWrapper {
	position: absolute;
	top: 0px;
	bottom: 0px;
	width: 100vw; 
	z-index: 5;
}
.videoText {
	width: 1200px; 
	margin: 0 auto;
	display: block;
}
.videoTextTitle {
	font-size: 52px;
	font-weight: bold;
	color: #ffffff;
	margin: 240px 0 0 40px;
}
.videoTextContent {
	font-size: 20px;
	color: #ffffff;
	margin: 40px 0 0 40px;
}

.contentBodyWrapper {
	width:100vw; 
}
.contentBodyDiv {
	width:1200px;
	margin:0 auto;
	padding: 40px 0 20px 0;
	display:block;
	overflow: hidden;
	clear: both;
}
.contentBody {
	width:100vw; 
	display:block;
	overflow: hidden;
	clear: both;
}

.vgray {
	background-color:#f5fbfd;
}
.cc {
	margin-top: 70px;
} 
.homeProduct1Text {
	width:45%;
	color:#555555;
	font-size:16px;
	line-height:200%;
	float:left;
}
.homeProduct1TextTitle {
	font-size:32px;
	padding:24px 0;
	line-height: 125%;
}
.homeProduct1Img {
	width:45%;
	float:right;
}
.homeProduct1Img img {
	width:100%;
	border-radius: 10px;
}
.homeProduct1 img{
	width:100%;
}
.homeproductUnique img{
	width:100%;
}
.serviceQRdiv {
	display: flex;
}
.serviceQRdiv img {
	width: 180px;
	margin-bottom: 10px;
	display: block;
}
.serviceQRImgDiv {
	padding: 20px;
	background-color: #ffffff;
	display: block;
	margin-right: 32px;
	text-align: center;
}
.tel400 {
	font-size: 2em;
	font-style:italic;
	color: #009fe7;
}
.productDetailDiv {}
.productDetailDiv .norImg{
	display: block;
	margin: 0 auto;
	max-width: 100vw;
}
.productParamDiv{
	color: #dddddd;
	background-color: #000000;
	width: 80%;
	margin: 0 auto;
}
.productParamDiv table {
	width: 90%;
	margin: 0 auto;
	border-top: 1px solid #666666;
}
.productParamDiv td {
	color: #dddddd;
	border-bottom: 1px solid #555555;
	padding: 5px 12px;
}
.productParamDiv .tdbb {
	border-bottom: none;
}
.contentBodyLeft {
	width: 20%;
	display: table-cell;
	vertical-align: top;
}
.contentBodyRight {
	width: 75%;
	display: table-cell;
}
.contentBodycell {
	width: auto;
	display: table-cell;
}
.contentBodyLeft  table{
	width: 100%;
}
.contentBodyLeft  a{
	color: #666666;
	border-bottom: 1px solid #eeeeee;
	display: block;
	padding: 4px 20px;
}
.contentBodyLeft  strong{
	font-weight: bold;
	color: #222222;
	border-bottom: 1px solid #eeeeee;
	display: block;
	padding: 4px 20px;
}
.contentBodyRight img {
	max-width:100%;
}
.contentBodyRight .title {
	font-size: 24px;
	font-weight: bold;
}
.anchor {
	display: block;
	height: 80px; 
}
.navBar {
	width: 1200px;
	margin: 0 auto;
	padding: 20px;
	padding-top: 30px;
	color: #666;
}
.navContent {
	background-color: #f3f3f3;
	padding: 8px 20px;
	border-radius: 32px;
}
.navBar a {
	color: #666;
	text-decoration: none;
}
.navBar a:hover {
	color: #009fe7;
	text-decoration: underline;
}


.line1 {
	border:1px solid #333333;
	width: 100%;
	height:0px;
	margin:20px 0;
}
.beianImg {
	height:14px;
	vertical-align:middle;
}
.mycontactDiv {	
	background-color:#009ee6;
	overflow:hidden;
	width: 100vw;
	display: table;
}
.mycontactRow { display: table-row;}
.mycontactWhite {
	background-color:#FFFFFF;
	display: table-cell;
}
.mycontactBg {
	background-color:#009ee6;
	display: table-cell;
}
.mycontact {
	display: table-cell;
	width:1200px;
	background-color:#009ee6;
	background-image:url(../images/mycontact-bg.png);
	background-position:right;
	background-repeat:no-repeat;
	background-size:cover;
	padding:60px 0;
	color:#ffffff;
}
.mycontactTitle {
	font-size:40px;
	color:#ffffff;
	font-weight:normal;
}
.mycontactText {
	padding:32px 0;
	font-size:14px;
}
.mycontactButton {
	font-size: 14px;
	border-radius: 2em;
	line-height: 24px;
	color:#ffffff;
	background: rgba(255,255,255,0.2);
	border: solid 1px rgba(255,255,255,0.6);
	padding: 8px 30px;
	margin:0;
}
.mycontactButton:hover {
	background: rgba(255,255,255,0.4);
}
.contactusText {
	padding-top: 12px;
	font-size: 20px;
	line-height: 150%;
}
.columnTitle {
	font-size: 36px;
	padding: 32px;
	text-align: center;
	display: block;
	clear: both;
}
.columnProduct {
	display: table-cell;
	width: 24%;
}
.columnProduct img {
	width: 100%;
	border-radius: 10px;
}
.columnThree {
	display: table-cell;
	width: 30%;
}
.columnThreeImg {
	width: 40px;
	margin: 10px auto;
	display: block;
	
}
.columnCellSpacer {
	display: table-cell;
	width: 0;
	font-size: 0px;
}
.tableDiv {
	display: table;
	width: 100%;
}
.contacttUsPage {
	width: 600px;
	display: block;
	padding: 40px 0;
	margin: 0 auto;
}

.contacttUsPage input,textarea {
	padding: 15px 20px !important;
	margin: 10px auto !important;
	width: 100%;
	border: 1px solid #bbbbbb !important;
	border-radius: 5px !important;
}
.contacttUsPage .button-large {
	width: 100%;
	background-color: #009fe7;
	color: #ffffff;
	font-size: 16px;
	padding: 10px 20px;
	border: none;
}
.contacttUsPage .button-large:hover {
	background-color: #2dbeff;
}
.contacttUsPage .button-large:active {
	border: 1px solid #006c9d;
	background-color: #006ea0;
}
.blackbg {
	background-color: #000000;
}
.graybg {
	background-image:url("../images/graybg.jpg");
	background-size:cover;
	background-repeat: no-repeat;
	background-position: center;
}
.graydotbg {
	background-image:url("../images/graydotbg.jpg");
	background-size:cover;
	background-repeat: no-repeat;
	background-position: center;
}
.graylinebg {
	background-image:url("../images/graylinebg.jpg");
	background-size:cover;
	background-repeat: no-repeat;
	background-position: center;
}
.graydotbg {
	background-image:url("../images/graydotbg.jpg");
	background-size:cover;
	background-repeat: no-repeat;
	background-position: center;
}
.contentImg {
	display: block;
	display: flex;
}
.contentImg img {
	width: 100vw;
	display: block;
}
.contentImgTextDiv {
	width: 100vw;
	position: absolute;
	left: 0;
}

.contentImgTextWrapper {
	width: 1200px;
	margin: 0 auto;
}
.contentImgTitle {
	font-size: 30px;
	color: #ffffff;
	margin-top: 100px;
}
.contentImgText {
	font-size: 16px;
	color: #ffffff;
	margin-top: 40px;
	width: 50%;
	line-height: 180%;
}
.cTitle {
	text-align: center;
	font-weight: bold;
	display: block;
	padding: 5px;
}
.mImgContent {
	display: block;
	width: 100vw;
	padding: 40px 0 20px 0;
}
.mImgContentWrapper {
	width: 1200px;
	margin: 0 auto;
}
.mImg {
	display: block;
	width: 90%;
	margin: 0 auto;
}
.partnerDiv {
	width: 1200px;
	margin: 0 auto;
}
.partnerDiv  img{
	width: 16%;
	margin: 20px 2%;
	float: left;
	border-radius: 12px;
	box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15);
}
.zpItem {
	display: block;
	background-color: #ffffff;
	border-radius: 10px;
	padding: 20px;
	margin: 15px;
	width: 30%;
	box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15); 
	float: left;
}
.zpItem:hover {
	background-color: #def0fa;
}
.loca {
	height: 16px;
	width: 11px;
	display: inline;
	vertical-align: middle;
	margin: 0 4px;
}
.zpTitle {
	font-weight: bold;
	font-size: 20px;
	display: block;
	padding: 5px 0;
	color: #333333;
}
.zpText {
	display: block;
	padding: 10px 0;
	color: #333333;
}
.contactZpPage {
	width: 800px;
	display: block;
	padding: 40px 0;
	margin: 40px auto;
}
.zpDetail {
	line-height: 220%;
}
.contenNotes {
	margin-bottom: 20px;
	padding: 20px;
	background: #666666;
	border-radius: 10px;
	color: #ffffff;
}
.homeImg4 {
	background-color: #222c38;
}
.manualItem {
	width: 500px;
	background-color: #ffffff;
	display:block;
	border-radius: 20px;
	padding: 20px;
	margin: 20px 50px;
	box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15);
	float: left;
}
.manualItem:hover {
	background-color: #def0fa;
}

.manualTitle {
	font-weight: bold;
	font-size: 18px;
	display: block;
	padding-top: 20px;
	text-align: center;
	color: #333333;
}
.manualImg {
	width: 100%;
	border-radius: 12px;
}
.downloadTopDiv {
	background-color: #009ee6;
	background: -webkit-linear-gradient(0, #009ee6 0%, #009ee6 30%, #0e61a1 100%);
	background: -o-linear-gradient(0, #009ee6 0%, #009ee6 30%, #0e61a1 100%);
	background: -moz-linear-gradient(0, #009ee6 0%, #009ee6 30%, #0e61a1 100%);
	background: linear-gradient(0, #009ee6 0%, #009ee6 30%, #0e61a1 100%);
	width: 120vw; 
	margin-left: -10vw; 
	border-radius: 0 0 50% 50%;
}
.downloadTopTitle {
	width: 100%;
	color: #ffffff;
	font-size: 36px;
	padding-top: 30px;
	text-align: center;
	display: block;
	clear: both;
}
.downloadTopImg {
	width: 100vw;
}

.downloadItem,
.downloadQrItem {
	background-color: rgba(255,255,255,0.1);
	color: #ffffff;
	font-size: 16px;
	font-weight: normal;
	width: 120px;
	height: 120px;
	border-radius: 60px;
	display: block;
	margin: 0 20px;
	float: left;
	cursor: pointer;
}
.downloadQrItem {
	position: relative;
}
.downloadQrItem:nth-child(1) {
	margin-left: 120px;
}
.downloadQrDiv {
	display: none;
	position: absolute; 
	top: 0; 
	left: 0;
}
.downloadItem:hover {
	background-color: rgba(255,255,255,0.4);
	color: #ffffff;
}
.downloadImg {
	width: 60%;
	margin: auto;
}
.downloadIcon {
	width: 50px;
	margin: auto;
	display: block;
	margin: 20px auto 5px auto;
}
.downloadButtonDiv {
	width: 800px;
	margin: 20px auto;
}
.buttonItem {
	width: 360px;
	color: #ffffff;
	background-color: rgba(255,255,255,0.1);
	border-radius: 12px;
	font-size: 16px;
	padding: 20px;
	margin: 20px;
	float: left;
	cursor: pointer;
}
.buttonItem:hover {
	background-color: rgba(255,255,255,0.4);
}
.dIcon {
	float: left;
	margin-right: 15px;
}
.dTitle{
	font-size: 16px;
	font-weight: bold;
}
.dNotes{
	font-size: 12px;
	margin-top: 5px;
}
.download2Div {
	background-color: #6f48de;
	background: -webkit-linear-gradient(0, #885ffc 0%, #885ffc 30%, #643cd5 100%);
	background: -o-linear-gradient(0, #885ffc 0%, #885ffc 30%, #643cd5 100%);
	background: -moz-linear-gradient(0, #885ffc 0%, #885ffc 30%, #643cd5 100%);
	background: linear-gradient(0, #885ffc 0%, #885ffc 30%, #643cd5 100%);
	background-size: cover;
	width: 100vw;
	height: 660px;
}
.download_wai {
	height: 100%;
	background-image: url("../images/download_wai.png");
	background-position:  left bottom;
	background-repeat: no-repeat;
	background-size:contain;
}
.download2Rgiht {
	float: right;
	height: 100%;
	width: 50%;
}
.down2QRDiv {
	padding: 20px;
	background-color: rgba(255,255,255,0.2);
	border-radius: 10px;
	width: 260px;
	margin-left:200px;
	margin-top: 100px;
}
.down2QR {
	display: block;
	width: 100%;
}
.down2QRText {
	color: #ffffff;
	width: 260px;
	font-size: 16px;
	text-align: centr;
	display: block;
	margin-top: 20px;
	margin-left:200px;
}
.down2QRNote {
	color: #fff;
	width: 260px;
	font-size: 12px;
	text-align: centr;
	display: block;
	margin-top: 10px;
	margin-left:200px;
}
.feText {
	display: table-cell;
	width: 20%;
	font-size: 20px;
	color: #888888;
	text-align: center;
	padding: 32px 0;
	border-radius: 12px;
	margin: 24px 0;
	background-color: #f2f2f2;
}
.deepseekContent {
	width: 1060px;
	margin: auto;
}



@media screen and (max-width: 1180px) {
	.contentBodyDiv, .headerDivInner, .videoText, .footerDiv, .partnerDiv, .mycontact, .mImgContentWrapper, .contentImgTextWrapper {
		width: 95%;
		margin: auto;
	}
	.productList a{
		width: 20%;
	}
	.productList img{
		width: 100%;
		height: auto;
	}
	.footerLink {
	 	width:16%;
	}

}