@charset "utf-8";
/* CSS Document */

@font-face {
  font-family: 'box-text';
  src: url("../../fonts/Inder.woff");
  font-display: swap;
}
@font-face {
  font-family: 'parallax-text';
  src: url("../../fonts/Blinker.woff");
  font-display: swap;
}
@font-face {
  font-family: 'header-big';
  src: url('../../fonts/Magistral-Book.woff');
  font-display: swap;
}

html {
  height:100%;
	overflow: hidden;
	overflow-y:scroll;
}
body {
  height:100vh!important;
	animation: fadeIn 1s;
}
@keyframes fadeIn {
	0% {opacity:0;background-color:#000;}
	90% {opacity:0;}
	100% {opacity:1;background-color:#fff;}
}

body,  p, h1, h2, h3 {
	margin:0; padding: 0;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
}
a {
	text-decoration:none;
}
* {
  box-sizing: border-box;
}


/* HEADER LNG --START-- */
.header-lng {
	display:flex; flex-direction: row; flex-wrap:nowrap; 
	justify-content: center; align-content: center; align-items: center;
	position: relative; width:175px;
	margin: 0px 25px 5px auto!important;
	z-index:100;
}
.header-lng a {
	height:35px; width: 80px; display: inline-block;
	font-size: 12pt; line-height: 2; font-family: "Verdana", "sans-serif";
	font-weight: bold; text-align: center; text-decoration: none;
  color: black; background-color: white;
  margin: 0px auto 0px auto!important; padding:auto 4px;
  border-radius: 8px; border:solid 2px black;
}.header-lng a:first-child {
	margin-left:0px!important;
}.header-lng a:last-child {
	margin-right:0px!important;
}
.header-lng a.active-btn {
  background-color: black; color: white;
}
.header-lng a:hover {
  background-color: black; color: white;
}
/* HEADER LNG --END-- */



#main-div {
  background-color: white;
  display: flex; flex-wrap: nowrap; flex-direction:column;
  width:100%; height:500vh;
	margin:95px 0 0 0;
	padding:0 10px;
}

/* OVERLAY QR --START-- */
.overlay {
  height: 0%; width: 100%;
  position: fixed; top: 0; left: 0;
  z-index: 200000!important;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-y: hidden;
  transition: 0.5s;
}
.overlay-content {
  position: relative; width: 100%;
  top: 10%;
  text-align: center;
  margin-top: 25px;
}
.overlay a {
  display: block; padding: 8px;
  color: white;
  font-size: 30pt; text-decoration: none;
  transition: 0.3s;
}
.overlay a:hover, .overlay a:focus {
  color: #f1f1f1;
}
.closebtn {
  position: absolute; top: 20px; right: 45px;
  padding: 0px;
  font-size: 42pt!important; font-weight:bold;
  border:10px solid transparent!important;
  background-clip:padding-box!important;
}

#qr_wechat {
  width:45%;
  padding:3px;
}
#qr_qq {
  width:25%;
  padding:0px;
}
/* OVERLAY QR --END-- */


/* FOOTER --START-- */
.footer-div {
  position:fixed!important; display:inline-block;
	/*top:900vh!important;*/ width:100%; height:auto;
  background-color: white; bottom:0;
  border-top: solid 5px black;
	z-index: 99999!important;
}
.footer-line1 {
  display:flex; flex-direction:row; flex-wrap:wrap;
  align-items:center; justify-content: center;
  list-style-type: none;
  margin: 3px 0px 0px; padding:2px;
}
.footer-line1 li {
  margin:0px 20px;
	cursor:pointer;
 }
.footer-line1 .contact_img {
  width:130%;
}
.footer-line1 .contact_img:hover {
  transform:scale(1.20);
  transition: ease-in 0.2s;
  -webkit-transform:scale(1.20);
  -moz-transform:scale(1.20);
  -ms-transform:scale(1.20);
}
.footer-line2 {
  display:flex; flex-direction:row; flex-wrap:wrap;
  align-items:center; justify-content: center;
  list-style-type: none;
  margin:0px; padding:2px;
}
.footer-line2 li {
  margin:0px 30px;
	cursor:pointer;
 }
