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

@media (orientation: portrait) {
  html {
    transform: rotate(90deg) translateY(-100%);
    transform-origin: left top;
    width: 300vw;
   height: 100vh;
    overflow-x:auto;
    position: absolute;
	overflow-y: auto;
  }
}

body{
	margin: 0;
	padding: 0;
	height: 100vh;
	
	align-content: center;
}
.container{
	width:100%;
	height: 5.66%;
	max-height: 3867px;
	position: relative;
}
.center{
	width:100%;
	height:100%;
	position: relative;
}
.center img{
	width: 100%;
	height: 100%;
}
.container img{
	width: 100%;
	height: 100%;
}

.tooltip{
	width:0.5%;
	height:10%;
	background-color: #13F742;
	border-radius:50%;
	position: absolute;
	animation: wave 1s infinite;
	cursor: pointer;
}
.tooltip .hide {
  text-indent: 2em;
  font-size: 1em;
  width: 300px;
  background-color: rgba(255, 255, 255, 0.9);
  color:black;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
  text-align: left;
  border-radius: 6px;
  padding: 5px 0;
  border: 2px solid #fff;
  position: absolute;
  display: none;
  top: 100%; /* Position the tooltip above the area */
  left: -150px;
  overflow: hidden;
  
}
 
.tooltip:hover .hide{
  
  display:block;
}
.tooltip2{
	width:0.5%;
	height:1%;
	background-color: #13F742;
	border-radius:50%;
	position: absolute;
	animation: wave 1s infinite;
	cursor: pointer;
}
.tooltip2 .hide {
  text-indent: 2em;
  font-size: 1em;
  width: 300px;
  background-color: rgba(255, 255, 255, 0.9);
  color:black;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
  text-align:left;
  border-radius: 6px;
  padding: 5px 0;
  border: 2px solid #ccc;
  position: absolute;
  display: none;
  top: 100%; /* Position the tooltip above the area */
  left: -150px;
  overflow: hidden;
}
 
.tooltip2:hover .hide{
  
  display:block;
}
@keyframes wave{
	from{
		box-shadow: 0 0 0 0 #9acd32bb;
	}
	to{
		box-shadow: 0 0 0 10px #9acd3210;
	}
}

.tooltip3{
	width:1%;
	height:2%;
	background-color: #FC0307;
	border-radius:50%;
	position: absolute;
	animation: tiao 1s infinite;
	cursor: pointer;
}
.tooltip3 .hide {

  width: 120px;
  background-color: rgba(255, 255, 255, 0.9);
  color:black;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
  text-align:left;
  border-radius: 6px;
  padding: 5px 0;
  border: 2px solid #fff;
  position: absolute;
  display: none;
  top: 100%; /* Position the tooltip above the area */
  left: -60px;
  overflow: hidden;
}
 
.tooltip3:hover .hide{
  
  display:block;
}

@keyframes tiao {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0);
  }
}















.footer {
         
           overflow: hidden;
	       width:100%;
	       height: 4.93%;
	       position: relative;
	   
	      
        }
