﻿/* CSS Document */
* {margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body {width:100%;height:100%;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#f5f7fa;color:#333;line-height:1.4;}
ul{display:inline-block;margin:0; padding:0;}
a,a:hover,a:focus{text-decoration:none;}
a
{-webkit-transition: all 0.3s ease;	-moz-transition: all 0.3s ease;	-o-transition: all 0.3s ease;	-ms-transition: all 0.3s ease;	transition: all 0.3s ease;}

html {font-size: 16px;}
@media (min-width: 1024px) { html {font-size: 12px;} }
@media (min-width: 1440px) { html {font-size: 14px;} }
@media (min-width: 1680px) { html {font-size: 16px;} }
@media (min-width: 1920px) { html {font-size: 18px;} }


/* 导航栏 */        
.nav-bar {position:fixed;top:0;left:0;width:100%;height:60px;backdrop-filter:blur(0px);display:flex;justify-content:space-between;align-items:center;padding:0 10px;z-index:100;}
.nav-button {border:none;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#b3b3b3;cursor:pointer;transition:all 0.3s ease;float:left;}
.nav-button span{font-size:1.8rem;}
.nav-button:active {transform:scale(0.95);}
/* 隐藏状态的顶部按钮 */
.nav-button.hidden {opacity: 0;	visibility: hidden;	transform: scale(0);}
.nav-title {color:white;font-size:1.2rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,0.0);}

/* 侧边菜单 */        
.side-menu {position:fixed;top:0;left:-300px;width:280px;height:100vh;background:white;z-index:2000;box-shadow:0 0 30px rgba(0,0,0,0.2);transition:left 0.4s ease;display:flex;flex-direction:column;}
.side-menu.active {left:0;}
.menu-header {padding:25px 20px 20px;position:relative;}
.menu-header p {background-image: url(../img/logo-cai.png);background-repeat: no-repeat;background-size:100%;width:50%;height:2.5rem}
.menu-close {position:absolute;top:20px;right:20px;width:36px;height:36px;color:#454545;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.menu-close span{font-size:2rem;}
.menu-items {flex:1;overflow-y:auto;padding:0px 0;}
.menu-item {display:flex;align-items:center;padding:18px 25px;color:#333;text-decoration:none;border-left:4px solid transparent;transition:all 0.2s ease;}
.menu-item:active {background:#f5f7fa;border-left-color:#6a11cb;}
.menu-item.active {background:#f0f4ff;border-left-color:#44b035;color:#088fbe;font-weight:500;}
.menu-item i {width:24px;margin-right:15px;font-size:1.1rem;}
.menu-overlay {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:1500;opacity:0;visibility:hidden;transition:all 0.3s ease;}
.menu-overlay.active {opacity:1;visibility:visible;}

/* 主容器 */        
.container {position:relative;width:100%;height:100vh;overflow-y:auto;scroll-snap-type:y mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;}
/* 每屏样式 */        
.section {width:100%;height:100vh;scroll-snap-align:start;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:0px;position:relative;text-align:center;}
/* 为每个屏幕设置不同的背景色 */        
.section:nth-child(1) {background-color: #7b0012;padding: 20px;}
.section:nth-child(2) {background-color: #eeede9;padding: 0;}
.section:nth-child(3) {background:linear-gradient(135deg,#004994 0%,#004994 100%);padding: 0;}
.section:nth-child(4) {background-image: url(../img/p4-bg.png);background-repeat: no-repeat;background-size:100%;justify-content:start;}
.section:nth-child(5) {background-image: url(../img/p5-bg.png);background-repeat: no-repeat;background-size:100%;justify-content:start;}
.section:nth-child(6) {background:linear-gradient(135deg,#e5e3e1 0%,#e5e3e1 100%);justify-content:start;}
.section:nth-child(7) {background-image: url(../img/p7-2.png);background-repeat: no-repeat;background-size:100%;}
.section:nth-child(8) {background:linear-gradient(135deg,#e5e3e1 0%,#f3f3f3 100%);}
.section:nth-child(9) {background:linear-gradient(135deg,#fff 0%,#eee 100%);}


/******* 第1屏 *******/     
.icon-logo {font-size:2.5rem;display:flex;align-items:center;justify-content:center;background-image: url(../img/logo-w.png);background-repeat: no-repeat;background-size:100%;width:40%;height:2.5rem ;
	position: absolute;top: 20px;right: 20px;z-index: 110;}
.con1 {padding: 10px;}
.con1 img{width: 90%;height: auto;object-fit: contain;}

/******* 第2屏产品 ********/      
.con2title{width:auto;height:4.5rem ;position: absolute;top:5rem;left: 3rem;} 
.con2title img{width:auto;height:100%;} 

.plink {display:inline-block;color:#4d4d4d;padding:12px 30px;border-radius:30px;text-decoration:none;margin-top:15px;font-weight:500;transition:all 0.3s ease;font-size:0.95rem;cursor:pointer;}
.plink:active {background:rgba(255,255,255,0.3);transform:translateY(-2px);box-shadow:0 5px 15px rgba(0,0,0,0.2);}
.plink img{width:100%;}
.plink2 img{width:80%;}

/* 左右滑动的指示器 */        
.cpindt {display:flex;justify-content:center;margin-top:20px;gap:0px;width:90%;position: relative;}
.cpindt-dot {width:23%;height:2px;border-radius:0%;background: rgb(191, 191, 191);transition:all 0.3s ease;}
.cpindt-dot.active {background: rgb(77, 77, 77);transform:scale(1.0);}
.cpindt i{margin-top: -10px;}
.cpindt-btn{width:100%;margin-top: 30px;}
.cpindt-btn .plink2{display: none;}
.cpindt-btn .plink2.open{display: block;}

/* 左右滑动的容器 */        
.cpindcon {width:100%;height:70%;margin-top: -20%; overflow-x:auto;display:flex;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
.cpindcon::-webkit-scrollbar {display:none;}
.cpindcon-slide {flex:0 0 100%;min-width:100%;height:100%;scroll-snap-align:start;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:0px;color:#333;text-align:center;}
.cpindcon-slide {padding:0;margin: 0;}
.cpindcon-slide img{padding:0;margin: 0;width: 100%;}


/******** 第3屏新闻 ********/   
/* 左右滑动的指示器 */        
.xinwenind {display:flex;justify-content:center;margin-top:0px;gap:0px;width:90%;position:absolute;top:70px;height: auto;}
.xinwenind-dot {width:33%;height:auto;transition:all 0.3s ease;opacity:0.7;padding:15px;text-align: left;display: block;cursor: pointer;display:block;}
.xinwenind-dot.active {transform:scale(1.1);opacity:1;}
.xinwenind-dot img:nth-child(1){padding:0px;width:100%;}
.xinwenind-dot img:nth-child(2){padding:0px;width:80%;opacity:0;}
.xinwenind-dot.active img:nth-child(2){opacity:1;}

/* 左右滑动的容器 justify-content:center;*/        
.xinwencon {width:100%;height:100%;margin:0px;overflow-x:auto;display:flex;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
.xinwencon::-webkit-scrollbar {display:none;}
.xinwencon-slide {flex:0 0 100%;min-width:100%;height:100%;scroll-snap-align:start;display:flex;flex-direction:column;align-items:center;padding:0px;color:#fff;text-align:left;}
.xinwencon-slide {width:100%;overflow: hidden; color: #fff;padding-top: 160px;}
.xinwencon .xinwencon-slide:nth-child(1){background-image: url(../img/p3-1.png);background-size:100%;background-position: center right;}
.xinwencon .xinwencon-slide:nth-child(2){background-image: url(../img/p3-2.png);background-size:100%;background-position: center right;}
.xinwencon .xinwencon-slide:nth-child(3){background-image: url(../img/p3-3.png);background-size:100%;background-position: center right;}

/* 新闻 */   
.xinwencon-slide ul{height:auto;padding:20px 40px;width:100%;}
.xinwencon-slide li{list-style: none;border-bottom: 1px solid #fff; width:100%;display:block;padding:10px 0px;margin:0px;}
.xinwencon-slide li p{font-size: 0.9rem;font-style: normal;padding: 5px 0;}
.xinwencon-slide li a{color: #fff;font-size: 1.0rem;font-weight:500;}
.xinwencon-slide li a span{display:block; font-size:12px;padding: 10px 0 10px 0px;}
.xinwencon-slide li a span i{font-size:12px;}
.xinwencon-slide .plink2 img{width:80%;margin: 0 auto;display: block;}

/******** 第4屏 ********/      
.con4con{padding:3rem;font-size: 1rem;margin-top:30%;color: #4d4d4d;text-align: left;line-height: 1.6;width: 100%;}
.conbtnpo .plink2{position: absolute;bottom: 6rem;}

/* 第7屏招聘 */      
.con7con{padding:0rem;font-size: 1rem;line-height: 1.6;width: 80%;}
.con7con a{width:100%;height: auto;border:1px solid #fff;border-radius:1.5rem;line-height:2.6rem;font-size: 1.2rem;color: #fff;display: block;margin:2rem 0;}

.zhaopin{padding: 40px 20px;overflow-y:auto;}
.zhaopin ol{list-style: none;}
.zhaopin p{padding: 10px 0;}

/* 第8屏联系 */    
.con8con{padding:3rem;font-size: 1rem;line-height: 1.4;overflow-y:auto;text-align: left;margin:;}
.con8con img{width: 100%;padding:10px 0;}
.con8con h2{font-size:1.2rem;padding:20px 0 10px 0;}
.con8con p{font-size:1rem;padding:10px 0 0;}

.con9con{padding:6rem 3rem 0;font-size: 1rem;line-height: 1.6;overflow-y:auto;text-align: left;}
.con9con h2{font-size:1.5rem;}
.con9con a{color:#444;}
.con9con p{font-size:1rem;padding: 10px 0;}
.shareCode{text-align: center;}
.shareCode img{width:40%;padding:10px 0;}





/* 弹出窗口容器 */   
.popup-container {position:fixed;top:0;left:0;width:100%;height:100%;background:#e5e3e1;z-index:3000;opacity:0;visibility:hidden;transition:all 0.3s ease;display:flex;flex-direction:column;}
.popup-container.active {opacity:1;visibility:visible;}

.popup-header {padding:25px 20px 10px;display:flex;justify-content:space-between;align-items:center;}
.popup-header h3 {font-size:1.5rem;font-weight: 500;}
.popup-close {position:absolute;top:20px;right:20px;width:36px;height:36px;color:#454545;cursor:pointer;display:flex;align-items:center;justify-content:center;background-color:#e5e3e1;}
.popup-close i{font-size:2rem;}

.popup-piccon{flex:1;padding:0px;overflow-y:auto;color:#4d4d4d;font-size:1rem;line-height:0;}
.popup-piccon img{width: 100%;height: auto;line-height: 0;}

/* 弹出窗口的新闻 */  
.popnewbg{padding:0px;overflow-y:auto;color:#4d4d4d;line-height:1.6;}
.popnewbg ul{height:90%;padding:0 20px 20px;}
.popnewbg li{list-style: none;border-bottom: 1px solid #999; width:100%;display:block;padding:10px 0px;margin:0px;}
.popnewbg li:last-child{border-bottom:none;}
.popnewbg li img{width: 100%;}
.popnewbg li p{font-size: 1rem;font-style: normal;padding: 10px 0;}
.popnewbg li a{color: #444;font-size: 1.1rem;font-weight:500;}
.popnewbg li a span{display:block; font-size:14px;padding: 15px 0 10px 0px;}
.popnewbg li a span i{font-size:14px;}

/* 弹出窗口公司 */  
.popgongsi{padding:0px;overflow-y:auto;color:#4d4d4d;line-height:1.6;}
.popgongsi .p2{padding:20px;}
.popgongsi img.wid{width:100%;height:auto;}
.gsconpage{padding: 20px;}
.gsconpage div{width: 100%;height:400px;}
.gsconpage div p{width:33.33%;height: 33.33%; float: left;display: block;}
.look em{display: block;overflow: hidden;position: relative;height: 100%;}
.look em img{ min-width:100%;width:auto; height:100%; display:inline-block; position:absolute; z-index:5; margin: 0px auto;top: 50%;left: 50%;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);}
.look:hover em img{opacity:1;height:100%;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(1.0) rotate(0deg);
	-moz-transform: translateX(-50%) translateY(-50%) scale(1.0) rotate(0deg);
	-ms-transform: translateX(-50%) translateY(-50%) scale(1.0) rotate(0deg);
	transform: translateX(-50%) translateY(-50%) scale(1.0) rotate(0deg);}
.look em .kb{ width:100%; height:auto; display:inline-block; position:relative; z-index:-1;top:0%;left:0%;}


.popup-content {flex:1;padding:20px;overflow-y:auto;color:#4d4d4d;font-size:1rem;line-height:1.6;}



/*  弹出窗口2  */  
/* 弹出窗口动画 animation:moveTop 0.4s ease-out;*/        
@keyframes moveTop {from {opacity:0;transform:translate(-50%,calc(-50% + 20px));}
to {opacity:1;transform:translate(-50%,-50%);}
}
@keyframes blinkOpacity {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.1; }
}
.blink-opacity { animation: blinkOpacity 3s infinite;}
.modal-wrapper {background-color:rgba(0,0,0,0.85);padding:0;display:none;position:fixed;width:100%;height:100%;z-index:3100;opacity:0;transition:opacity 0.3s ease,transform 0.3s ease;top: 0;left: 0;}
.modal-wrapper.active {display:block;opacity:1;display:flex;flex-direction: column;}
.modal-content {display:flex;align-items: center;justify-content:center;height: 100vh;}
.modal-content img{width:100%;}
/* 关闭按钮 */        
.btn-close2{position:absolute;top:20px;right:20px;width:36px;height:36px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.btn-close2 span{color:#fff;font-size:2rem;}



.bgw{ background-color: #fff;}
.bgw a{ background-color: #fff;}
/*正文*/
.zw-con{position: relative;background: #e5e3e1;color: #4d4d4d;width:100%;height:100%;}
.zw{ margin:30px 0;padding:0px 20px; font-family: "微软雅黑", "Hiragino Sans GB"; font-size: 1rem; line-height: 1.4;background-color: #fff;overflow-y: auto;}
.zw-tit{ text-align: center; padding-bottom: 15px; font-size:1.5rem;font-weight: 700;}
.zw-tit2 { text-align: center;font-size:1rem; padding:15px 0px;border-bottom: 1px solid #ddd;margin: 0 0 12px 0;}

.zw h1{font-size:20px;color:var(--color-main);padding:15px 30px 10px 0px;margin-bottom:10px;border-bottom:var(--color-main) solid 2px; display:block;font-weight: 500;}
.zw h2{font-size:18px;color:var(--color-main);padding:15px 30px 10px 0px;margin-bottom:10px;display:block;font-weight: 500;}
.zw p {padding: 10px 0 10px 0;}
.zw img{padding:0 0 0px 0; max-width: 100%; }
.zw video{padding:0 0 0px 0; max-width: 100%; }
.zw ul,.zw ol{ margin-left:25px;}
.zw ul li{list-style-type: disc;}
.zw ol li{list-style-type:decimal;}
.zw ul li,.zw ol li{padding:0px;-webkit-margin-before: 0em; -webkit-margin-after: 0em; -webkit-margin-start: 0px;-webkit-margin-end: 0px;-webkit-padding-start: 0px;}
.zw table{border-collapse:collapse;margin:10px 0; width:100%;}
.zw th,.zw td{border:#d9d8d4 solid 1px; border-bottom:#d9d8d4 solid 1px; padding:10px;color:#333;font-size:12px; line-height:20px;}
.zw th{ border-bottom:#666 solid 2px; background-color: #fff;}











/* 响应式调整 */       
 @media (max-width:480px) {

}

/* 屏幕编号显示 */        
.screen-number {display: none; position:absolute;bottom:30px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,0.8);font-size:0.9rem;padding:8px 16px;background:rgba(0,0,0,0.2);border-radius:20px;}

/* 导航提示 */        
.nav-hint {position:absolute;bottom:20px;left:50%;transform:translateX(-50%);color:rgb(155, 155, 155);font-size:0.9rem;display:flex;flex-direction:column;align-items:center;gap:5px;}
.nav-hint i {animation:bounce 2s infinite;font-size: 20px;}
@keyframes bounce {0%,20%,50%,80%,100% {transform:translateY(0);}
40% {transform:translateY(-10px);}
60% {transform:translateY(-5px);}
}