.footer-div li a {
  text-decoration: none;
  color:black;
}
.footer-text1 {
  font-size: 9pt; line-height: 10pt;
  text-align: right; vertical-align: middle;
}
.footer-text2 {
  font-size: 9pt; line-height: 12pt; font-family: 'box-text'!important;
  text-align: left; vertical-align: middle;
  margin-left:auto; margin-right: auto;
}
.footer-line2 a#beian:hover {
  text-decoration: none;
  background:#DDDDDD;
}
.footer-line2 a#icp:hover {
  text-decoration: none;
  background:#DDDDDD;
}
#icp-n {
  border-left: solid thin black;
  padding-left:7px;
}
#beian-n {
  border-right: solid thin black;
  padding-right:7px;
}
#police_logo {
  display:inline-block;
  width: 7%;
  margin:0px 0px 3px 2px;
  vertical-align: middle;
}
/* FOOTER --END-- */


@media screen and (max-width : 850px ){


/* OVERLAY QR --START-- */
#qr_wechat {
  width:65%;
}
#qr_qq {
  width:40%;
  padding:5px;
}
/* OVERLAY QR --END-- */

/* FOOTER --START-- */
.footer-div {
  position:fixed!important; display:block; width:100%;
  top:inherit!important; bottom:0!important;
  background-color: white;
  margin:0px 0px -5px 0px;
  z-index:99999!important;
}
.footer-line1 {
  padding:1px; margin-top:1px; margin-bottom:0px;
}
.footer-line1 li {
  margin: 1px 15px 0px 15px;
}
.footer-line1 .contact_img {
  width:120%;
}
.footer-line2 {
  padding:2px; margin-top:5px; margin-bottom:5px;
}
.footer-line2 li {
  margin: 1px 12px 0px 12px;
}
.footer-text1 {
  font-size: 9pt;
  text-align: center;
}
.footer-text2 {
  font-size: 8pt; line-height: 10pt;
  text-align: center;
}
/* FOOTER --END-- */
}


@media screen and (max-width : 690px ){



.header-lng {
	text-align: center;
	margin: 0px auto 10px auto!important;
}
#main-div {
	flex:100%;
	padding:0px 5px;
}


/* OVERLAY QR --START-- */
#qr_wechat {
  width:85%;
}
#qr_qq {
  width:45%;
  padding:3px;
}
/* OVERLAY QR --END-- */

/* FOOTER --START-- */
.footer-div {
  position: fixed; overflow:hidden;
  display:block; width:100%;
  margin:0px!important;
  bottom:0px!important;
  background-color: white;
  z-index:10000!important;
}
.footer-line1 {
  margin-top:4px; margin-bottom:0px; padding:2px;
}
.footer-line1 li {
  margin:0px 15px;
}
.footer-line1 .contact_img {
  width:115%;
}
.footer-line2 {
  margin-top:2px; margin-bottom:2px; padding:0px 2px;
}
.footer-line2 li {
  margin:0px 10px;
}
.footer-text2 {
  font-size: 8pt; line-height: 10pt;
  text-align: center;
}
/* FOOTER --END-- */
}


@media screen and (max-width: 450px) {
.overlay {
  overflow-y: auto;
}
.overlay a {
  font-size: 16pt;
}
.closebtn {
  top: 15px; right: 15px;
}

.header {
	height:120px;
}
.footer-line1 {
  margin-top:1px; margin-bottom:0px; padding:2px;
}
.footer-line1 li {
  margin:0px 10px;
}
.footer-line1 .contact_img {
  width:110%;
}
.footer-line2 {
  margin-top:1px; margin-bottom:0px; padding:0px 2px;
}
.footer-line2 li {
  margin:0px 10px;
}
}


@media screen and (max-width: 360px) {
.footer-line1 {
  margin-top:1px; margin-bottom:0px; padding:2px;
}
.footer-line1 li {
  margin:0px 10px;
}
.footer-line1 .contact_img {
  width:95%!important;
}
.footer-line2 {
  margin-top:1px; margin-bottom:0px; padding:0px 2px;
}
.footer-line2 li {
  margin:0px 8px;
}
}







@media screen and (max-height: 450px) {
.overlay {overflow-y: auto;}
.overlay a {font-size: 20px}

.overlay .closebtn {
  font-size: 30px;
  top: 15px; right: 35px;
}
}