.footer img{
	width:100%;
	height: 100%;
}
.footer .daohang{
	left: 0%;
	top:0px;
	position: absolute;
	width: 100%;
	height: 100%;
	
    place-items: center;
}
.footer .daohang .mulu{
	width:6.25%;
    height: 100%;
	font-size: 0.8em;
	 display: inline-block;
	 float: left;
	background:url("../img/bottombj.jpg") ;
	background-size: 100% 100%;
	line-height: 100%;
	
}
.footer a {
	float: left;
	width:100%;
    height: 100%;
  display: grid;
	place-items: center;
	color: black;
	text-align: center;
	padding: 0px;
	text-decoration: none;
	
}
.footer a:hover {
	color: white;
	
	text-shadow: 
    1px 1px 1px rgba(0, 0, 0, 0.3), /* 外阴影（可选） */
    -1px -1px 1px rgba(0, 0, 0, 0.5); /* 反向阴影模拟内阴影 */
	
	background-color:rgba(255, 255, 255, 0.5);
	border-bottom: 1px solid #fff;
	background: linear-gradient(0deg,#fff,transparent);
	transition:0.5s;
	pointer-ebents:none;
	filer:drop-shadow(0 5px 25px #08f9ff);
	
	
}

.footer  span{
	line-height: 100%;
}

.content {
	display: none;
	padding: 0px;
	width: 100%;
	height: 89.40%;
	overflow: hidden;
	background-color: #000;
}
.content .no-border-iframe{
	border: none;
	width:100%;
    height: 100%;
	overflow: hidden;
}


.ganxie{
  
   text-indent: 2em;
   font-size: 1em;
  
  
	
   background-color: #808080;
   color:wheat; 
	

	 display: flex;            /* 启用 Flex 布局 */
  flex-direction: column;   /* 子元素垂直排列 */
  justify-content: center;  /* 垂直居中 */
  align-items: center;      /* 水平居中 */
  height: 100vh;            /* 父容器高度 */
  gap: 20px;  
  
 
}
.juzhon{
	width: 50%;
    line-height: normal;   
	
}
.juzhon .touying{
	/* 投影效果 */
	-webkit-box-reflect:below 1px linear-gradient(transparent, rgba(0,0,0,0.2));
	margin-bottom: 8%
}

.juzhon h1{
	font-size: 5vw;
	text-align: center;
	/* 字间距 */
    letter-spacing: 15px;
	/* 转大写 */
    text-transform: uppercase;
	/* 自定义属性 --c,可通过 var 函数对其调用 */
            --c:lightseagreen;
            /* 调用自定义属性--c，设置文字阴影（发光效果） */
            text-shadow: 0 0 10px var(--c),
            0 0 20px var(--c),
            0 0 40px var(--c),
            0 0 80px var(--c),
            0 0 160px var(--c);
            /* 执行动画：动画名 时长 线性的 无限次播放 */
            animation: animate 5s linear infinite;

        }
	

   
/* 定义动画 */
@keyframes animate{
	to{
		/* 色相旋转过滤镜（设置度数可改变颜色） */
		filter: hue-rotate(360deg);
	}
}
.juzhon2{
	width:25%;
	
  background: #ccc;
  line-height: normal;   

	/* 投影效果 */
	-webkit-box-reflect:below 1px linear-gradient(transparent, rgba(0,0,0,0.2));
	margin-bottom: 5%;
}
.juzhon2 li{list-style:none;outline: 1px solid white;}
.juzhon2 ul{padding: 0px;margin: 0px; width:100%;height: 30vh;}
.juzhon2 ul li{float:left; width: 16.66%;height:  30vh;overflow: hidden;text-indent:0em;color:white;}
.juzhon2 ul li.li1{background:url("../img/xubaojin.PNG")  ;background-size:cover;}
.juzhon2  ul li.li2{background:url("../img/zhengqun.PNG") ;background-size:cover;}
.juzhon2  ul li.li3{background:url("../img/ninhe.jpg") ;background-size:cover;}
.juzhon2  ul li.li4{background:url("../img/fanlongfei.PNG") ;background-size:cover;}
.juzhon2  ul li.li5{background:url("../img/qiankai.JPG") ;background-size:cover;}
.juzhon2  ul li.li6{background:url("../img/yangbao.jpg") ;background-size:cover;}
.juzhon2  ul li p{padding-top:200%; }
.juzhon2  ul:hover li{width:12%;}
.juzhon2 ul li:hover{width:40%;background-size: 100% 100%;cursor: pointer;}

/* 进场动画 */
.jingchang {
    font-size: 6vw;
    font-weight: bold;
	position: fixed;
    zindex: 9999999;
    text-transform: uppercase;
	width: 100%;
    height: 100%;
    background-color: #000;
    display: flex;
    justifycontent: center;
    alignitems: center;
}

svg {
    position: absolute;
    width: 100%;
    height: 100%;
}

.text {
    fill: none;
    stroke-width: 2;
    stroke-dasharray: 0 240;
    stroke-dashoffset: 0;
}

.text:nth-child(4n + 1) {
    stroke: rgb(255, 179, 186);
    animation: text1 4s ease-in-out forwards;
}

.text:nth-child(4n + 2) {
    stroke: rgb(152, 255, 152);
    animation: text2 4s ease-in-out forwards;
}

.text:nth-child(4n + 3) {
    stroke: rgb(255, 216, 163);
    animation: text3 4s ease-in-out forwards;
}

.text:nth-child(4n + 4) {
    stroke: rgb(179, 229, 252);
    animation: text4 4s ease-in-out forwards;
}

@keyframes text1 {
    100% {
        stroke-dashoffset: 1000;
        stroke-dasharray: 60 180;
    }
}

@keyframes text2 {
    100% {
        stroke-dashoffset: 1060;
        stroke-dasharray: 60 180;
    }
}

@keyframes text3 {
    100% {
        stroke-dashoffset: 1120;
        stroke-dasharray: 60 180;
    }
}

@keyframes text4 {
    100% {
        stroke-dashoffset: 1180;
        stroke-dasharray: 60 180;
    }
}


.phone {
  background: rgba(255, 255, 255, 0.25); /* 半透明白色基础背景 */
  backdrop-filter: blur(10px); /* 背景模糊效果 */
  -webkit-backdrop-filter: blur(10px); /* 兼容Safari */
  
  /* 边框和阴影 */
  border: 1px solid rgba(255, 255, 255, 0.3); /* 半透明边框 */
  border-radius: 12px; /* 圆角 */
  box-shadow: 
    0 4px 6px rgba(0, 0, 0, 0.1), /* 外部阴影 */
    inset 0 0 15px rgba(255, 255, 255, 0.4); /* 内发光效果 */
  
  /* 尺寸和布局 */
  padding: 20px;
  width: 300px;
  height: 200px;
}